CatBoat-Launcher/app/assets/js/index.js

const navBar = document.querySelector("nav")
const uiButtons = document.querySelector("footer>section.left")
const footer = document.querySelector("footer")
const leftSection = document.querySelector("section.left")
const playButton = document.querySelector("button[name='play']")
const audioPourcentageLabel = document.querySelector("label[for='audioVolume']")
const audio = new Audio()

function startAudio() {
    audio.src = "./assets/audio/main_menu.mp3"
    audio.loop = true
    audio.play()
    audio.onended = () => {
        if (!audio.paused) {
            audio.play()
        }
    }
    updateVolume(audio.volume)
}

function muteAudio() {
    audio.muted = true
}

function unmuteAudio() {
    audio.muted = false
}

function showNavBar() {
    footer.style.zIndex = "-1"
    leftSection.style.zIndex = "-1"
    navBar.removeAttribute("hidden")
    for (const button of uiButtons.children) {
        button.setAttribute("hidden", "")
    }
}

function hideNavBar() {
    footer.style.zIndex = "9"
    leftSection.style.zIndex = "9"
    navBar.setAttribute("hidden", "")
    for (const button of uiButtons.children) {
        button.removeAttribute("hidden")
    }
}

function toggleAudio(element) {
    if (element.getAttribute("state") == 0) {
        system.call("audio::mute")
        element.setAttribute("state", 1)
        element.children[0].classList.replace("fa-music", "fa-music-slash")
    } else {
        system.call("audio::unmute")
        element.setAttribute("state", 0)
        element.children[0].classList.replace("fa-music-slash", "fa-music")
    }
}

function toggleMusic(element) {
    if (element.getAttribute("state") == 0) {
        audio.pause()
        element.setAttribute("state", 1)
        element.children[0].classList.replace("fa-pause", "fa-play")
        element.children[1].innerText = "Reprendre"
    } else {
        audio.play()
        element.setAttribute("state", 0)
        element.children[0].classList.replace("fa-play", "fa-pause")
        element.children[1].innerText = "Pause"
    }
}

function toggleMusicVolume(element) {
    if (element.getAttribute("state") == 0) {
        system.call("audio::mute")
        element.setAttribute("state", 1)
        element.children[0].classList.replace("fa-volume", "fa-volume-slash")
        element.children[1].innerText = "Activer le son"
    } else {
        system.call("audio::unmute")
        element.setAttribute("state", 0)
        element.children[0].classList.replace("fa-volume-slash", "fa-volume")
        element.children[1].innerText = "Couper le son"
    }
}

function updateVolume(value) {
    audio.volume = value / 100
    audioPourcentageLabel.innerText = `${value}%`
}

function logout() {
    system.call("auth::reset")
    document.location.href = './login.html'
}

system.result("server::ping", pong => {
    playersStatus.innerText = `${pong.players.online}/${pong.players.max}`
})

function handleOptionsChanges(key, value) {
    system.call("game::optionSet", { key, value })
    const span = document.querySelector(`span#current${key.replace(/./, c => c.toUpperCase())}`)
    if (span) {
        span.innerText = Math.floor(value)
    }
}

function handleSettingsChanges(key, value) {
    system.call("settings::set", { key, value })
    const span = document.querySelector(`span#${key == "ram" ? "currentRam" : key}`)
    if (span) {
        span.innerText = key == "ram" ? Math.floor(value.max / 1024) + " G" : value
    }
}

function setLoadingType(type) {
    const loader = document.querySelector(".loader")
    switch (type) {
        case "continuous":
            loader.children[0].children[0].classList.remove("progress")
            loader.children[0].children[0].classList.add("loading")
            break
        case "progress":
            loader.children[0].children[0].classList.remove("loading")
            loader.children[0].children[0].classList.add("progress")
            break
        default:
            break
    }
}

function setLoadingProgress(pourcentage) {
    const loader = document.querySelector(".loader")
    const progress = loader.querySelector(".progress")
    if (progress) {
        progress.setAttribute("style", `width: ${pourcentage}%`)
    }
}

function toggleLoadingBar() {
    const loader = document.querySelector(".loader")
    if (loader.hasAttribute("hidden")) {
        loader.removeAttribute("hidden")
    } else {
        loader.setAttribute("hidden", "")
    }
}

function showLoadingBar() {
    const loader = document.querySelector(".loader")
    if (loader.hasAttribute("hidden")) {
        loader.removeAttribute("hidden")
    }
}

function hideLoadingBar() {
    const loader = document.querySelector(".loader")
    if (!loader.hasAttribute("hidden")) {
        loader.setAttribute("hidden", "")
    }
}

system.result("game::parseOptions", options => {
    gamma.checked = options.gamma == 1 ? true : false
    renderClouds.checked = options.renderrenderClouds == false ? false : true 
    guiScale.value = options.guiScale
    currentGuiScale.innerText = options.guiScale
    graphicsMode.checked = options.graphicsMode == 0 ? true : false
    renderDistance.value = options.renderDistance
    currentRenderDistance.innerText = options.renderDistance
})

system.result("settings::read", settings => {
    ram.value = settings.ram.max
    currentRam.innerText = `${Math.floor(settings.ram.max / 1024)} G`
})

system.result("hardware::ramInformation", $ram => {
    ram.setAttribute("max", $ram.avaibleRam)
    maxRam.innerText = `${Math.floor($ram.avaibleRam / 1024)} G`
})

system.result("game::launch", info => {
    if (info.disablePlayButton) {
        playButton.removeAttribute("hidden")
        hideLoadingBar()
    } else {
        playButton.setAttribute("hidden", "")
    }
})

system.result("game::launched", info => {
    muteAudio()
    hideLoadingBar()
})

system.result("player::profile", playerProfile => {
    console.log(playerProfile)
})

system.result("oculus::getdefaultshaderset", boolean => {
    sildurs_shader.checked = boolean
})

system.result("progress::update", info => {
    showLoadingBar()
    setLoadingType(info.type)
    if (info.type == "progress" && typeof info.pourcentage == "number") {
        setLoadingProgress(info.pourcentage)
    }
})

system.result("progress::hide", () => {
    hideLoadingBar()
})

system.result("izitoast::error", info => {
    iziToast.error(info)
})

system.result("progress::info", info => {
    iziToast.error(info)
})

window.onload = () => {
    system.call("hardware::ramInformation")
    system.call("game::parseOptions")
    system.call("server::ping")
    system.call("player::profile")
    system.call("settings::read")
    system.call("oculus::getdefaultshaderset")
    hideLoadingBar()
    startAudio()
}