4chan Gallery

Adds a gallery mode and title to customBoardList.

Versión del día 9/11/2014. Echa un vistazo a la versión más reciente.

// ==UserScript==
// @name			4chan Gallery
// @version			1.1.0
// @description			Adds a gallery mode and title to customBoardList.
// @include			*://boards.4chan.org/*
// @namespace			https://greasyfork.org/users/3159
// ==/UserScript==

function s(q){var b = document.getElementById(q);return b}
setTimeout(function(){
var boardname = document.getElementsByClassName('boardTitle')[0].innerHTML.split('/ - ')[1];
var boardlink = document.location.href.split('thread/')[0];
var cb = document.getElementsByClassName('customBoardList'),a = 0;
cb[0].insertAdjacentHTML('afterbegin','[<a href="' + boardlink + '">' + boardname + '</a>] ');
cb[1].insertAdjacentHTML('afterbegin','[<a href="' + boardlink + '">' + boardname + '</a>] ');

if (document.location.href.indexOf('/thread/') > 0){
cb[0].insertAdjacentHTML('beforeend','[<a id="glink" href="#">Gallery</a>]');
cb[1].insertAdjacentHTML('beforeend','[<a id="glink2" href="#">Gallery</a>]');
s("glink").onclick=function(){view()};
s("glink2").onclick=function(){view()};
s('bottom').insertAdjacentHTML('afterend','<div id="bg" style="opacity:0.9;position:fixed;top:0;left:0;z-index:9999;background-color:black;width:100%;height:100%;display:none"></div><div id="inner""></div>');
var arw = 'position:absolute;z-index:10000;top:calc(50% - 15px);border-top: 15px solid transparent;border-bottom: 15px solid transparent;display:none;'
s('inner').insertAdjacentHTML('afterend','<div id="larrow" style="' + arw + 'border-right: 20px solid #bababa;left:5px"></div>');
s('inner').insertAdjacentHTML('afterend','<div id="rarrow" style="' + arw + 'border-left: 20px solid #bababa;right:5px"></div>');
s('larrow').onclick=function(){if(a>0){a--;s('inner').children[0].src = abc()[2][a];info()}};
s('rarrow').onclick=function(){if(a>=--abc()[0].length)endalert();else{a++;s('inner').children[0].src = abc()[2][a];info()}};
var brow = ' style="color:#bababa;margin:0;position:absolute;bottom:0;z-index:10000;display:none;';
s('larrow').insertAdjacentHTML('afterend','<p id="n"' + brow + 'right:0">[ ' + (a+1) + '/' + abc()[0].length + ' ]</p>');
s('larrow').insertAdjacentHTML('afterend','<p id="info"' + brow + 'left:0">[ ' + abc()[0][a] + ' ][ ' + abc()[1][a] + ' ]</p>');
s('info').onclick=function(){a=0;s('inner').children[0].src = abc()[2][a];info()};
s('n').onclick=function(){a=--abc()[0].length;s('inner').children[0].src = abc()[2][a];info()};
s('bg').onclick=function(){this.style.display = 'none';s('inner').style.display = 'none';s('larrow').style.display = 'none';s('rarrow').style.display = 'none';s('n').style.display = 'none';s('info').style.display = 'none'};

function view(){
	s('bg').style.display = 'block';
	s('inner').style.display = 'block';
	s('larrow').style.display = 'block';
	s('rarrow').style.display = 'block';
	s('n').style.display = 'block';
	s('info').style.display = 'block';
	if (a<1){
		var img = new Image();
		img.style.cssText="position:absolute;z-index:10000;max-height:calc(100% - 40px);max-width:calc(100% - 60px);top:0;bottom:0;margin-top:auto;margin-bottom:auto;margin-left:auto;margin-right:auto;left:0;right:0";
		img.src = abc()[2][0];
		img.onclick = function(){
			if (a < (abc()[0].length - 1)){
				a++;
				img.src = abc()[2][a];
				info();
			}
			else endalert();
		}
		s('inner').appendChild(img);
	}
	pre(abc()[2]);
}
function info(){
	s('info').innerHTML = '[ ' + abc()[0][a] + ' ][ ' + abc()[1][a] + ' ]';
	s('n').innerHTML = '[ ' + (a+1) + '/' + abc()[0].length + ' ]';
}
function endalert(){
	if(s('bg').style.display != 'none'){
	b=document.createElement('div'),c=b.style,b.id='theend';
	for (var d = '0123456789ABCDEF'.split(''), a = '#', e = 0;6 > e;e++) {a += d[Math.round(15 * Math.random())]};
	c.backgroundColor=a;
	c.cssText+='width:200px;height:50px;position:absolute;margin:auto;left:0;right:0;top:0;bottom:0;font-size:42px;text-align:center;color:#fff;z-index:10001';
	b.innerText='The End';
	document.body.appendChild(b);
	setTimeout(function(){z=document.getElementById('theend');z.parentNode.removeChild(z)}, 420);
	}
}
function abc(){
   var names = document.getElementsByClassName('fileText'),a=[],b=[],c=[],n,m;
   var imgs = document.getElementsByClassName('fileThumb');
   for (var z=0;z<imgs.length;z++){
      if(imgs[z].getAttribute('href').indexOf('webm') < 0){
         n = names[z].children[0].getAttribute('title');
         if(!n)n= names[z].children[0].innerText;
         m = names[z].innerText.split(/[, ]+/).pop().split(')')[0];
         a.push(m);b.push(n);c.push(imgs[z].getAttribute('href'));
      }
   }
   return [a,b,c];
}
function pre(arrayOfImages, index) {
    index = index || 0;
    if (arrayOfImages && arrayOfImages.length && arrayOfImages.length > index) {
        var img = new Image();
        img.onload = function() {
            pre(arrayOfImages, index + 1);
        };
        img.src = arrayOfImages[index];
    }
}
document.addEventListener("keydown", function(e){
	switch(e.which){
		case 39:
            if (a>=--abc()[0].length) endalert();
			else if (s('bg').style.display != 'none'){a++;s('inner').children[0].src = abc()[2][a];info()};
			break;
		case 37:
			if(a>0 && s('bg').style.display != 'none'){a--;s('inner').children[0].src = abc()[2][a];info()};
			break;
	}
});
}
}, 1000);