Klatu's Elements script

Deck manager
目前為 2017-05-07 提交的版本，檢視最新版本。
安裝腳本 ?
換行
// ==UserScript==
// @name        Klatu's Elements script
// @namespace   Klatu
// @version     3
// @description Deck manager
// @author      Klatu
// @require     https://cdnjs.cloudflare.com/ajax/libs/scriptaculous/1.9.0/builder.min.js
// @match       http://www.kongregate.com/games/zanzarino/elements*
// @grant       GM_addStyle
// @grant       GM_getResourceText
// ==/UserScript==

//main function
window.addEventListener('load', ()=>{
    var decks, div, tab, uiLoadedVieja;

    function saveDecks(){
        localStorage.setItem('elementsDecks', JSON.stringify(decks));
    }

    function addDeck(name, code){
        var deck={name:name, code:code};
        decks.push(deck);
        saveDecks();
    }

    function updateDiv(){
        for(var child of div.children) child.remove();
        for(var i=0; i<decks.length; i++){
            var deck=decks[i];
            var deckDiv=document.createElement('div');
            var deckNameSpan=document.createElement('span');
            var deckCopySpan=document.createElement('span');
            var deckModifySpan=document.createElement('span');
            var deckDeleteSpan=document.createElement('span');
            deckDiv.setAttribute('data-klatu-index', i);
            deckDiv.className='klatu-deck-div';
            deckNameSpan.innerText=deck.name;
            deckNameSpan.className='klatu-deck-name-span';
            deckDiv.appendChild(deckNameSpan);
            deckDeleteSpan.className='klatu-deck-delete-span';
            deckDeleteSpan.addEventListener('click', ()=>{

            });
            deckDiv.appendChild(deckDeleteSpan);
            deckModifySpan.className='klatu-deck-modify-span';
            deckModifySpan.addEventListener('click', ()=>{});
            deckDiv.appendChild(deckModifySpan);
            deckCopySpan.className='klatu-deck-copy-span';
            deckCopySpan.addEventListener('click', ()=>{});
            deckDiv.appendChild(deckCopySpan);
            if(i%2) deckDiv.className+=' even';
            div.appendChild(deckDiv);
        }
        var button=document.createElement('button');
        button.innerText='Add deck';
        button.className='klatus-elements-script-button';
        button.addEventListener('click', ()=>{

        });
        div.appendChild(button);
        delete Sortable.sortables[div.id];
        Sortable.create(div.id, {
            tag: 'div',
            onUpdate: function(){
                var oldDecks=decks;
                decks=[];
                for(var div of $$('.klatu-deck-div')){
                    decks.push(oldDecks[div.index]);
                }
                updateDiv();
                saveDecks();
            }
        });
    }

    //add own style
    GM_addStyle(
        '.klatu-deck-div{'+
        '  font-size:22px;'+
        '  padding:6px;'+
        '  background-color: #111;'+
        '  color: #eee;'+
        '}'+
        '.klatus-elements-script-button{'+
        '  display: block;'+
        '  padding: 6px 12px;'+
        '  margin: 8px auto 0 auto;'+
        '  font-size: 14px;'+
        '  font-weight: 400;'+
        '  line-height: 1.42857143;'+
        '  text-align: center;'+
        '  white-space: nowrap;'+
        '  vertical-align: middle;'+
        '  -ms-touch-action: manipulation;'+
        '  touch-action: manipulation;'+
        '  cursor: pointer;'+
        '  -webkit-user-select: none;'+
        '  -moz-user-select: none;'+
        '  -ms-user-select: none;'+
        '  user-select: none;'+
        '  width: 100px;'+
        '  background-image: none;'+
        '  border: 1px solid transparent;'+
        '  border-radius: 4px;'+
        '  color: #fff;'+
        '  background-color: #337ab7;'+
        '  border-color: #2e6da4;'+
        '}'+
        '.klatu-deck-div>span:not(.klatu-deck-name-span){'+
        '  float: right;'+
        '  font-size: 20px;'+
        '  font-weight: bold;'+
        '  padding: 1px 3px 1px 3px;'+
        '  cursor: pointer;'+
        '}'+
        '.klatu-deck-div.even{'+
        '  background-color: #333;'+
        '}'+
        '.klatu-deck-copy-span, .klatu-deck-modify-span, .klatu-deck-delete-span{'+
        '  float: right;'+
        '}'+
        '.klatu-deck-delete-span:before{'+
        '  content: "×";'+
        '  color: red;'+
        '}'+
        '.klatu-deck-copy-span:before{'+
        '  content: "?";'+
        '  color: #0275d8'+
        '}'+
        '.klatu-deck-modify-span:before{'+
        '  content: "✍";'+
        '  color: #f0ad4e'+
        '}'+
        '.tabpane{'+
        '  height: 489px'+
        '}'+
        '.prevent-selection {'+
        '  -webkit-touch-callout: none;'+ /* iOS Safari */
        '  -webkit-user-select: none;'+   /* Chrome/Safari/Opera */
        '  -khtml-user-select: none;'+    /* Konqueror */
        '  -moz-user-select: none;'+      /* Firefox */
        '  -ms-user-select: none;'+       /* Internet Explorer/Edge */
        '  user-select: none;'+           /* Non-prefixed version, currently not supported by any browser */
        '}'
    );

    //create the deck manager div
    div=document.createElement('div');
    div.id='klatus-elements-script-tab-pane';
    div.className='tabpane';
    div.innerHTML='<span>asd</span>';

    //create the DECKS tab
    tab=document.createElement('li');
    tab.id='klatus-elements-script-tab';
    tab.className='tab';
    tabLink=document.createElement('a');
    tabLink.innerText='Decks';
    tabLink.key=div.id;
    tabLink.href='#'+div.id;
    tabLink.addEventListener('click', function(event){
        holodeck._tabs.setActiveTab(this);
        event.preventDefault();
    });
    tab.appendChild(tabLink);

    //load saved decks
    decks=localStorage.getItem('elementsDecks')?JSON.parse(localStorage.getItem('elementsDecks')):[];

    //save the old uiLoaded function
    uiLoadedVieja=Holodeck.prototype.uiLoaded;

    //modify the uiLoaded function in order to run my the rest of my script when the ui is loaded
    Holodeck.prototype.uiLoaded=function(a){
        uiLoadedVieja.bind(holodeck)(a);
        $('main_tab_set').appendChild(tab);
        $('kong_game_ui').appendChild(div);
        addDeck('Test even');
        addDeck('Test odd');
        updateDiv();
        holodeck._tabs.links.push(tabLink);
        holodeck._tabs.containers._object[div.id]=div;
    };
});
欢迎访问Greasy Fork镜像
