MediaWiki:Vector.js: Difference between revisions

MediaWiki interface page
m (Bringing back this old code to see if I can somehow make it work)
m (trying out re-structuring a little)
Line 3: Line 3:
   if ( mw.storage.get( 'client-dark-mode-toggle' ) === '1' ) {
   if ( mw.storage.get( 'client-dark-mode-toggle' ) === '1' ) {
     mw.util.addPortletLink( 'p-personal', '#', 'Light mode', 'pt-lightmode', '', 'np', '#pt-watchlist' );
     mw.util.addPortletLink( 'p-personal', '#', 'Light mode', 'pt-lightmode', '', 'np', '#pt-watchlist' );
    mw.util.addPortletLink( 'p-personal', '#', 'Colorful mode', 'pt-colorful', '', 'np', '#pt-watchlist' );
   } else {
   }
  else {
     mw.util.addPortletLink( 'p-personal', '#', 'Dark mode', 'pt-darkmode', '', 'np', '#pt-watchlist' );
     mw.util.addPortletLink( 'p-personal', '#', 'Dark mode', 'pt-darkmode', '', 'np', '#pt-watchlist' );
    mw.util.addPortletLink( 'p-personal', '#', 'Monochrome mode', 'pt-monochrome', '', 'np', '#pt-watchlist' );
   }
   }
   $( function () {
   $( function () {
Line 16: Line 13:
       location.reload();
       location.reload();
     } );
     } );
     $( '#pt-lightmode' ).on( 'click', function( e ) {
     $( '#pt-lightmode' ).on( 'click', function( e ) {
       var $html = $( 'html' );
       var $html = $( 'html' );
Line 22: Line 20:
       location.reload();
       location.reload();
     } );
     } );
     $( '#pt-monochrome' ).on( 'click', function( e ) {
  } );
       var $html = $( 'html' );
 
  if (mw.storage.get('client-monochrome-toggle') === '1') {
    mw.util.addPortletLink('p-personal', '#', 'Colorful mode', 'pt-colorful', '', 'np', '#pt-watchlist');
  } else {
    mw.util.addPortletLink('p-personal', '#', 'Monochrome mode', 'pt-monochrome', '', 'np', '#pt-watchlist');
  }
  $(function() {
     $('#pt-monochrome').on('click', function(e) {
       var $html = $('html');
       e.preventDefault();
       e.preventDefault();
       mw.storage.set('client-monochrome-toggle', '1');
       mw.storage.set('client-monochrome-toggle', '1');
       location.reload();
       location.reload();
     } );
     });
     $( '#pt-colorful' ).on( 'click', function( e ) {
 
       var $html = $( 'html' );
     $('#pt-colorful').on('click', function(e) {
       var $html = $('html');
       e.preventDefault();
       e.preventDefault();
       mw.storage.set('client-monochrome-toggle', '0');
       mw.storage.set('client-monochrome-toggle', '0');
       location.reload();
       location.reload();
     } );
     });
   } );
   });
} );
} );

Revision as of 23:13, 26 May 2022

/* All JavaScript here will be loaded for users of the Vector skin */
mw.loader.using( 'mediawiki.storage' ).then( function () {
  if ( mw.storage.get( 'client-dark-mode-toggle' ) === '1' ) {
    mw.util.addPortletLink( 'p-personal', '#', 'Light mode', 'pt-lightmode', '', 'np', '#pt-watchlist' );
  } else {
    mw.util.addPortletLink( 'p-personal', '#', 'Dark mode', 'pt-darkmode', '', 'np', '#pt-watchlist' );
  }
  $( function () {
    $( '#pt-darkmode' ).on( 'click', function( e ) {
      var $html = $( 'html' );
      e.preventDefault();
      mw.storage.set('client-dark-mode-toggle', '1');
      location.reload();
    } );

    $( '#pt-lightmode' ).on( 'click', function( e ) {
      var $html = $( 'html' );
      e.preventDefault();
      mw.storage.set('client-dark-mode-toggle', '0');
      location.reload();
    } );
  } );

  if (mw.storage.get('client-monochrome-toggle') === '1') {
    mw.util.addPortletLink('p-personal', '#', 'Colorful mode', 'pt-colorful', '', 'np', '#pt-watchlist');
  } else {
    mw.util.addPortletLink('p-personal', '#', 'Monochrome mode', 'pt-monochrome', '', 'np', '#pt-watchlist');
  }
  $(function() {
    $('#pt-monochrome').on('click', function(e) {
      var $html = $('html');
      e.preventDefault();
      mw.storage.set('client-monochrome-toggle', '1');
      location.reload();
    });

    $('#pt-colorful').on('click', function(e) {
      var $html = $('html');
      e.preventDefault();
      mw.storage.set('client-monochrome-toggle', '0');
      location.reload();
    });
  });
} );