Gelbooru KonaStyle

Change gelbooru.com main theme to dark theme, similar to konachan style. Also added buttons to hide submenu and red message in header.

От 02.03.2015. Виж последната версия.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey, Greasemonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Violentmonkey.

За да инсталирате този скрипт, трябва да имате инсталирано разширение като Tampermonkey или Userscripts.

За да инсталирате скрипта, трябва да инсталирате разширение като Tampermonkey.

За да инсталирате този скрипт, трябва да имате инсталиран скриптов мениджър.

(Вече имам скриптов мениджър, искам да го инсталирам!)

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да инсталирате разширение като Stylus.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

За да инсталирате този стил, трябва да имате инсталиран мениджър на потребителски стилове.

(Вече имам инсталиран мениджър на стиловете, искам да го инсталирам!)

// ==UserScript==
// @name         Gelbooru KonaStyle
// @namespace    http://Aestellar.homepage/
// @version      0.13
// @description  Change gelbooru.com main theme to dark theme, similar to konachan style. Also added buttons to hide submenu and red message in header.
// @author       Aestellar
// @include       *://gelbooru.com/*
// @resource    gelbooruCss1 https://userstyles.org/styles/111063/gelbooru-konastyle-test.css
// @grant GM_getResourceText
// @grant GM_addStyle

// @run-at      document-start

