Display timer as countdown

PennController for IBEX Forums Support Display timer as countdown

This topic contains 2 replies, has 2 voices, and was last updated by Avatar samsanto 2 weeks, 2 days ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #6769
    Avatar
    samsanto
    Participant

    Hi Jeremy,

    I was wondering if there was an easy way to display the timer on the screen as a countdown. I want to give participants only one minute for example to do a task, but I want them to be able to see and keep track of the seconds as they count down.

    Thanks for your help!

    -Sam

    #6770
    Jeremy
    Jeremy
    Keymaster

    Hi Sam,

    Here is a code that illustrates the basic idea:

    newVar("finishTime").set(v=>Date.now()+90000) // 90000 = 90s = 1min30s
    ,
    newText("countDown", "1m30s").print()
    ,
    // This Timer element will execute a callback after 1s
    newTimer("updateCountdown",1000).callback( 
        newVar("difference")
            .set(getVar("finishTime")).set(v=>v-Date.now())
            .test.is(v=>v>0) // Positive value means current time still below finish time
            .success(
                // Transform the Var element into an appropriately formatted string
                getVar("difference")
                    .set(v=>Math.trunc(v/60000)+"m"+Math.round((v/1000)%60)+"s")
                ,
                getText("countDown").text(getVar("difference")) // Update the Text element
                ,
                // Relaunch the timer to update again in 1s
                getTimer("updateCountdown").start()
            )
    ).start() // Don't forget to start the timer initially

    You can see it live here: https://farm.pcibex.net/r/hvXkjO/

    Jeremy

    #6771
    Avatar
    samsanto
    Participant

    Thanks so much Jeremy! This is exactly what I needed.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.