// ==UserScript==
// @name         bonk.io Fullscreen Mod
// @namespace    http://tampermonkey.net/
// @version      1.1.3
// @description  This script removes all the junk from bonk.io website and makes the game take up the whole page.
// @author       kitaesq
// @match        https://bonk.io
// @icon         https://www.google.com/s2/favicons?sz=64&domain=bonk.io
// @grant        none
// @downloadURL https://update.greasyfork.icu/scripts/553932/bonkio%20Fullscreen%20Mod.user.js
// @updateURL https://update.greasyfork.icu/scripts/553932/bonkio%20Fullscreen%20Mod.meta.js
// ==/UserScript==
console.log("Loading fullscreen mod...")
if (!window.kitaes) window.kitaes = {}
window.kitaes.fullscreen = async () => {
    function findElement(document, selector){return new Promise((res, rej) => {
        let interval = setInterval(() => {
            console.log("x", document)
            const el = document.querySelector(selector)
            if (el){
                clearInterval(interval)
                res(el)
            }
        }, 100)
    })}
    const styleElem = document.createElement("style")
    styleElem.innerText =
`body{
    overflow: hidden;
    visibility: hidden;
}
#maingameframe{
    margin: 0 !important;
    position: fixed;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
}
#theme_container{
    top: 36px;
    visibility: visible;
}`
    document.head.append(styleElem)
    document.body.style.visibility = "hidden"
    document.body.style.overflow   = "hidden"
    const maingameframe = await findElement(document, "#maingameframe")
    maingameframe.style.visibility = "visible"
    maingameframe.style.marginTop = "0"
    const iframeWait = (iframe) => (new Promise(res => iframe.addEventListener('load', res)));
    if (maingameframe.contentDocument.URL === "about:blank") {
        console.log("iframe is not loaded yet, waiting for iframe to load...")
        await iframeWait(maingameframe)
        console.log("iframe was loaded")
    }
    const fdocument = maingameframe.contentDocument
    const fwindow = maingameframe.contentWindow
    const fstyleElem = document.createElement("style")
    fstyleElem.className = "kitaes-fullscreen-style"
    fstyleElem.innerText =
`#bonkiocontainer{
    width: 100% !important;
    height: 100% !important;
    border: none !important;
}
canvas{
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}
#xpbarcontainer{
    top: -4px !important
}
#fullscreen_button{
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABPSURBVEhLYxgFhAAjlAaD/0AAZWIARiCAMsGAWLVMUJpmgOYW4PQ2epAQArj0Dv0gorkFo2DgwWg+IAhobgHOOEAH6HFCrNrRomLYAwYGACfdIBnA7J6WAAAAAElFTkSuQmCC);
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    top: 35px;
    left: 0;
    margin: 10px;
    width: 40px;
    height: 40px;
    pointer-events: auto;
}`
    const bonkioContainer = await findElement(fdocument, "#bonkiocontainer")
    fdocument.head.append(fstyleElem)
    const prettyMenu = await findElement(fdocument, "#prettymenu")
    const fullscreenBtn = document.createElement("div")
    fullscreenBtn.id = "fullscreen_button"
    fullscreenBtn.className = "brownButton brownButton_classic buttonShadow"
    let isFullScreen = false
    fullscreenBtn.onclick = () => {
        if (!isFullScreen) {
            if (document.body.mozRequestFullScreen) document.body.mozRequestFullScreen()
            else document.body.requestFullscreen()
        }
        else{
            document.exitFullscreen()
        }
        isFullScreen = !isFullScreen
    }
    prettyMenu.append(fullscreenBtn)
    fdocument.body.lastElementChild.style.top = "85px"
}
window.kitaes.fullscreen()