// ==/UserScript==
(function(){
    var win = window;
    var ls = localStorage;
    if(!win){
        console.log(win + "Failed to load window object");
        return;
    }
    
    if(win.self != win.top){
        return;
    }

    var css = GM_getResourceText ("gelbooruCss1");
    addStyle(css);
    document.addEventListener("DOMContentLoaded",updateUI, false);
    
    function loadPrereq(){
        var hrefVar = win.location.href;
        if(/(htt[ps]:\/\/gelbooru\.com[\/]*)$/.test(hrefVar)){
            document.body.className = 'main-page';
        }
        var t = document.createElement('d');
        //Font awesome support Don't work with @resource
        t.innerHTML = '<link rel="stylesheet" type="text/css" media="screen" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.3/css/font-awesome.css" />';
        t = t.children[0];
        document.head.appendChild(t);
    }
    

    
    function submit(e){
        var textElt = _$('#stags')||_$('#tags');
        text = textElt.value;     
        console.log(text);
        text = applySearchFilters(text);
        textElt.value = text;
    }
    
    function applySearchFilters(text)
    {
        if (ls.getItem('onlyNewSearch')==='true') {
            if (!!getLastImageId()) {
                var newId = ' id:>' + getLastImageId() + ' ';
                if (text.indexOf(newId)===-1) {
                    text+=newId; 
                };                
            };
        };
        return text;
    }
    
    function replaceSubmit(){
        var form = _$('.sidebar3 form');
        form.onsubmit = submit;
    }
    
    
    
    
    function updateUI(){       
        loadPrereq();
        checkLastVisit();
        replaceSubmit();   
        updateNav();
    }                
    
    function updateNav() {
        var navBar = _$('.flat-list');
        var subNav = _$('.submenu');
        var navBtn = document.createElement("li");
        var advNav = document.createElement("li");
        navBar.insertBefore(advNav, navBar.firstChild);
        navBar.insertBefore(navBtn, navBar.firstChild);
        
        var sett = {name:'navCollapse', glyphOff:'fa fa-minus-square-o', glyphOn:'fa fa-plus-square-o',
        callbackOff:makeToggleFunc(['.submenu', '.noticeError'], show), callbackOn:makeToggleFunc(['.submenu', '.noticeError'], hide)};

        var sett2 = {name:'advNavCollapse', glyphOff:'fa fa-search-minus', glyphOn:'fa fa-search-plus',
        callbackOff:makeToggleFunc(['#usernavbar'], show), callbackOn:makeToggleFunc(['#usernavbar'], hide)};
        makeUserNavBar();

        var collapseBtn = makeToggleButton(navBtn,sett);
        makeToggleButton(advNav,sett2);
        
        
        function makeToggleFunc(sel,action){

            var activeFoo = function(){
                for (var i = sel.length - 1; i >= 0; i--) {
                    action(_$(sel[i]));
                };            
        }
        return activeFoo;

    }     
}    

function makeUserNavBar(){
    var userBar = document.createElement('ul');
    userBar.className = 'flat-list';
    userBar.setAttribute('id', 'usernavbar');
    var navBar = _$('.submenu'); 
    var navParent = navBar.parentNode;
    navParent.insertBefore(userBar,navBar.nextSibling);

    makeFitImageBtn(userBar);
    makeAdvSearchPane(userBar);

}   

function makeFitImageBtn(userBar){
    var fitBtn = document.createElement("li");
    userBar.appendChild(fitBtn);
    var imageFit = makeToggleButton(fitBtn, {name:'fitImage',
       glyphOff:'fa fa-compress',
       glyphOn:'fa fa-expand',
       callbackOff:fit,
       callbackOn:fit});
    var img = _$('#image');
    function fit(){

        var img = _$('#image');
        if (img === undefined) {         
            return;
        }
        img.removeAttribute('width');

        img.removeAttribute('height');
        if ((localStorage.getItem('fitImage')==='true')) {  
            img.style.maxWidth = '100%';         
        }
        else{
            img.style.maxWidth = '';
        }
                //console.log(window.Note);
            }

            if(!!img){
                img.addEventListener('load', fit, false);          
            }
        }

        function makeAdvSearchPane(userBar)
        {
            var advSearch = document.createElement('div');
            advSearch.innerHTML = '<div id = "adv-search">\
            <span>Advanced Search: </span>\
            <span id = "only-new" style = "padding-right:3px;">Only new image </span>\
            </div>';
            advSearch = advSearch.firstChild;
            userBar.appendChild(advSearch);
            var onlyNew = document.getElementById('only-new');

            makeToggleButton(onlyNew, {name:'onlyNewSearch',
             glyphOff:'fa fa-square-o',
             glyphOn:'fa fa-check-square-o',
             callbackOff:null,
             callbackOn:null});
            return advSearch;
        }

        function makeToggleButton(elem, settings){
            var btn = new ButtonToggle(settings);
            btn.bindElement(elem);
            btn.load();
            elem.addEventListener('click', btn.handlerClick, false);
            return btn;
        }   

        function ButtonToggle(settings) {
            var self = this;

            var modGliph = 'fa-lg';
            this.name = settings.name;

            this.active = false;
            this.bindedElt = null;
            this.glyphElt = document.createElement('i');
            this.bindElement = function (elem) {
                self.bindedElt = elem;
                if (self.bindedElt.length > 0) {
                    elem.insertChildBefore(self.glyphElt, elem.FirstChild);
                }
                else {
                    elem.appendChild(self.glyphElt);
                }
            };

            this.glyphOn = settings.glyphOn + ' ' + modGliph;
            this.glyphOff = settings.glyphOff + ' ' + modGliph;
            this.callbackOn = settings.callbackOn;
            this.callbackOff = settings.callbackOff;
            this.save = function () {
                localStorage.setItem(self.name, self.active);
            };
            this.load = function () {
                var t = localStorage.getItem(self.name);
                if (t === 'true') {
                    self.setActive(true);
                }
                else {
                    self.setActive(false);
                }
            };
            this.handlerClick = function (e) {
                if (self.active) {
                    self.setActive(false);
                }

                else {
                    self.setActive(true);
                }
            };

            this.setActive = function (val) {
                val = !!val;
                self.active = val;
                self.save(val);

                if (val) {
                    if (!!self.bindedElt) {
                        self.bindedElt.classList.add('active');                    
                        self.glyphElt.className = self.glyphOn;
                    }

                    if (!!self.callbackOn) {
                        self.callbackOn(self);
                    }
                }

                else {
                    if (!!self.bindedElt) {
                        self.bindedElt.classList.remove('active');
                        self.glyphElt.className = self.glyphOff;
                    }

                    if (!!self.callbackOff) {
                        self.callbackOff(self);
                    }
                }
            };
        }


// LastVisit functions              
function checkLastVisit(){
    var timer = 7200000;
    var lastVisit = parseInt(ls.getItem('lastVisit'));
    var prevVisit = parseInt(ls.getItem('preLastVisit'));

    var currentVisit = new Date().valueOf();
    if ((!lastVisit)||(!prevVisit)) {
        updateLastVisit();      
    }
    if ((lastVisit + timer) < currentVisit) {
        updateLastVisit();
    }
}

function updateLastVisit(){
    var posts = 'http://gelbooru.com/index.php?page=post&s=list&tags=all';
    handleXHRDoc(posts, function(doc){
        var lastIdElt = doc.getElementsByClassName('thumb')[0];
        var lastID = lastIdElt.getAttribute('id');
        lastID = lastID.replace('s', '');

        if (!!ls.getItem('lastVisit')) {
            ls.setItem('preLastVisit',ls.getItem('lastVisit')); 
        }
        else{
            ls.setItem('preLastVisit',new Date().valueOf()); 
        }
        if (ls.getItem('lastImageId')) {
            ls.setItem('preImageId',ls.getItem('lastImageId'));
        }
        else{
            ls.setItem('preImageId',lastID);
        }

        localStorage.setItem('lastVisit',new Date().valueOf());
        localStorage.setItem('lastImageId', lastID);
    });
}

function getLastVisit(){
    var t = localStorage.getItem('preLastVisit');
    return parseInt(t);
}

function getLastImageId(){
    var t = localStorage.getItem('preImageId');
    return parseInt(t);
}

})();

