MediaWiki:Common.js

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

(function() {

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 changeBorder() {
  var optionInput = document.querySelector('#cardBorderChanger');
  var curVal = 0;
  if (optionInput.checked) {
    curVal = 11;
  }
  var CookieDate = new Date();
  CookieDate.setFullYear(CookieDate.getFullYear() + 1);
  document.cookie = 'cardbordersize=' + curVal + '; expires=' + CookieDate.toUTCString() + ';';
  setBlackBorder(curVal);
}

function setBlackBorder(bSize) {
  var elems = document.querySelectorAll('img');
  for (var i = 0; i < elems.length; i++) {
    var elem = elems[i];
    var newSize = 0;
    switch (elem.offsetWidth) {
      case 75:
        newSize = 4;
        break;
      case 100:
        newSize = 5;
        break;
      case 120:
        newSize = 6;
        break;
      case 150:
        newSize = 8;
        break;
      case 160:
        newSize = 9;
        break;
      case 200:
        newSize = 11;
        break;
      case 320:
        newSize = 11;
        break;
      case 375:
        newSize = 21;
        break;
      case 800:
        newSize = 21;
        break;
    }
    if (newSize > 0) {
      if (bSize == 0) {
        newSize = 0;
      }
      if (elem.parentElement.className != 'cardborderchanger') {
        elem.outerHTML = '<span class="cardborderchanger" style="display:inline-block; padding:' + newSize + 'px; border-radius:' + (newSize - 1) + 'px; background:black;">' + elem.outerHTML + '</span>';
      } else if (elem.parentElement.className == 'cardborderchanger') {
        elem.parentElement.style.padding = newSize + 'px';
        elem.parentElement.style.borderRadius = (newSize - 1) + 'px';
      }
    }
  }
}

function initBlackBorder(e) {
  var elem = e.target.parentElement.parentElement.querySelector('img');
  var curVal = getCookie('cardbordersize');
  if (curVal > 0) {
    var newSize = 0;
    switch (elem.offsetWidth) {
      case 75:
        newSize = 4;
        break;
      case 100:
        newSize = 5;
        break;
      case 120:
        newSize = 6;
        break;
      case 150:
        newSize = 8;
        break;
      case 160:
        newSize = 9;
        break;
      case 200:
        newSize = 11;
        break;
      case 320:
        newSize = 11;
        break;
      case 375:
        newSize = 21;
        break;
      case 800:
        newSize = 21;
        break;
    }
    if (newSize > 0) {
      if (elem.parentElement.className != 'cardborderchanger') {
        elem.outerHTML = '<span class="cardborderchanger" style="display:inline-block; padding:' + newSize + 'px; border-radius:' + (newSize - 1) + 'px; background:black;">' + elem.outerHTML + '</span>';
      } else if (elem.parentElement.className == 'cardborderchanger') {
        elem.parentElement.style.padding = newSize + 'px';
        elem.parentElement.style.borderRadius = (newSize - 1) + 'px';
      }
    }
  }
}

function addSiteOption(optionCookie, optionId, optionText, optionDefault, optionFunc, optionSetFunc) {
  if (!document.querySelector('#' + optionId)) {
    var curVal = getCookie(optionCookie);
    var checked = '';
    if (curVal == '') {
      curVal = optionDefault;
    }
    if (curVal > 0) {
      checked = 'checked';
      optionSetFunc(curVal);
    }
    var pNavigationUl = document.querySelector('#p-navigation ul');
    var optionLi = document.createElement('li');
    optionLi.innerHTML = '<label for="'+ optionId +'" style="cursor:pointer; user-select:none">'+optionText+'&nbsp;</label><input style="height:8px" type="checkbox" id="'+ optionId +'" '+ checked +'>';
    pNavigationUl.insertBefore(optionLi, null);
    var optionInput = document.querySelector('#' + optionId);
    optionInput.addEventListener('change', optionFunc);
  }
}

function fixCardPopup(e) {
  var elem;
  if (e.target) {
    elem = e.target.parentElement.nextElementSibling;
  } else {
    elem = e;
  }
  if (elem.getBoundingClientRect().x > window.innerWidth / 2) {
    elem.style.left = '-' + (elem.offsetWidth - elem.previousElementSibling.offsetWidth + 20) + 'px';
  }
}

function fixCardPopups() {
  var elems = document.querySelectorAll('.card-popup > a');
  for (var i = 0; i < elems.length; i++) {
    elems[i].title = '';
    elems[i].addEventListener('mouseover', fixCardPopup);
    elems[i].addEventListener('mouseover', initBlackBorder);
  }
  elems = document.querySelectorAll('.card-popup > span > img');
  for (i = 0; i < elems.length; i++) {
    fixCardPopup(elems[i].parentElement);
  }
}

function toggleSidebarExpansions() {
  var optionInput = document.querySelector('#showExpansionsChanger');
  var curVal = 0;
  if (optionInput.checked == true) {
    curVal = 1;
  }
  setSidebarExpansions(curVal);
  var CookieDate = new Date();
  CookieDate.setFullYear(CookieDate.getFullYear() + 1);
  document.cookie = 'showexpansions=' + curVal + '; expires=' + CookieDate.toUTCString() + ';';
}

function setSidebarExpansions(curVal) {
  if (curVal == 'cookie') {
    curVal = getCookie('showexpansions');
    if (curVal == '') {
      curVal = 1;
    }
  }
  var visibility = 'none';
  if (curVal == 1) {
    visibility = 'block';
  }
  var elems = document.querySelectorAll('.showExpansionItem');
  for (var i = 0; i < elems.length; i++) {
    elems[i].style.display = visibility;
  }
}

function addExpansionLink(link, title) {
  var pNavigationUl = document.querySelector('#p-navigation ul');
  var optionLi = document.createElement('li');
  optionLi.classList.add('showExpansionItem');
  var urlBase = '/index.php/';
  optionLi.innerHTML = '<a href="'+urlBase+link+'">'+title+'</a>';
  pNavigationUl.insertBefore(optionLi, null);
}

function addExpansionSidebarLinks() {
  var pNavigationUl = document.querySelector('#p-navigation ul');
  if (pNavigationUl && !document.querySelector('#expansionSidebarLinks')) {
    var expansionSidebarLinks = document.createElement('span');
    expansionSidebarLinks.id = 'expansionSidebarLinks';
    pNavigationUl.insertBefore(expansionSidebarLinks, null);
    // addExpansionLink('Expansions', 'Expansions');
    addExpansionLink('Dominion (Base Set)', 'Dominion');
    addExpansionLink('Intrigue', 'Intrigue');
    addExpansionLink('Seaside', 'Seaside');
    addExpansionLink('Alchemy', 'Alchemy');
    addExpansionLink('Prosperity', 'Prosperity');
    addExpansionLink('Cornucopia & Guilds', 'Cornucopia & Guilds');
    addExpansionLink('Hinterlands', 'Hinterlands');
    addExpansionLink('Dark Ages', 'Dark Ages');
    addExpansionLink('Adventures', 'Adventures');
    addExpansionLink('Empires', 'Empires');
    addExpansionLink('Nocturne', 'Nocturne');
    addExpansionLink('Renaissance', 'Renaissance');
    addExpansionLink('Menagerie (expansion)', 'Menagerie');
    addExpansionLink('Allies', 'Allies');
    addExpansionLink('Plunder (expansion)', 'Plunder');
    addExpansionLink('Rising Sun', 'Rising Sun');
    addExpansionLink('Promo', 'Promos');
  }
}

function sortSortables(startsort, sortby, sortid) {
  var cardsByName = [];
  var cardsByCostName = [];
  var hasNonZeroCost = false;
  var elems = startsort.querySelectorAll('.cardcost');
  for (var i = 0; i < elems.length; i++) {
    var cardname = elems[i].querySelector('a').title;
    cardsByName.push([cardname, elems[i]]);
    for (var j = 0; j < elems[i].classList.length; j++) {
      var costplus = elems[i].classList[j];
      var re = /^cost/i;
      var found = costplus.match(re);
      if (found) {
        var costpluscardname = costplus + cardname;
        cardsByCostName.push([costpluscardname, elems[i]]);
        if (costplus != 'cost$00' && costplus != 'cost') {
          hasNonZeroCost = true;
        }
      }
    }
  }
  var sortlist = [];
  if (sortby == 'sortbyname') {
    cardsByName.sort(function(a, b) {
      var a0 = a[0].toLowerCase();
      var b0 = b[0].toLowerCase();
      if (a0 < b0) {
        return -1;
      }
      if (a0 > b0) {
        return 1;
      }
      return 0;
    });
    sortlist = cardsByName;
  } else {
    cardsByCostName.sort(function(a, b) {
      var a0 = a[0].toLowerCase();
      var b0 = b[0].toLowerCase();
      if (a0 < b0) {
        return -1;
      }
      if (a0 > b0) {
        return 1;
      }
      return 0;
    });
    sortlist = cardsByCostName;
  }
  for (i = 0; i < sortlist.length; i++) {
    startsort.insertBefore(sortlist[i][1], null);
  }
  elems = document.querySelectorAll('.switchsort.sortbyname.' + sortid);
  for (i = 0; i < elems.length; i++) {
    if (sortby == 'sortbyname' || !hasNonZeroCost) {
      elems[i].style.display = 'none';
    } else {
      elems[i].style.display = '';
    }
  }
  elems = document.querySelectorAll('.switchsort.sortbycost.' + sortid);
  for (i = 0; i < elems.length; i++) {
    if (sortby == 'sortbycost' || !hasNonZeroCost) {
      elems[i].style.display = 'none';
    } else {
      elems[i].style.display = '';
    }
  }
}

function startSort(e) {
  var sortby = '';
  var sortid = '';
  for (var i = 0; i < e.target.classList.length; i++) {
      var re = /^sortby/i;
      var found = e.target.classList[i].match(re);
      if (found) {
        sortby = e.target.classList[i];
      }
      var re2 = /^sortid/i;
      var found2 = e.target.classList[i].match(re2);
      if (found2) {
        sortid = e.target.classList[i];
      }
  }
  var elems = document.querySelectorAll('.startsort.' + sortid);
  for (i = 0; i < elems.length; i++) {
    sortSortables(elems[i], sortby, sortid);
  }
}

function initSorting() {
  var elems = document.querySelectorAll('.switchsort');
  for (var i = 0; i < elems.length; i++) {
    elems[i].addEventListener('click', startSort);
  }
  elems = document.querySelectorAll('.switchsort.sortbyname');
  for (i = 0; i < elems.length; i++) {
    elems[i].click();
  }
}

function setCardSortBy(curVal) {
  if (curVal == 'cookie') {
    curVal = getCookie('cardsortby');
    if (curVal == '') {
      curVal = 0;
    }
  }
  if (curVal == 1) {
    var elems = document.querySelectorAll('.switchsort.sortbycost');
    for (var i = 0; i < elems.length; i++) {
      elems[i].click();
    }
  } else {
    var elems = document.querySelectorAll('.switchsort.sortbyname');
    for (var i = 0; i < elems.length; i++) {
      elems[i].click();
    }
  }
}

function changeCardSortBy() {
  var optionInput = document.querySelector('#cardGallerySorter');
  var curVal = 0;
  if (optionInput.checked) {
    curVal = 1;
  }
  var CookieDate = new Date();
  CookieDate.setFullYear(CookieDate.getFullYear() + 1);
  document.cookie = 'cardsortby=' + curVal + '; expires=' + CookieDate.toUTCString() + ';';
  setCardSortBy(curVal);
}

function initCommon() {
  addSiteOption('cardsortby', 'cardGallerySorter', 'Sort by Cost:', 0, changeCardSortBy, setCardSortBy);
  addSiteOption('cardbordersize', 'cardBorderChanger', 'Card Border:', 0, changeBorder, setBlackBorder);
  fixCardPopups();
  addSiteOption('showexpansions', 'showExpansionsChanger', 'Show Expansions:', 1, toggleSidebarExpansions, setSidebarExpansions);
  addExpansionSidebarLinks();
  setSidebarExpansions('cookie');
  initSorting();
  setCardSortBy('cookie');
  console.log('common.js v103');
}

window.addEventListener('readystatechange', function() {
  initCommon();
});

window.addEventListener('DOMContentLoaded', function() {
  initCommon();
});

window.addEventListener('load', function() {
  initCommon();
});

//initCommon();

function add_portlet_links() {
  var PortletLinks = {
    /*
        PortletLinks[ string linkID ] = Array(
            boolean left,     // true if added on the left-side, false if right
            string label,
            string tooltip,
            string href,
            string accesskey,
            integer position  // insert position, counting from left
        )
    */
    "ca-new-section": [false, "New Section", "Add a new section", "?action=edit&section=new", "+", 3]
  };
  /*
      Add a portlet link to page
      PARAMS
          regexp/string page: RegExp or exact match string of page titles to add portlet link
          string id         : linkID of the added portlet link
  */
  function add(page, id) {
    if (typeof page == "string") {
      if (wgPageName != page) {
        return false;
      }
    } else if (!page.test(wgPageName)) {
      return false;
    }
    var link = PortletLinks[id];
    if (!link) {
      return false;
    }
    var vector = link[0] ? 'p-namespaces' : 'p-views';
    return mw.util.addPortletLink(vector, link[3], link[1], id, link[2], link[4], $('#' + vector + ' li')[link[5] - 1]);
  }
  add('DominionStrategy_Wiki:Council_Room', 'ca-new-section');
}

$(document).ready(add_portlet_links);

})();