function gameTimeFormatter(seconds) {
    seconds = Math.ceil(seconds / 1000)
    var minutes = Math.ceil(seconds / 60)
    var hours = Math.floor(minutes / 60)
    if (seconds <= 60) {
        return 'about ' + seconds + ' seconds'
    } else if (minutes < 60) {
        return `${minutes} Minutes`
    }

    return `${hours} hours and ${minutes % 60} minutes`

}

function timeFormatter(seconds) {
    seconds = Math.ceil(seconds / 1000)
    var minutes = Math.floor(seconds / 60)

    if (seconds % 60 < 10) {
        return `${minutes}:0${seconds % 60}`
    } else {
        return `${minutes}:${seconds % 60}`
    }
}


function secondLoop() {
    $(".durationBarFormatter").each((_, item) => {
        item = $(item)
        item.text(`${timeFormatter((Math.min(Date.now(), item.attr("data-end")) - item.attr("data-start")))}/${timeFormatter((item.attr("data-end") - item.attr("data-start")))}`)
    })

    $(".playTimeStart").each((_, item) => {
        item = $(item)
        item.text(`${timeFormatter((Math.min(Date.now(), item.attr("data-end")) - item.attr("data-start")))}`)
    })

    $(".playTimeEnd").each((_, item) => {
        item = $(item)
        item.text(`${timeFormatter((item.attr("data-end") - item.attr("data-start")))}`)
    })

    $(".timeEstimate").each((_, item) => {
        item = $(item)
        item.text(gameTimeFormatter(Date.now() - item.attr("data-start")))
    })

    $(".endEstimate").each((_, item) => {
        item = $(item)
        item.text(timeFormatter((item.attr("data-end") - Date.now())))
    })

    setTimeout(() => {
        secondLoop()
    }, 1000);
}

document.addEventListener("DOMContentLoaded", function() {
    secondLoop()
})