function handleXHRDoc(reqString, callback){
    var doc = document.implementation.createHTMLDocument("example");
    
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.open('GET', reqString, true);
    xmlhttp.send(null);
    xmlhttp.onreadystatechange = handle;
    
    function handle(){              
        if (xmlhttp.readyState == 4) {
            if(xmlhttp.status == 200) {
                doc.documentElement.innerHTML = xmlhttp.responseText;
                console.log(doc);
                callback(doc);
            }
            
            else{
                console.log('Error xhr of ' + reqString);
            }
        }
    }    
}


//from http://stackoverflow.com/questions/2246901/how-can-i-use-jquery-in-greasemonkey-scripts-in-google-chrome
function load(a, b, c) {
    var d;
    d = document.createElement("script"), d.setAttribute("src", a), b !== null && d.addEventListener("load", b), c !== null && d.addEventListener("error", c), document.body.appendChild(d);
    return d;
} 
function execute(a) {
    var b, c;
    typeof a == "function" ? b = "(" + a + ")();" : b = a, c = document.createElement("script"), c.textContent = b, document.body.appendChild(c);
    return c;
}
function loadAndExecute(a, b) {
    return load(a, function () {
        return execute(b);
    });
}
//
function _$(selector){
    return document.querySelectorAll(selector)[0];
}

function hide(elt){
    elt.style.display = 'none';
}
function show(elt){
    elt.style.display = '';
}



function hasClass(elem, name) {
    if (!!elem) {
        if (!!elem.classList) {
            if (elem.classList.contains(name)) {
                return true;
            }
        }
    }
    return false;
}    

function addStyle(css){
    if (typeof GM_addStyle != "undefined") {
        GM_addStyle(css);
    } else if (typeof PRO_addStyle != "undefined") {
        PRO_addStyle(css);
    } else if (typeof addStyle != "undefined") {
        addStyle(css);
    } else {
        var node = document.createElement("style");
        node.type = "text/css";
        node.appendChild(document.createTextNode(css));
        var heads = document.getElementsByTagName("head");
        if (heads.length > 0) {
            heads[0].appendChild(node); 
        } else {
            // no head yet, stick it whereever
            document.documentElement.appendChild(node);
        }
    }   
}