Raw Source Toggle Dropdown

• Minified Source

Lemons / ColorTabs

// ==UserScript==
// @name          ColorTabs
// @namespace     https://openuserjs.org/scripts/Lemons/ColorTabs
// @updateURL     https://openuserjs.org/meta/Lemons/ColorTabs.meta.js
// @description	  Change Tab Colours - Based from shindaat's original coloured inventory tabs userscript - just more customizable
// @author        Pondering Lemons 
// @include       http://www.gaiaonline.com/avatar*
// @include       http://avatarsave.gaiaonline.com/avatar*
// @include       http://www.gaiaonline.com/*
// @require       http://code.jquery.com/jquery-latest.js
// @run-at        document-start
// @version       0.3.5
// ==/UserScript==

(function(){

    var background = {
        "active": true,
        "image": "",
        "color": "#EEE"
    };

    var items = {
        "active": true,
        "flexgrid": true,
        "itemopacity": "0.1",
        "equippedopacity": "0.3", // equipped items opacity - usually make this opacity more than the normal un-equipped so they stick out
        "itembg": "light", // VALUES ACCEPTED: "dark", "light"
        "noitembg": true // will there be item backgrounds?
    };

    var Tabs = {
        "active": true,
        "all_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/all.png",
        "equip_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/hats.png",
        "game_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/tops.png",
        "special_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/bottoms.png",
        "house_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/house.png",
        "formula_tab": "http://i.imgur.com/knJQBgF.png",
        "paw_tab": "http://i.imgur.com/sX3IDLM.png",
        "aqua_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/items.png",
        "astra_tab": "http://i.imgur.com/28hcpQs.png", // Both EQUIP and INVENTORY tab
        "kindred_tab": "http://i.imgur.com/D0YdbGk.png",
        "invsearch_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/house.png", // Both EQUIP and INVENTORY tab

        "hats_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/hats.png",
        "tops_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/tops.png",
        "bottoms_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/bottoms.png",
        "shoes_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/shoes.png",
        "accessories_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/accessories.png",
        "items_tab": "http://img.photobucket.com/albums/v259/kougyoku/lolno/items.png",
    };

    // YOU DONT NEED TO EDIT ANYTHING BELOW HERE.

    var addedCSS = "";

    // Change Backgrounds
    if(background.active){
        addedCSS += ".yui-content.inventory-arranger.main-inventory { background-image: url('" + background.image + "'); background-color: " + background.color + "; } \n";
    }

    // Change Item Styles
    if(items.active){
        if(items.flexgrid){
            addedCSS += ["#gaia_content .item-list ul{ display: flex; flex-wrap: wrap; }",
                         "#gaia_content #tabs_container #items_tabview div.yui-content li{ flex-grow: 1; text-align: center;}",
                         "#gaia_content #items_tabview .quantity, #gaia_content #other_inventory .quantity{ right: 50%; margin-right: -14px; }"].join('\n');
        }

        if(items.noitembg){
            addedCSS += ["#gaia_content #tabs_container .item-list img{ border: 0px transparent; background: transparent; }",
                         "#gaia_content #tabs_container .item-list .notEquipped { border: 0px transparent; }",
                         "#gaia_content #tabs_container .item-list .equipped, #gaia_content #tabs_container .item-list .isEquipped{background: transparent; border: 0px transparent;}"].join('\n');
        } else {
            var bgcolour = items.itembg == "light" ? "255,255,255," : "0, 0, 0,";
            addedCSS += ["#gaia_content #tabs_container .item-list img{ border: 0px transparent; background: rgba(" + bgcolour + items.itemopacity + "); }",
                         "#gaia_content #tabs_container .item-list .notEquipped { border: 0px transparent; }",
                         "#gaia_content #tabs_container .item-list .equipped, #gaia_content #tabs_container .item-list .isEquipped{ background: rgba(" + bgcolour + items.equippedopacity + "); border: 0px transparent;}"].join('\n');
        }
    }

    // Change Tabs
    if(Tabs.active){
        $.each(Tabs, function(k, v) {
            addedCSS += ["\n.gaia-tabview-skin .yui-navset .yui-nav #" + k + " a{",
                         "background:url(\'" + v + "\') 0 0 no-repeat !important;}",
                         "",
                         ".gaia-tabview-skin .yui-navset .yui-nav #" + k + " a em,",
                         ".gaia-tabview-skin .yui-navset .yui-navset-top .yui-nav #" + k + " a em{",
                         "background:url(\'" + v + "\') 100% 0 no-repeat !important;}",
                         "",
                         ".gaia-tabview-skin .yui-navset .yui-nav .selected #" + k + " a,",
                         ".gaia-tabview-skin .yui-navset .yui-nav .selected #" + k + " a:focus,",
                         ".gaia-tabview-skin .yui-navset .yui-nav .selected #" + k + " a:hover {",
                         "background:#fff url(\'" + v + "\') 0 -30px no-repeat !important;}\n"].join('\n');
        });
    }

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

})();