MediaWiki:Common.js: Difference between revisions

From Heroes 3 wiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(12 intermediate revisions by the same user not shown)
Line 3: Line 3:
(function () {
(function () {


var MultiString = function(f) {
var heroesStyleSheet = new CSSStyleSheet();
  return f.toString().split('\n').slice(1, -1).join('\n');
heroesStyleSheet.replaceSync('#content,h1,h2,h3,h4{color:#fff}#p-views,.vector-menu-tabs-legacy li a{background:0 0;height:initial}body{background:url(https://heroes.thelazy.net/images/9/9f/Shroud.png)}#mw-head,#mw-head-base,#mw-page-base{background:0 0}div.mw-body-content.mw-content-ltr,table{color:#fff;background:url(https://heroes.thelazy.net/images/b/b4/Leather-extra-dark.png)}#mw-content-text,div.mw-body-content.mw-content-ltr{border-image-source:url(https://heroes.thelazy.net/images/c/c7/Border-gold.png);border-image-slice:8 9 8 9;border-image-width:8px 9px 8px 9px;border-image-outset:8px 9px 8px 9px;border-image-repeat:repeat repeat}#content,.vector-menu-content{border-image-slice:48 48 48 48;border-image-width:48px 48px 48px 48px;border-image-outset:0 0 0 0;border-image-repeat:repeat repeat}#content{border-image-source:url(https://heroes.thelazy.net/images/4/43/Border-blue.png);background:url(https://heroes.thelazy.net/images/3/3d/Leather.png);margin-top:4px;padding:48px}.vector-menu-content{border-image-source:url(https://heroes.thelazy.net/images/2/2a/Border-red.png)}.vector-legacy-sidebar .vector-menu-portal .vector-menu-content{padding:24px;margin:0;background:url(https://heroes.thelazy.net/images/8/82/Marble.png)}a,a:visited{color:#add8e6!important}.mw-redirectedfrom,.vector-menu-heading-label{color:#fff!important}#left-navigation .vector-menu-content-list,#left-navigation .vector-menu-tabs{border:2px solid #b8860b}.vector-menu-tabs .vector-menu-content{border:2px solid #000}li.mw-list-item{background:0 0!important;padding:.2em .6em}.vector-menu-tabs .vector-menu-content-list li:not(:last-child){border-right:2px solid #daa520}.vector-menu-tabs-legacy li a{padding:0;margin:0}#p-personal .vector-menu-content-list{border:none}#mw-content-text{padding:8px}#p-tb-label{display:none}');
}
 
var heroesStyleCSS = MultiString(function() {/**
      // Backgrounds
      body {
        background: url('https://heroes.thelazy.net/images/9/9f/Shroud.png')
      }
 
      #mw-head-base, #mw-head, #mw-page-base {
        background: transparent;
      }
 
      // Dark inner area
      table,
      div.mw-body-content.mw-content-ltr {
        color: white;
        background: url('https://heroes.thelazy.net/images/2/2a/Leather-dark.png');
      }
 
      // Items with borders
      div.mw-body-content.mw-content-ltr,
      #mw-content-text
      {
        border-image-source: url('https://heroes.thelazy.net/images/c/c7/Border-gold.png');
        border-image-slice: 8 9 8 9;
        border-image-width: 8px 9px 8px 9px;
        border-image-outset: 8px 9px 8px 9px;
        border-image-repeat: repeat repeat;
      }
 
      // Thick blue border
      #content {
        border-image-source: url('https://heroes.thelazy.net/images/4/43/Border-blue.png');
        border-image-slice: 48 48 48 48;
        border-image-width: 48px 48px 48px 48px;
        border-image-outset: 0px 0px 0px 0px;
        border-image-repeat: repeat repeat;
      }
 
      // Thick red border
      .vector-menu-content {
        border-image-source: url('https://heroes.thelazy.net/images/2/2a/Border-red.png');
        border-image-slice: 48 48 48 48;
        border-image-width: 48px 48px 48px 48px;
        border-image-outset: 0px 0px 0px 0px;
        border-image-repeat: repeat repeat;
      }
 
      .vector-legacy-sidebar .vector-menu-portal .vector-menu-content {
        padding: 24px;
        margin: 0;
        background: url('https://heroes.thelazy.net/images/8/82/Marble.png');
      }
 
      #content {
        background: url('https://heroes.thelazy.net/images/3/3d/Leather.png');
        color:  white;
        margin-top: 4px;
      }
 
      #content {
        padding:  48px;
      }
 
      // Headings
      h1, h2, h3, h4 {
        color:  white;
      }
 
      // Links
      a, a:visited {
        color: lightblue !important;
      }
 
      // Font colors
      .vector-menu-heading-label, .mw-redirectedfrom {
        color: white !important;
      }
 
      // Tabs are annoying
      #left-navigation .vector-menu-tabs {
        border: 2px solid darkgoldenrod;
      }
      .vector-menu-tabs .vector-menu-content {
        border: 2px solid black;
      }
      #left-navigation .vector-menu-content-list {
        border: 2px solid darkgoldenrod;
      }
      li.mw-list-item {
        background: transparent !important;
        padding: 0.2em 0.6em;
      }
      .vector-menu-tabs .vector-menu-content-list li:not(:last-child) {
        border-right: 2px solid goldenrod;
      }
 
      .vector-menu-tabs-legacy li a {
        background: none;
        height: initial;
        padding: 0;
        margin: 0;
      }
 
      // Top menu list is different
      #p-personal .vector-menu-content-list {
        border: none;
      }
 
      #mw-content-text {
        padding: 8px;
      }
 
      // Disable tools header
      #p-tb-label {
        display: none;
      }
 
      // Disable sliver of image
      #p-views {
        background: none;
        height: initial;
      }
**/});


function getCookie(cname) {
function getCookie(cname) {
Line 152: Line 28:
   }
   }
   elems = document.querySelectorAll('.' + linkSelector + desc);
   elems = document.querySelectorAll('.' + linkSelector + desc);
   for (var i = 0; i < elems.length; i++) {
   for (i = 0; i < elems.length; i++) {
     elems[i].style = 'user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
     elems[i].style = 'white-space: nowrap; user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
   }
   }
}
}
Line 163: Line 39:
   }
   }
   elems = document.querySelectorAll('.initialOnly');
   elems = document.querySelectorAll('.initialOnly');
   for (var i = 0; i < elems.length; i++) {
   for (i = 0; i < elems.length; i++) {
     elems[i].style = 'display:none;';
     elems[i].style = 'display:none;';
   }
   }
