import gsap from "gsap"
import { closeMainMenuUI, openMainMenuUI } from "./mainmenuui"
export function creditsUI(game, stageData) {
    document.getElementById("credits-container").addEventListener('click', () => {
        hideCreditsUI(game, stageData)
    })

    document.getElementById("credits-back-button").addEventListener('click', () => {
        hideCreditsUI(game, stageData)
    })

    document.getElementById("credits-panel").addEventListener('click', event => {
        event.stopPropagation()
    })
}

export function showCreditsUI(game, stageData) {
    document.getElementById("credits-container").style.display = "flex"
    const panel = document.getElementById("credits-panel")
    gsap.to(panel, {x: 0, duration: 0.8, onComplete: () => {
    }})
    closeMainMenuUI(game, stageData)
}

export function hideCreditsUI(game, stageData) {
    const panel = document.getElementById("credits-panel")
    gsap.to(panel, {x: -1024, duration: 0.8, onComplete: () => {
        document.getElementById("credits-container").style.display = "none"
   }})
   openMainMenuUI(game, stageData)
}