Skin Storage Script

a script to easily store as many skins as you want

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         Skin Storage Script
// @namespace    http://tampermonkey.net/
// @version      0.54
// @description  a script to easily store as many skins as you want
// @author       Oki
// @match        https://*.jstris.jezevec10.com/*
// @grant        none
// ==/UserScript==

/**************************
    Skin Storage Script
**************************/
(function() {

    window.addEventListener('load', function(){

localStorage.customSkins = localStorage.customSkins || "";
localStorage.activeSkins = localStorage.activeSkins || "";
localStorage.randomizeKey = localStorage.randomizeKey || 'F4'

if(typeof trim != "function"){var trim=a=>{a=a.slice(0,-1);a=a.substr(a.indexOf("{")+1);return a}}
if(typeof getParams != "function"){var getParams=a=>{var params=a.slice(a.indexOf("(")+1);params=params.substr(0,params.indexOf(")")).split(",");return params}}


document.getElementsByName("bSkin").forEach((radioButton, i)=>{
	i>2&&(radioButton.type = "checkbox")
})

var randomizeOption = document.createElement("tr");
randomizeOption.innerHTML = '<td>Randomize skin:</td><td><input maxlength="1" id="input421" type="text" size="7" value="'+localStorage.randomizeKey+'"></td><td id="kc421">0</td>'
tab_controls.children[2].appendChild(randomizeOption);


var randomizeListener = `"input421\"==e.target.id?(e.preventDefault(),input421.value=e.key,kc421.innerHTML=e.keyCode,localStorage.randomizeKey=e.key):e.key==localStorage.randomizeKey&&Game['deployRandomSkin']();\n`

if(window.onkeyup == null) {
	window.onkeyup = function(e){}
}

var keyupFunc = window.onkeyup.toString()

if(!keyupFunc.endsWith(randomizeListener)){
	keyupParams = getParams(keyupFunc)
	keyupFunc = trim(keyupFunc) + randomizeListener
	window.onkeyup = new Function(...keyupParams, keyupFunc)
}






var plusButton=document.createElement("div");
plusButton.style = "width:20px;height:20px;background-color:green;text-align:center;font-weight:1000";
plusButton.innerHTML = "+";
plusButton.id = "plusButton";


var modalStyles=document.createElement("style");
modalStyles.innerHTML='#skinModal {display: none;position: fixed;z-index: 100;padding-top: 200px;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.4)} #modalContent {color:black;background-color: white;margin: auto;padding: 20px;border: 1px solid #888;width: 60%} .xbutton {width:20px;height:20px;background-size:cover;margin-bottom:4px;margin-left:20px;filter: invert(100%)}';
document.body.appendChild(modalStyles);

var modal=document.createElement("div");
modal.id = "skinModal";
modal.innerHTML = '<div id="modalContent"><p>Please enter the new skin url. For animated skins, use this format: url1;size1 url2;size2 ...</p><input id="modalInput" style="border:2px solid black;z-index: 1000" type="text" value="https://i.imgur.com/u4SJJgE.png"><br><br><button id="modalClose" style="float:left down">Cancel</button><button id="modalConfirm" style="float:left down">OK</button></div></div>'
app.appendChild(modal);


var skinModalText = "";

modalConfirm.onclick = J=>{
	addSkin(1)
}

modalClose.onclick = N=>{
	addSkin(0)
}

function addSkin(flag) {
	skinModal.style.display = "none";
	skinModalText = modalInput.value
	if(skinModalText == ""){flag = 0}
	modalInput.value = "";

	if(!flag){
		return;
	}

    var skinNumber = localStorage.customSkins.split(",").length-1;
    localStorage.customSkins += ","+skinModalText;
    refreshSkins()

}

plusButton.onclick = X=>{
    skinModal.style.display = "block";
}

document.getElementsByName("blockSkin")[0].appendChild(plusButton);


function refreshSkins() {
	stopPreviewAnimation();
	var oldContainer = document.getElementById("allSkinContainer");
	oldContainer.parentNode.removeChild(oldContainer);
	addSkins();
	startPreviewAnimation();
}


function addSkins() {
	var skins = localStorage.customSkins.split(",")
	var allSkinContainer = document.createElement("div")
	allSkinContainer.id = "allSkinContainer"

	skins.map((skin,i)=>{
		if(i>0) {
		var src = skin.split(";")[0];
		allSkinContainer.innerHTML += `<div><input id="bskin`+i+`" type="checkbox" name="bSkin"><label for="bskin`+i+`"><img src="`+src+`" height="20"></label><img src="https://jstris.jezevec10.com/res/svg/dark/rubbish.svg" name="xbutton" class="xbutton" ></div>`
		var xbutton = document.getElementById("xbutton")
		}
	})

	document.getElementsByName("blockSkin")[0].insertBefore(allSkinContainer,plusButton)
	document.getElementsByName("xbutton").forEach((button, i)=>{
		button.addEventListener("click", W=>{var temp=localStorage.customSkins.split(',');temp.splice(i+1, 1);localStorage.customSkins=temp;refreshSkins()});
	})

}



function testCors(url) {
	/*
	var skinImg = new Image();
	skinImg.onload = function(){
	    loadSkin(this.src,this.height)
	};
	*/
    var myRequest = new XMLHttpRequest();
    myRequest.open('GET', url, true);
    myRequest.onreadystatechange = () => {
        if (myRequest.readyState !== 4) {
        	return
            //skinImg.src = url
        }
        if (myRequest.status != 200) {
            var myImage = document.createElement('img');
            //myImage.onerror=x=>{skinImg.src = "https://s.jezevec10.com/res/b1.png";}
            myImage.onload=a=>{loadSkin("https://s.jezevec10.com/res/b1.png",32)/*loadSkin("https://cors-anywhere.herokuapp.com/" + myImage.src, myImage.height);*/}
            myImage.src = url;
        } else {
        	var myImage = document.createElement('img');
        	myImage.onload=a=>{loadSkin(myImage.src, myImage.height);}
        	myImage.src = url
        }
    };
    myRequest.send();
}



function loadSkinNoSize(src) {
	var spliced = src.split(";")
    console.log(src)
	if(spliced.length>1){
		Game['animatedSkin'] = src.split(" ").map(x=>x.split(";"))
	}

	if(spliced[0].endsWith(".mp4") || spliced[0].endsWith(".webm") || spliced[0].endsWith(".gif")){
		loadVideoSkin(spliced[0])
	} else {
		testCors(spliced[0])
	}

}



Game['deployRandomSkin'] = function() {
	if (typeof Game['stopAnim'] == 'function') {
  		Game['stopAnim']();
  		Game['animatedSkin'] = []
	}

	var candidates = localStorage.activeSkins.split(",").slice(1);
	var choice = candidates[Math.floor(Math.random()*candidates.length)];
console.log(choice)
var numberOfDefaultSkins = document.getElementsByName("bSkin").length - localStorage.customSkins.split(",").length
	if(choice > numberOfDefaultSkins-1) {
		frames = localStorage.customSkins.split(",")[choice-numberOfDefaultSkins].split(" ")

		if(frames.length>1){
    		Game['animatedSkin'] = frames.map(x=>x.split(";"))
    		Game['animationRunning']&&Game['startAnim']();
    	}
	}

    loadSkinNoSize(document.getElementsByName("bSkin")[choice].nextSibling.children[0].src)
}


settingsSave.onmouseup = Y=>{

	try{
		stopPreviewAnimation();

		localStorage.activeSkins = ""
    	document.getElementsByName("bSkin").forEach((e,i)=>{
    	    if(i>2 && e.checked){
    	    	localStorage.activeSkins += ","+i;
   	    	}
   		})
   		Game['deployRandomSkin']()
	} catch(e) {
		console.log("_")
	}

}








var randomizeStart = Game['prototype']['readyGo'].toString()
randomizeStart = trim(randomizeStart) + ";setTimeout(x=>{Game['deployRandomSkin']()}, "+0+");"
Game['prototype']['readyGo'] = new Function(randomizeStart);





settings.onmouseup = Z=>{
	startPreviewAnimation();

	setTimeout(U=>{
		for(var checkbox of document.getElementsByName("bSkin")) {
			checkbox.checked = false;
		}
		var skins = localStorage.activeSkins.split(",");
		if(skins.length > 0) {
			for (var i = 1; i < skins.length; i++) {
				document.getElementsByName("bSkin")[skins[i]].checked = true
			}
		} else {
			document.getElementsByName("bSkin")[3].checked = true
		}

	}, 100)
}


var previewIntervals = []
var previewsAnimated = false;

function startPreviewAnimation() {
	var skins = localStorage.customSkins.split(",")

	skins.map((skin,j)=>{
		var frames = skin.split(" ").map(x=>x.split(";"))
		if(frames.length > 1) {

			var animLength = frames.length*localStorage.animSpeed
			frames.map((x,i)=>{
				setTimeout(()=>{previewIntervals.push(setInterval(()=>{
					document.getElementById("bskin"+j).nextSibling.children[0].src = frames[i][0]
				}, animLength))}, i*(animLength/frames.length))
			})
		}
	})
	previewsAnimated = true
}

function stopPreviewAnimation() {
	for (var i=0; i < previewIntervals.length; i++) {
        clearInterval(previewIntervals[i]);
    }
}

addSkins();
Game['deployRandomSkin']();

    });
})();