12,727
edits
MediaWiki:Common.js: Difference between revisions
From Melvor Idle
Amend dark mode code
Falterfire (talk | contribs) (Stealing code from the OSRS wiki to try to get highlighting tables working) |
(Amend dark mode code) |
||
| (21 intermediate revisions by 3 users not shown) | |||
| Line 90: | Line 90: | ||
*/ | */ | ||
(function($, mw | (function($, mw) { | ||
'use strict'; | 'use strict'; | ||
var hasLocalStorage = function(){ | |||
try { | |||
localStorage.setItem('test', 'test') | |||
localStorage.removeItem('test') | |||
return true | |||
} catch (e) { | |||
return false | |||
} | |||
} | |||
// constants | // constants | ||
var STORAGE_KEY = ' | var STORAGE_KEY = 'mi:lightTable', | ||
TABLE_CLASS = 'lighttable', | TABLE_CLASS = 'lighttable', | ||
LIGHT_ON_CLASS = 'highlight-on', | LIGHT_ON_CLASS = 'highlight-on', | ||
| Line 122: | Line 132: | ||
} | } | ||
// check the browser supports local storage | // check the browser supports local storage | ||
if (! | if (!hasLocalStorage()) { | ||
return; | return; | ||
} | } | ||
| Line 505: | Line 515: | ||
*/ | */ | ||
}(this.jQuery, this.mediaWiki | }(this.jQuery, this.mediaWiki)); | ||
// </pre> | // </pre> | ||
| Line 534: | Line 544: | ||
} | } | ||
} | } | ||
function toggleDarkMode() { | |||
document.body.classList.toggle('darkMode'); | |||
localStorage.setItem('darkMode', localStorage.getItem('darkMode') !== 'true'); | |||
} | |||
$(document).ready(function () { | $(document).ready(function () { | ||
if (document.getElementsByClassName('stickyHeader').length > 0) { | |||
setStickyHeaderTop(); | |||
$(window).resize(setStickyHeaderTop); | |||
} | |||
} | |||
); | const darkMode = localStorage.getItem('darkMode'); | ||
if (darkMode === 'true') { | |||
document.body.classList.add('darkMode'); | |||
} else { | |||
document.body.classList.remove('darkMode'); | |||
} | |||
}); | |||
// Add dark mode links to "Wiki tools" and personal tools menus | |||
$.when(mw.loader.using(['mediawiki.util']), $.ready).then( function() { | |||
var dmLinkTools = mw.util.addPortletLink('p-tb', '#', 'Dark mode', 't-darkmode', 'Toggle between a dark and light theme', null, '#t-specialpages'); | |||
var dmLinkPersonal = mw.util.addPortletLink('p-personal', '#', 'Dark mode', 'pt-darkmode', 'Toggle between a dark and light theme', null, null); | |||
dmLinkPersonal.style.marginTop = '0.5rem'; | |||
$(dmLinkTools).on('click', function(e) { | |||
e.preventDefault(); | |||
toggleDarkMode(); | |||
}); | |||
$(dmLinkPersonal).on('click', function(e) { | |||
e.preventDefault(); | |||
toggleDarkMode(); | |||
}); | |||
} ); | |||