Line 202: Line 78:
}
}


function toggleHeroesStyle() {
function setHeroesStyle() {
  togglePreference('switchHeroesStyle', 'heroesStyle', 'heroesStyleDisabled', 'heroesStyleEnabled', 'Enable H3CSS', 'Disable H3CSS', 'Heroes Style');
   var preference = getCookie('heroesStyle');
   var preference = getCookie('heroesStyle');
  console.log(preference)
   if (preference == 'heroesStyleEnabled') {
   if (preference == 'heroesStyleEnabled') {
    const sheet = new CSSStyleSheet();
     document.adoptedStyleSheets.push(heroesStyleSheet);
    sheet.replaceSync(heroesStyleCSS);
     document.adoptedStyleSheets.push(sheet);
   } else {
   } else {
     while (document.adoptedStyleSheets.pop());
     while (document.adoptedStyleSheets.pop());
   }
   }
}
function toggleHeroesStyle() {
  togglePreference('switchHeroesStyle', 'heroesStyle', 'heroesStyleDisabled', 'heroesStyleEnabled', 'Disable H3CSS', 'Enable H3CSS', 'Heroes Style');
  setHeroesStyle();
}
}


Line 224: Line 101:
     if (!switchView) {
     if (!switchView) {
       switchView = document.createElement('li');
       switchView = document.createElement('li');
       switchView.style = 'user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
       switchView.style = 'white-space: nowrap; user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
       switchView.id = linkSelector;
       switchView.id = linkSelector;
       switchView.title = prefName + ' (toggle)';
       switchView.title = prefName + ' (toggle)';
Line 232: Line 109:
       for (var i = 0; i < elems.length; i++) {
       for (var i = 0; i < elems.length; i++) {
         elems[i].addEventListener('click', toggleFunc);
         elems[i].addEventListener('click', toggleFunc);
         elems[i].style = 'user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
         elems[i].style = 'white-space: nowrap; user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
       }
       }
     }
     }
Line 250: Line 127:
     if (!switchView2) {
     if (!switchView2) {
       switchView2 = document.createElement('li');
       switchView2 = document.createElement('li');
       switchView2.style = 'user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
       switchView2.style = 'white-space: nowrap; user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
       switchView2.id = linkSelector + '2';
       switchView2.id = linkSelector + '2';
       switchView2.title = prefName + ' (toggle)';
       switchView2.title = prefName + ' (toggle)';
Line 291: Line 168:
   }
   }
   removeUnwantedTitles();
   removeUnwantedTitles();
   initPreference('switchHeroesStyle', 'heroesStyle', 'heroesStyleDisabled', 'heroesStyleEnabled', 'Enable H3CSS', 'Disable H3CSS', 'Heroes Style', toggleHeroesStyle);
   initPreference('switchHeroesStyle', 'heroesStyle', 'heroesStyleDisabled', 'heroesStyleEnabled', 'Disable H3CSS', 'Enable H3CSS', 'Heroes Style', toggleHeroesStyle);
  setHeroesStyle();
}
}


