// ==UserScript==
// @name         i30cps stratums mod
// @version      1.1
// @description  idk
// @author       i30cps
// @match        *://stratums.io/*
// @icon         data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @license MIT
// @grant        none
// @namespace aTMwY3BzIHN0cmF0dW1zIG1vZCAtIHdoeSBkaWQgeW91IGF0b2IgdGhpcw==
// @downloadURL none
// ==/UserScript==

var replacer = ['acyoepxusnACEOXKHMBDTI', 'асуоерхᴜꜱꪀАСЕОХКНМВᗪТＩ'];
var chat;
var shop;
var cvs = document.querySelectorAll('canvas')[1];
var updateMenuKey = false;

document.addEventListener('keydown', (e) => {
    if (!chat) {
        if (document.activeElement.placeholder.includes('Enter chat')) chat = document.activeElement;
    }
    else {
        for(let i = 0; i < replacer[0].length; i++){
            chat.value = chat.value.replaceAll(replacer[0].charAt(i), replacer[1].charAt(i));
        }
    }
})


// find the shop
var shopFinder = setInterval(() => {
    for (let i = 0; i < document.querySelectorAll('span').length; i++) {
        if (document.querySelectorAll('span')[i].innerText == 'Giraffe Cap') {
            shop = document.querySelectorAll('span')[5].parentElement.parentElement;
            document.shop = shop;
            clearInterval(shopFinder);
        }
    }
}, 500);

/* Edit Start */

cvs.style.cursor = 'url(http://cur.cursors-4u.net/user/use-1/use153.cur), default';


/* Edit End */

var menuChange = document.createElement("div");
menuChange.className = "menuCard";
menuChange.id = "mainSettings";
menuChange.innerHTML = `
<div id="simpleModal" class="modal">
<div class="modal-content">
<div class="modal-header">
<span class="closeBtn">&times;</span>
<h2 style="font-size: 17px;">Settings</h2>
</div>
<div class="modal-body" style="font-size: 17px;">
<div class="modal-content" style="font-size:14px">
<p>Info</p>
</div>
<div class="flexControl">
<a id="menuchanger">Menu Key: Backquote - Click this text and press a key to change it!</a>
<h3 style="font-size: 17px;"> Settings </h3>
<label class="container">Aim Cursor?
<input type="checkbox" id="aimCursor" checked="true">
<span class="checkmark"></span>
</label><br>
</div>
</div>
</div>
</div>`
document.body.appendChild(menuChange)

setTimeout(() => { // buffer for modal to load
    // future: set the values to the localStorage i30cps binds
    setTimeout(() => { // buffer for modal to update
        setInterval(() => {
            // future: set the localStorage i30cps binds to their values
        }, 500);
    }, 1000);
}, 500);

var styleItem = document.createElement("style");
styleItem.type = "text/css";
styleItem.appendChild(document.createTextNode(`
.keyPressLow {
margin-left: 8px;
font-size: 16px;
margin-right: 8px;
height: 25px;
width: 50px;
background-color: #fcfcfc;
border-radius: 3.5px;
border: none;
text-align: center;
color: #4A4A4A;
border: 0.5px solid #f2f2f2;
}
.menuPrompt {
font-size: 17px;
font-family: 'Hammersmith One';
color: #4A4A4A;
flex: 0.2;
text-align: center;
margin-top: 10px;
display: inline-block;
}

.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
overflow: auto;
height: 100%;
width: 100%;
}

.modal-content {
margin: 10% auto;
width: 40%;
box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.2), 0 7px 20px 0 rgba(0, 0, 0, 0.17);
font-size: 14px;
line-height: 1.6;
}

.modal-header h2,
.modal-footer h3 {
margin: 0;
}

.modal-header {
background: #4287f5;
padding: 15px;
color: #fff;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

.modal-body {
padding: 10px 20px;
background: #fff;
}

.modal-footer {
background: #cf2727;
padding: 10px;
color: #fff;
text-align: center;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}

.closeBtn {
color: #ccc;
float: right;
font-size: 30px;
color: #fff;
}

.closeBtn:hover,
.closeBtn:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}

/* Customize the label (the container) */
.container {
display: block;
position: relative;
padding-left: 35px;
margin-bottom: 12px;
cursor: pointer;
font-size: 16px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}

/* Hide the browser's default checkbox */
.container input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}

/* Create a custom checkbox */
.checkmark {
position: absolute;
top: 0;
left: 0;
height: 25px;
width: 25px;
background-color: #eee;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
background-color: #ccc;
}

/* When the checkbox is checked, add a red background */
.container input:checked ~ .checkmark {
background-color: #cf2727;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
content: "";
position: absolute;
display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
left: 9px;
top: 5px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 3px 3px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}

`))
document.head.appendChild(styleItem);

var interv = setInterval(() => {
    if(!(localStorage.i30cps_MENU==undefined)){document.querySelector("#menuchanger").innerText = "Menu Key: "+localStorage.i30cps_MENU+" - Click this text and press a key to change it!";}
    if (document.querySelector("#menuchanger").innerText == "Menu Key: "+localStorage.i30cps_MENU+" - Click this text and press a key to change it!") {
        clearInterval(interv);
    }
}, 500);

if (!(localStorage.i30cps=='true')) {
    localStorage.i30cps = !0;
    localStorage.i30cps_MENU = 'Backquote';
    localStorage.i30cps_SPIKE = 'v';
    localStorage.i30cps_BOOST = 'f';
    localStorage.i30cps_MILL = 'z';
    localStorage.i30cps_TURRET = 'g';
    localStorage.i30cps_WALL = 't';
    localStorage.i30cps_SPAWNPAD = 'b';
}

document.addEventListener('keydown', (e)=>{
    if (updateMenuKey) {
        updateMenuKey = false;
        localStorage.i30cps_MENU = e.code;
        document.querySelector("#menuchanger").innerText = "Menu Key: "+e.code+" - Click this text and press a key to change it!";
    }
});

var modal = document.getElementById('simpleModal');
var closeBtn = document.getElementsByClassName('closeBtn')[0];

window.addEventListener('keydown', function(e) {
    if (e.code == localStorage.i30cps_MENU){
        if (modal.style.display == "none") {
            modal.style.display = "block";
        } else {
            modal.style.display = "none";
        }
    }
})

// Events
closeBtn.addEventListener('click', closeModal);
window.addEventListener('click', outsideClick);

// Close
function closeModal() {
    modal.style.display = 'none';
}

// Close If Outside Click
function outsideClick(e) {
    if (e.target == modal) {
        modal.style.display = 'none';
    }
}

document.querySelector("#menuchanger").onclick = (e) => {updateMenuKey = true}

document.querySelector("#aimCursor").addEventListener('change', function() {
    if (this.checked) {
        cvs.style.cursor = 'url(http://cur.cursors-4u.net/user/use-1/use153.cur), default';
    } else {
        cvs.style.cursor = 'default';
    }
})