// ==UserScript==
// @name         Bonk Speedrun Timer
// @version      1.0
// @author       Fury_101
// @description  Adds a speedrun timer.
// @match        https://bonk.io/gameframe-release.html
// @run-at       document-end
// @grant        none
// @license      GNU GPLv3
// @namespace https://greasyfork.org/users/919958
// @downloadURL none
// ==/UserScript==

const container = document.createElement("div");
document.getElementById('pagecontainer').appendChild(container);
container.outerHTML = `
<div class="windowShadow" style="display: unset;" id="BSTcontainer">
    <div class="newbonklobby_boxtop newbonklobby_boxtop_classic" id="BSTtop" style="background-color: #009688;">
        BST
    </div>
	<div id="BSTtimercontainer" style="text-align:center">
        <span id="BSTtimer">00:00.00</span>
    </div>
	<div class="newbonklobby_settings_button brownButton brownButton_classic buttonShadow" style="width:100%;" id="BSThidetimer">
		Hide Timer
    </div>
</div>
`
document.getElementById("BSThidetimer").addEventListener("click", (e) => {
    if (document.getElementById("BSTcontainer").style.visibility === "hidden") {
        document.getElementById('BSTcontainer').style.visibility = "inherit";
        document.getElementById("BSTcontainer").style.height="100px";
        e.target.style.width='100%';
        e.target.innerHTML='Hide Timer';
        return;
    }
    document.getElementById("BSTcontainer").style.height="30px";
    document.getElementById("BSTcontainer").style.visibility = "hidden";
    e.target.style.width='25%';
    e.target.style.margin="0 auto";
    e.target.innerHTML='Show';
});

let BSTCSS = document.createElement('style');
BSTCSS.innerHTML = `
#BSTcontainer {
    background-color: #cfd8cd;
    width: calc(35.2vw - 400px);
    min-width: 154px;
    max-width: 260px;
    height: 100px;
    position: absolute;
    right: 1%;
    top: 60px;
    border-radius: 7px;
    transition: ease-in-out 100ms;
}
#BSTtimer {
    font-family: "futurept_b1";
    text-align: center;
    height: 32px;
    line-height: 32px;
    font-size: 20px;
}
#BSThidetimer {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    visibility: visible;
}
`
document.getElementsByTagName('head')[0].appendChild(BSTCSS);

const credit = document.getElementById("ingamemapcredit");
const countdown = document.getElementById("ingamecountdown");
const winner = document.getElementById("ingamewinner");
const lobby = document.getElementById("newbonklobby");
const config = {
    attributes: true,
    attributeOldValue: true,
    attributeFilter: ["style"]
}

window.startTime = null;
window.timerStarted = false;

const startObserver = new MutationObserver(mutationList => {
    for (const mutation of mutationList) {
        if (mutation.type === 'attributes' && mutation.attributeName === 'style') {
            if (mutation.target.style.visibility === "hidden" && mutation.oldValue.search("visibility: inherit") !== -1) {
                console.log("START TIMER");
                window.startTime = Date.now();
                window.timerStarted = true;
                break;
            }
        }
    }
});

startObserver.observe(countdown, config);
startObserver.observe(credit, config);

const endObserver = new MutationObserver(mutationList => {
    for (const mutation of mutationList) {
        if (mutation.type === 'attributes' && mutation.attributeName === 'style' && window.timerStarted) {
            if (mutation.target.style.visibility === "inherit" && mutation.oldValue.search("visibility: hidden") !== -1) {
                console.log("END TIMER");
                window.timerStarted = false;
                console.log(`FINAL TIME: ${Date.now() - window.startTime}`);
            }
        }
    }
});

endObserver.observe(winner, config);

const checkObserver = new MutationObserver(mutationList => {
    for (const mutation of mutationList) {
        if (mutation.type === 'attributes' && mutation.attributeName === 'style' && window.timerStarted) {
            if (mutation.target.style.display === "block" && mutation.oldValue.search("display: none;") !== -1) {
                console.log("END TIMER");
                window.timerStarted = false;
                console.log(`FINAL TIME: ${Date.now() - window.startTime}`);
            }
        }
    }
});

checkObserver.observe(lobby, config);

function injector(src){
	let newSrc = src;

    newSrc = newSrc.replace("{v2k[79][v6H[1][1118]][v6H[1][1656]]();}","{v2k[79][v6H[1][1118]][v6H[1][1656]]();}if(window?.timerStarted){const now=new Date(Date.now()-window.startTime);document.getElementById('BSTtimer').innerText=`${now.getMinutes().toString().padStart(2, '0')}:${now.getSeconds().toString().padStart(2, '0')}.${now.getMilliseconds().toString().padStart(2, '0')}`}");

	if(src === newSrc) throw "Injection failed!";
	console.log("Bonk Speedrun Timer injector run");
	return newSrc;
}

// Compatibility with Excigma's code injector userscript
if(!window.bonkCodeInjectors) window.bonkCodeInjectors = [];
window.bonkCodeInjectors.push(bonkCode => {
	try {
		return injector(bonkCode);
	} catch (error) {
		alert(`Whoops! Bonk Speedrun Timer was unable to load.
This may be due to an update to Bonk.io. If so, please report this error!
This could also be because you have an extension that is incompatible with \
Bonk Speedrun Timer`);
		throw error;
	}
});

console.log("Bonk Speedrun Timer injector loaded");