window.addEventListener('readystatechange', function () {
try {
   initCommon();
   initCommon();
});
} catch (error) {
 
   $(document).ready(initCommon);
window.addEventListener('DOMContentLoaded', function () {
}
   initCommon();
});
 
window.addEventListener('load', function () {
  initCommon();
});
 
initCommon();


})();
})();

Latest revision as of 20:38, 4 October 2024

/* Any JavaScript here will be loaded for all users on every page load. */

(function () {

var heroesStyleSheet = new CSSStyleSheet();
heroesStyleSheet.replaceSync('#content,h1,h2,h3,h4{color:#fff}#p-views,.vector-menu-tabs-legacy li a{background:0 0;height:initial}body{background:url(https://heroes.thelazy.net/images/9/9f/Shroud.png)}#mw-head,#mw-head-base,#mw-page-base{background:0 0}div.mw-body-content.mw-content-ltr,table{color:#fff;background:url(https://heroes.thelazy.net/images/b/b4/Leather-extra-dark.png)}#mw-content-text,div.mw-body-content.mw-content-ltr{border-image-source:url(https://heroes.thelazy.net/images/c/c7/Border-gold.png);border-image-slice:8 9 8 9;border-image-width:8px 9px 8px 9px;border-image-outset:8px 9px 8px 9px;border-image-repeat:repeat repeat}#content,.vector-menu-content{border-image-slice:48 48 48 48;border-image-width:48px 48px 48px 48px;border-image-outset:0 0 0 0;border-image-repeat:repeat repeat}#content{border-image-source:url(https://heroes.thelazy.net/images/4/43/Border-blue.png);background:url(https://heroes.thelazy.net/images/3/3d/Leather.png);margin-top:4px;padding:48px}.vector-menu-content{border-image-source:url(https://heroes.thelazy.net/images/2/2a/Border-red.png)}.vector-legacy-sidebar .vector-menu-portal .vector-menu-content{padding:24px;margin:0;background:url(https://heroes.thelazy.net/images/8/82/Marble.png)}a,a:visited{color:#add8e6!important}.mw-redirectedfrom,.vector-menu-heading-label{color:#fff!important}#left-navigation .vector-menu-content-list,#left-navigation .vector-menu-tabs{border:2px solid #b8860b}.vector-menu-tabs .vector-menu-content{border:2px solid #000}li.mw-list-item{background:0 0!important;padding:.2em .6em}.vector-menu-tabs .vector-menu-content-list li:not(:last-child){border-right:2px solid #daa520}.vector-menu-tabs-legacy li a{padding:0;margin:0}#p-personal .vector-menu-content-list{border:none}#mw-content-text{padding:8px}#p-tb-label{display:none}');

function getCookie(cname) {
  var name = cname + '=';
  var decodedCookie = decodeURIComponent(document.cookie);
  var ca = decodedCookie.split(';');
  for (var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == ' ') {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return '';
}

function showElements(desc, linkSelector) {
  var elems = document.querySelectorAll(desc);
  for (var i = 0; i < elems.length; i++) {
    elems[i].style = '';
  }
  elems = document.querySelectorAll('.' + linkSelector + desc);
  for (i = 0; i < elems.length; i++) {
    elems[i].style = 'white-space: nowrap; user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
  }
}

function hideElements(desc) {
  var elems = document.querySelectorAll(desc);
  for (var i = 0; i < elems.length; i++) {
    elems[i].style = 'display:none;';
  }
  elems = document.querySelectorAll('.initialOnly');
  for (i = 0; i < elems.length; i++) {
    elems[i].style = 'display:none;';
  }
}

function togglePreference(linkSelector, cookieName, cookie1, cookie2, link1, link2) {
  var preference = getCookie(cookieName);
  var switchView = document.querySelector('#' + linkSelector);
  var switchView2 = document.querySelector('#' + linkSelector + '2');
  if (preference == cookie2) {
    preference = cookie1;
    switchView.textContent = link2;
    switchView2.textContent = link2;
    hideElements('.only' + cookie2);
    showElements('.only' + cookie1, linkSelector);
  } else {
    preference = cookie2;
    switchView.textContent = link1;
    switchView2.textContent = link1;
    hideElements('.only' + cookie1);
    showElements('.only' + cookie2, linkSelector);
  }
  var CookieDate = new Date();
  CookieDate.setFullYear(CookieDate.getFullYear() + 1);
  document.cookie = cookieName + '=' + preference + '; expires=' + CookieDate.toUTCString() + ';';
}

function togglePreferredExpansion() {
  togglePreference('switchExpansion', 'preferredExpansion', 'hota', 'sod', 'Enable HotA', 'Disable HotA', 'Horn of the Abyss');
}

function togglePreferredView() {
  togglePreference('switchView', 'preferredView', 'modern', 'legacy', 'Enable Modern', 'Enable Legacy', 'Legacy/Modern');
}

function toggleDoR() {
  togglePreference('switchDoR', 'preferredDoR', 'dor', 'nodor', 'Enable DoR', 'Disable DoR', 'Day of Reckoning');
}

function setHeroesStyle() {
  var preference = getCookie('heroesStyle');
  if (preference == 'heroesStyleEnabled') {
    document.adoptedStyleSheets.push(heroesStyleSheet);
  } else {
    while (document.adoptedStyleSheets.pop());
  }
}

function toggleHeroesStyle() {
  togglePreference('switchHeroesStyle', 'heroesStyle', 'heroesStyleDisabled', 'heroesStyleEnabled', 'Disable H3CSS', 'Enable H3CSS', 'Heroes Style');
  setHeroesStyle();
}

function initPreference(linkSelector, cookieName, cookie1, cookie2, link1, link2, prefName, toggleFunc) {
  var userlink = document.querySelector('#pt-anonuserpage');
  if (!userlink) {
    userlink = document.querySelector('#pt-userpage');
  }
  if (userlink) {
    var switchView = document.querySelector('#' + linkSelector);
    if (!switchView) {
      switchView = document.createElement('li');
      switchView.style = 'white-space: nowrap; user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
      switchView.id = linkSelector;
      switchView.title = prefName + ' (toggle)';
      switchView.addEventListener('click', toggleFunc);
      userlink.parentElement.insertBefore(switchView, null);
      var elems = document.querySelectorAll('.' + linkSelector);
      for (var i = 0; i < elems.length; i++) {
        elems[i].addEventListener('click', toggleFunc);
        elems[i].style = 'white-space: nowrap; user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
      }
    }
    if (getCookie(cookieName) == cookie2) {
      switchView.textContent = link1;
      hideElements('.only' + cookie1);
      showElements('.only' + cookie2);
    } else {
      switchView.textContent = link2;
      hideElements('.only' + cookie2);
      showElements('.only' + cookie1);
    }
  }
  var mwpanelul = document.querySelector('#mw-panel ul');
  if (mwpanelul) {
    var switchView2 = document.querySelector('#' + linkSelector + '2');
    if (!switchView2) {
      switchView2 = document.createElement('li');
      switchView2.style = 'white-space: nowrap; user-select:none; cursor: pointer; color: rgb(102, 177, 250);';
      switchView2.id = linkSelector + '2';
      switchView2.title = prefName + ' (toggle)';
      switchView2.addEventListener('click', toggleFunc);
      mwpanelul.insertBefore(switchView2, null);
    }
    if (getCookie(cookieName) == cookie2) {
      switchView2.textContent = link1;
      hideElements('.only' + cookie1);
      showElements('.only' + cookie2);
    } else {
      switchView2.textContent = link2;
      hideElements('.only' + cookie2);
      showElements('.only' + cookie1);
    }
  }
}

function removeTooltips() {
  var elems = document.querySelectorAll('.mainpage .tabs-content div div a');
  for (var i = 0; i < elems.length; i++) {
    elems[i].title = '';
  }
}

function removeUnwantedTitles() {
  var elems = document.querySelectorAll('#p-logo a');
  for (var i = 0; i < elems.length; i++) {
    elems[i].title = '';
  }
}

function initCommon() {
  initPreference('switchExpansion', 'preferredExpansion', 'hota', 'sod', 'Enable HotA', 'Disable HotA', 'Horn of the Abyss', togglePreferredExpansion);
  initPreference('switchDoR', 'preferredDoR', 'dor', 'nodor', 'Enable DoR', 'Disable DoR', 'Day of Reckoning', toggleDoR);
  var mainpage = document.querySelector('.mainpage.onlysod.onlyhota');
  if (mainpage) {
    initPreference('switchView', 'preferredView', 'modern', 'legacy', 'Enable Modern', 'Enable Legacy', 'Legacy/Modern', togglePreferredView);
    removeTooltips();
  }
  removeUnwantedTitles();
  initPreference('switchHeroesStyle', 'heroesStyle', 'heroesStyleDisabled', 'heroesStyleEnabled', 'Disable H3CSS', 'Enable H3CSS', 'Heroes Style', toggleHeroesStyle);
  setHeroesStyle();
}

try {
  initCommon();
} catch (error) {
  $(document).ready(initCommon);
}

})();