Community X.

Connect with other creators, share ideas, give feedback and get the latest product updates.

Dec 03, 2020

can you do a countdown on editor X? i need to create an automated countdown for an offer on a project im working on. please help.

1 answer2 replies
2
Dec 03, 2020Edited: Dec 03, 2020

You should be able to do it using the "setInterval" function. "setInterval" requires two parameters - the first one is the function you want to continuously call and the second one is the time between each call in milliseconds.

This is how I would implement it


// Variable to set the countdown time
let countDownTime = 10;
// This will store the id of the interval function
let intervalId;

function Countdown()
{
    // Increment the time by 1 sec
    countDownTime-=1;
    
    // Check if countdown has still not finished. If it has not, display the number otherwise stop the interval function
    if(countDownTime > 0)
    {
        $w("#countdownText").text = countDownTime.toString();
    }
    else
    {
        // This is to stop calling the function after the countdown has reached 0
        clearInterval(intervalId);
        
        //Do your code here after the countdown is over
    }
}
$w.onReady(function () {
    $w("#countdownText").text = countDownTime.toString();
    
    // Call the function every second
    intervalId = setInterval(()=>{
        Countdown()
    }, 1000);
}



Dec 03, 2020

Thank you alot, im not a good "coder". I just started to use editor X because of the "No Code" usability. For the code that you send me. I just need to drop it on the iframe element?

Dec 03, 2020Edited: Dec 03, 2020

@emorel You first have to activate "Dev Mode" on the top of the page. This will allow you to write code.

When you have activated it, you will have to click on the code icon to start writing the code.


You should be able to delete everything on the code page and just place the code I sent above.


The last thing you will have to do is create a Text element that will hold the number and set the id of the field to be "countdownText".


You should be able to set its "id" by clicking "View" and then select "Code Properties" in the editor.



Then when you click on the text you just added there should be a box popup to the right side of the editor that should look like this:

Here you can set the id to be the correct one and this should be all.

Editor X

Design your boldest creations.