Gelbooru/Rule34xxx Viewer/Downloader

A simple quick and dirty image viewer for gelbooru.com and rule34.xxx supports all formats from gif to webm.

Versión del día 30/4/2017. Echa un vistazo a la versión más reciente.

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Necesitará instalar una extensión como Tampermonkey para instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

// ==UserScript==
// @name         Gelbooru/Rule34xxx Viewer/Downloader
// @version      1.15
// @description  A simple quick and dirty image viewer for gelbooru.com and rule34.xxx supports all formats from gif to webm.
// @author       PineappleLover69
// @include      https://gelbooru.com*
// @include      https://rule34.xxx*
// @include      http://gelbooru.com*
// @include      http://rule34.xxx*
// @namespace https://greasyfork.org/users/120106
// ==/UserScript==

(function() {

    //Settings
    var StartImageHeight = 650;





    Element.prototype.remove = function() {
        this.parentElement.removeChild(this);
    };

    var postTop = document.getElementsByClassName("content")[0];

    var yupStuff = document.getElementsByClassName("yup")[0];

    var posts = document.getElementById("post-list");
    //imgList = posts.childNodes[2].childNodes[0].childNodes;
    imgList = document.getElementsByClassName("thumb");

    var genericTagClass = "tag-type-general";

    var postSources = Array(imgList.length);

    var apiCallJson;
    var tagArray;
    var tagDictionary = {};
    var tagTypeLookup = { 0:"tag-type-general", 1:"tag-type-artist", 2:"tag-type-copyright", 3:"tag-type-copyright", 4:"tag-type-character"};

    BatchApiCall();

    var isRule34 = false;
    if(document.URL.includes("rule34.xxx")){
        imgList = posts.childNodes[2].childNodes[3].childNodes;
        isRule34 = true;
    }

    //console.log(imgList);
    var imgIndex = 0;
    var imgOpened = false;

    for(i = 0; i < imgList.length;){
        try{
            //console.log(imgList[i].getAttribute("id"));
            //console.log(imgList[i].childNodes[0].getAttribute("href"));
            imgList[i].setAttribute("openRef", imgList[i].childNodes[0].getAttribute("href"));
            imgList[i].childNodes[0].removeAttribute("href");
            imgList[i].childNodes[0].addEventListener("click", ImgClick);
            i++;
        }catch(ex){
            imgList[i].remove();
        }
    }

    function ImgClick(e){
        if(!imgOpened)
            ImgView();
        var child = e.target.parentNode.parentNode;
        var parent = child.parentNode;
        // The equivalent of parent.children.indexOf(child)
        imgIndex = Array.prototype.indexOf.call(parent.children, child);
        //console.log(imgIndex);
        SetImg();
        imgViewBtn.scrollIntoView();
    }

    imgViewBtn = document.createElement("button");
    imgViewBtn.innerHTML = "Image View";
    imgViewBtn.onclick = ImgView;
    var dlAllBtn = document.createElement("button");
    dlAllBtn.innerHTML = "Download All";
    dlAllBtn.onclick = dlAll;

    //imgViewBtn.setAttribute("class", "active");
    postTop.insertBefore(dlAllBtn, postTop.childNodes[0]);
    postTop.insertBefore(imgViewBtn, postTop.childNodes[0]);

    var imgMouseDown = false;
    var imgDownPosX,imgDownPosY,imgDownHeight = 0;

    function ImgView(){
        if(imgOpened)
            return;

        holdDiv = document.createElement("div");
        holdDiv.setAttribute("align", "center");
        postTop.insertBefore(holdDiv, postTop.childNodes[2]);

        imgViewImg = document.createElement("img");
        imgViewImg.setAttribute("height", StartImageHeight);
        holdDiv.appendChild(imgViewImg);
        videoImg = document.createElement("video");
        videoImg.setAttribute("height", StartImageHeight);
        videoImg.setAttribute("autoplay", true);
        videoImg.setAttribute("controls", true);
        videoImg.setAttribute("loop", true);
        videoImg.setAttribute("hidden", true);
        holdDiv.appendChild(videoImg);

        preloadImg1 = document.createElement("img");
        preloadImg2 = document.createElement("img");
        preloadImg1.setAttribute("hidden", true); preloadImg2.setAttribute("hidden", true);
        holdDiv.appendChild(preloadImg1); holdDiv.appendChild(preloadImg2);

        preloadImg3 = document.createElement("img");
        preloadImg4 = document.createElement("img");
        preloadImg3.setAttribute("hidden", true); preloadImg4.setAttribute("hidden", true);
        holdDiv.appendChild(preloadImg3); holdDiv.appendChild(preloadImg4);

        imgViewImg.addEventListener('load', DoPreload);
        
        imgViewImg.addEventListener('mousedown', ImageMouseDown);
        imgViewImg.addEventListener('mouseup', ImageMouseUp);
        imgViewImg.addEventListener('mousemove', ImageMouseMove);
        imgViewImg.addEventListener('mouseleave', ImageMouseLeave);
        
        videoImg.addEventListener('mousedown', ImageMouseDown);
        videoImg.addEventListener('mouseup', ImageMouseUp);
        videoImg.addEventListener('mousemove', ImageMouseMove);
        videoImg.addEventListener('mouseleave', ImageMouseLeave);

        prevBtn = document.createElement("button");
        prevBtn.innerHTML = "Prev";    prevBtn.onclick = PrevImg;
        nextBtn = document.createElement("button");
        nextBtn.innerHTML = "Next";    nextBtn.onclick = NextImg;
        dlBtn = document.createElement("button");
        dlBtn.innerHTML = "Download";    dlBtn.onclick = DownloadCurrent;
        opBtn = document.createElement("button");
        opBtn.innerHTML = "Open Src";    opBtn.onclick = OpenSrc;
        spacer = document.createElement("img");
        spacer.setAttribute("width", 30);
        spacer2 = document.createElement("img");
        spacer2.setAttribute("width", 30);
        spacer3 = document.createElement("img");
        spacer3.setAttribute("width", 30);
        holdDiv.appendChild(document.createElement("br"));
        holdDiv.appendChild(prevBtn);
        holdDiv.appendChild(spacer);
        holdDiv.appendChild(dlBtn);
        holdDiv.appendChild(spacer2);
        holdDiv.appendChild(opBtn);
        holdDiv.appendChild(spacer3);
        holdDiv.appendChild(nextBtn);

        imgOpened = true;
        //console.log(isRule34);
        if(isRule34){
            document.getElementById("header").remove();
        }else{
            document.getElementsByClassName("header")[0].remove();
            document.getElementsByClassName("submenu")[0].remove();
        }
        document.addEventListener("keydown", keyInput);
        SetImg();
    }

    function ImageMouseDown(e){
        e.preventDefault();
        imgMouseDown = true; imgDownPosX = e.screenX; imgDownPosY = e.screenY; imgDownHeight = Number(imgViewImg.getAttribute("height"));
        return false;
    }
    function ImageMouseUp(e){
        e.preventDefault();
        imgMouseDown = false;
        return false;
    }
    function ImageMouseMove(e){
        if(imgMouseDown){
            e.preventDefault();
            var moveDist = e.screenY - Number(imgDownPosY);
            imgViewImg.setAttribute("height", imgDownHeight + moveDist * 2);
            videoImg.setAttribute("height", imgDownHeight + moveDist * 2);
            return false;
        }
    }
    function ImageMouseLeave(e){
        e.preventDefault();
        imgMouseDown = false;
        return false;
    }

    function BatchApiCall(){
        var urlItems = getJsonFromUrl();        
        var pid = 0;
        if(urlItems.pid)
            pid = urlItems.pid / 42;

        var tags = document.getElementById("tags").value;        
        var limit = imgList.length;

        var request = "/index.php?page=dapi&s=post&q=index&limit=" + limit + "&tags=" + tags + "&pid=" + pid;

        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                apiCallJson = xmlToJson(this.responseXML);

                for(var i = 0; i < limit; i++){
                    if(!apiCallJson.posts.post[i])
                        break;
                    postSources[i] = apiCallJson.posts.post[i]["@attributes"].file_url;
                }

                CreateTagBase();
            }
        };
        xhttp.open("GET", request, true);
        xhttp.send();
    }

    function CreateTagBase(){
        var uniqueTagList = [];
        for(var i = 0; i < imgList.length; i++){
            var currentPost = apiCallJson.posts.post[i];
            var tags = currentPost["@attributes"].tags;
            var splitTags = tags.split(' ');

            uniqueTagList.push(splitTags);
        }
        uniqueTagList = mergeDedupe(uniqueTagList);

        var uniqueTagString = "";
        var uniqueStringArray = [];
        var usCount = 0;
        for(i = 0; i < uniqueTagList.length; i++){
            if(usCount === 0){
                uniqueTagString += uniqueTagList[i];
            }else{
                uniqueTagString += " " + uniqueTagList[i];
            }
            usCount++;
            if(usCount > 99 || i == uniqueTagList.length - 1){
                usCount = 0;
                uniqueStringArray.push(uniqueTagString);
                uniqueTagString = "";
            }
        }

        for(i = 0; i < uniqueStringArray.length; i++){
            var request = "/index.php?page=dapi&s=tag&q=index&names=" + uniqueStringArray[i];
            TagRequest(request);
        }



    }

    function TagRequest(tagRequest){
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                var tagPageJson = xmlToJson(this.responseXML);
                if(!tagArray)
                    tagArray = tagPageJson.tags.tag;
                else
                    tagArray = tagArray.concat(tagPageJson.tags.tag);

                var tmpArray = tagPageJson.tags.tag;
                for(i = 0; i < tmpArray.length; i++){
                    tagDictionary[tmpArray[i]["@attributes"].name] = tmpArray[i]["@attributes"];
                }

                if(imgOpened)
                    SetNewTags();
            }
        };
        xhttp.open("GET", tagRequest, true);
        xhttp.send();
    }

    function mergeDedupe( arr ){
        return [ ...new Set( [].concat( ...arr ) ) ];
    }

    function getJsonFromUrl() {
        var query = location.search.substr(1);
        var result = {};
        query.split("&").forEach(function(part) {
            var item = part.split("=");
            result[item[0]] = decodeURIComponent(item[1]);
        });
        return result;
    }

    function OpenSrc(){
        window.open(imgList[imgIndex].getAttribute("openRef"));
    }

    function PrevImg(){
        imgIndex--;
        if(imgIndex < 0)
            imgIndex = imgList.length - 1;
        SetImg();
    }

    function NextImg(){
        imgIndex++;
        if(imgIndex >= imgList.length)
            imgIndex = 0;
        SetImg();
    }

    function SetCurrentSrc(){
        currentSrc = GetSrcForImg(imgIndex);
    }

    function GetSrcForImg(getIndex){
        if(postSources[getIndex]){
            return postSources[getIndex];
        } else {    
            var tmpSrc = imgList[getIndex].id;
            tmpSrc = tmpSrc.replace("s", "");

            var thing = JsonHttpRequest("/index.php?page=dapi&s=post&q=index&id=" + tmpSrc.toString());

            tmpSrc = thing.posts.post["@attributes"].file_url;
            postSources[getIndex] = tmpSrc;
            return tmpSrc;
        }
    }

    function JsonHttpRequest(urlRequest){
        var xhr = new XMLHttpRequest();
        xhr.open("GET", urlRequest, false);
        xhr.send();
        return xmlToJson(xhr.responseXML);
    }

    function RemoveTags(){
        var tagBar = document.getElementById("tag-sidebar");
        tagBar.childNodes[0].setAttribute("class", genericTagClass);
        for(var i = tagBar.childNodes.length - 1; i >= 1 ; i--){
            //console.log("tagthing: " + tagBar.childNodes[i].innerHTML);
            tagBar.childNodes[i].remove();
        }
    }

    function SetNewTags(){
        if(!tagArray)
            return;

        var currentPost = apiCallJson.posts.post[imgIndex];
        var tags = currentPost["@attributes"].tags;
        var splitTags = tags.split(' ');

        RemoveTags();       

        var tagBar = document.getElementById("tag-sidebar");
        var firstTag = tagBar.childNodes[0];
        var stringToReplace = firstTag.innerHTML.substring(firstTag.innerHTML.indexOf("search=") + 7, firstTag.innerHTML.indexOf('" title="Wiki"'));        

        for(var i = 1; i < splitTags.length; i++){
            AddTag(splitTags[i], tagBar, firstTag, stringToReplace);
        }
        firstTag.remove();
    }

    String.prototype.replaceAll = function(search, replacement) {
        var target = this;
        return target.replace(new RegExp(search, 'g'), replacement);
    };

    function AddTag(tagName, tagParent, tagToClone, stringToReplace){
        try{
            var clonedTag = tagToClone.cloneNode(true);
            tagParent.appendChild(clonedTag);
            clonedTag.innerHTML = clonedTag.innerHTML.replaceAll(stringToReplace, tagName);
            clonedTag.childNodes[7].innerHTML = tagName.replace(/_/g, " ");

            var jsonTag = tagDictionary[tagName];
            var tagType = jsonTag.type;
            clonedTag.setAttribute("class", tagTypeLookup[tagType]);
            clonedTag.childNodes[9].innerHTML = jsonTag.count;
        }catch(ex){
            console.log("Failed tag: " + tagName);
            console.log(ex);
        }
    }

    function SetImg(){
        SetCurrentSrc();
        var dI = currentSrc.lastIndexOf(".");
        var fileExt = currentSrc.substring(dI + 1);

        if(fileExt.toLowerCase() == "webm"){
            videoImg.setAttribute("src", currentSrc);
            videoImg.removeAttribute("hidden");
            videoImg.play();
            imgViewImg.setAttribute("hidden", true);
            setTimeout(DoPreload, 200);
        }else{
            imgViewImg.setAttribute("src", currentSrc);
            imgViewImg.removeAttribute("hidden");
            videoImg.setAttribute("hidden", true);
            videoImg.pause();
        }

        SetNewTags();

    }

    function DoPreload(){
        var preIndex = imgIndex + 1;
        if(preIndex >= imgList.length)
            preIndex = 0;
        preloadImg1.src = GetSrcForImg(preIndex);

        preIndex++;
        if(preIndex >= imgList.length)
            preIndex = 0;
        preloadImg2.src = GetSrcForImg(preIndex);

        preIndex = imgIndex - 1;
        if(preIndex < 0)
            preIndex = imgList.length - 1;
        preloadImg3.src = GetSrcForImg(preIndex);

        //preIndex--;
        //if(preIndex < 0)
        //    preIndex = imgList.length - 1;
        //preloadImg4.src = GetSrcForImg(preIndex);
    }

    function DownloadCurrent(){
        if(!isRule34)
            SetCurrentSrc();
        var dI = currentSrc.lastIndexOf(".");
        var uI = currentSrc.lastIndexOf("/") + 5;
        var fileExt = currentSrc.substring(dI);
        var imgName = "tags-" + document.getElementById("tags").value + " ";
        if(document.getElementById("tags").value === ""){
            imgName = currentSrc.substring(uI, dI);
        }else{
            imgName += currentSrc.substring(uI, dI);
        }
        imgName += " id-" + imgList[imgIndex].childNodes[0].getAttribute("id");
        imgName += fileExt;
        //console.log(imgName);
        var dl = document.createElement("a");
        dl.setAttribute("href", currentSrc);
        dl.setAttribute("download", imgName);
        dl.click(); dl.remove();

        document.body.focus();
    }

    function dlAll(){
        var prevIndex = imgIndex;
        if(isRule34){

        }else{
            for(imgIndex = 0; imgIndex < imgList.length;){
                try{
                    DownloadCurrent();
                    imgIndex++;
                }catch(ex){
                    console.log(ex);
                    imgIndex++;
                    //imgList[imgIndex].remove();
                }
            }
        }
        imgIndex = prevIndex;
    }

    var tagE = document.getElementById("tags");
    function keyInput(e){
        if(document.activeElement != tagE){			
            if(e.keyCode === 32){
                e.preventDefault();
                return false;
            }
            if(e.keyCode === 37){
                e.preventDefault();
                PrevImg();
                return false;
            }
            if(e.keyCode === 39){
                e.preventDefault();
                NextImg();
                return false;
            }
            if(e.keyCode === 40){
                e.preventDefault();
                DownloadCurrent();
                return false;
            }
        }
    }
})();


// Changes XML to JSON
function xmlToJson(xml) {

    // Create the return object
    var obj = {};

    if (xml.nodeType == 1) { // element
        // do attributes
        if (xml.attributes.length > 0) {
            obj["@attributes"] = {};
            for (var j = 0; j < xml.attributes.length; j++) {
                var attribute = xml.attributes.item(j);
                obj["@attributes"][attribute.nodeName] = attribute.nodeValue;
            }
        }
    } else if (xml.nodeType == 3) { // text
        obj = xml.nodeValue;
    }

    // do children
    if (xml.hasChildNodes()) {
        for(var i = 0; i < xml.childNodes.length; i++) {
            var item = xml.childNodes.item(i);
            var nodeName = item.nodeName;
            if (typeof(obj[nodeName]) == "undefined") {
                obj[nodeName] = xmlToJson(item);
            } else {
                if (typeof(obj[nodeName].push) == "undefined") {
                    var old = obj[nodeName];
                    obj[nodeName] = [];
                    obj[nodeName].push(old);
                }
                obj[nodeName].push(xmlToJson(item));
            }
        }
    }
    return obj;
}