User:Splarka/togglegallery.js

Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.

/* __NOGALLERY__ toggler, version [0.0.3a]
Originally from: http://en.wikipedia.org/wiki/User:Splarka/togglegallery.js

Notes:
* To internationalize, change gtMatchPath to local articlepath and Image namespace.
* Test bigger, faster, harder

Operation:
* Checks the page for <div id="mw-category-media">
** If found, remove the table and build a list of all the images
* Else, checks for <div id="mw-pages">
** Iterates over these for at least one Image: link. If found, adds button.
** Button iterates over all image links again, builds lists in groups of 50.
** Lists are submitted to callback.
** Callback return embeds thumbnailed image tag into each link.

Todo:
* Have galleryToggleOff() make 3 nice rows, makes a single list currently.
* Testywesty.
*/

var gtImageListWidth = 100;
var gtMatchPath = '/wiki/File:';
if(wgCanonicalNamespace == 'Category') addOnloadHook(galleryToggleCheck)
function galleryToggleCheck() {
  var mds = document.getElementById('mw-category-media');
  if(mds) {
    mw.util.addPortletLink('p-tb','javascript:galleryToggleOff()','Toggle gallery off','t-toggal','show gallery as a text list');
    return;
  }

  var pgs = document.getElementById('mw-pages');
  if(!pgs) return;
  var ul = pgs.getElementsByTagName('ul');
  for(var i=0;i<ul.length;i++) {
    var a = ul[i].getElementsByTagName('a');
    for(var j=0;j<a.length;j++) {
      if(a[j].href.indexOf(gtMatchPath) != -1) {  
        mw.util.addPortletLink('p-tb','javascript:galleryToggleOn()','Toggle gallery on','t-toggal','show category Image: links as a gallery');
        return;
      }
    }
  }
}

function galleryToggleOn() {
  injectSpinner(document.getElementById('t-toggal'),'tog');
  var pgs = document.getElementById('mw-pages');
  if(!pgs) return;
  var ul = pgs.getElementsByTagName('ul');
  var imgs = [];
  var imgrps = [];  //limit of 50 per query
  for(var i=0;i<ul.length;i++) {
    var a = ul[i].getElementsByTagName('a');
    for(var j=0;j<a.length;j++) {
      if(a[j].href.indexOf(gtMatchPath) != -1) {  
        imgs.push(encodeURIComponent(getText(a[j]).replace(/_/ig,' ')));
        if(imgs.length >= 50) {
          imgrps.push(imgs.join('|'));
          imgs = [];
        }
      }
    }
  }
  imgrps.push(imgs.join('|'));

  for(var i=0;i<imgrps.length;i++) {
    var url = mw.config.get('wgServer') + mw.config.get('wgScriptPath') + '/api.php?maxage=300&smaxage=300&format=json&callback=gtImageListCB&action=query&prop=imageinfo&iiprop=url&iiurlwidth=' + gtImageListWidth + '&iiurlheight=' + parseInt(gtImageListWidth * 1.5) + '&titles=' + imgrps[i];
    mw.loader.load(url);
  }
}

function gtImageListCB(obj) {
  document.getElementById('t-toggal').style.display = 'none';
  removeSpinner('tog');
  if(!obj['query'] || !obj['query']['pages']) return
  var thumbs = obj['query']['pages'];
  var a = document.getElementById('mw-pages').getElementsByTagName('a');

  for(var i in thumbs) {
    var title = thumbs[i]['title'];
    for(var j=0;j<a.length;j++) {
      var imgtitle = getText(a[j]).replace(/_/ig,' ');
      if(title.indexOf(imgtitle) != -1 && imgtitle != '') {
        var img = document.createElement('img');
        img.style.width = thumbs[i]['imageinfo'][0]['thumbwidth'] + 'px'; 
        img.style.height = thumbs[i]['imageinfo'][0]['thumbheight'] + 'px';
        img.style.border = '1px solid #999999';
        img.style.background = 'url("http://upload.wikimedia.org/wikipedia/commons/5/5d/Checker-16x16.png") repeat';
        img.setAttribute('title',title);
        img.setAttribute('src',thumbs[i]['imageinfo'][0]['thumburl'])
        a[j].appendChild(document.createElement('br'));
        a[j].appendChild(img);
      }
    }
  }
}

function galleryToggleOff() {
  document.getElementById('t-toggal').style.display = 'none';
  var mds = document.getElementById('mw-category-media');
  var ul = document.createElement('ul');
  var imgs = mds.getElementsByTagName('img');
  for(var i=0;i<imgs.length;i++) {
    var par = imgs[i].parentNode;
    if(par.tagName == 'A') {
      var li = document.createElement('li');
      var a = par.cloneNode(false);
      a.appendChild(document.createTextNode(a.title));
      li.appendChild(a);
      ul.appendChild(li);
    }
  }
  mds.appendChild(ul);
 
  var tables = getElementsByClassName(mds,'table','gallery');
  for(var i=tables.length-1;i>-1;i--) tables[i].parentNode.removeChild(tables[i])
}

function getText(object) {
  if (object.nodeType == 3) return object.nodeValue;
  var txt = [];
  var i=0;
  while(object.childNodes[i]) {
    txt[txt.length] = getText(object.childNodes[i]);
    i++;
  }
  return txt.join('');
}