Countdown Timer Help

[Bobby]

Hi, All!

I want to use the countdown timer to to countdown from a date the user enters with the date / time picker.

For example - User selects a date that is 2 weeks from now. The countdown timer would show on their page 14 days, 0 hours, 0 minutes, 0 seconds and countdown from there.

Also, if they come back tomorrow it will still show the correct countdown time.

Any advice?

Thanks!

[Yongki]

Hi @Bobby ,

I would suggest to save both date time fields to users collection, and subtract them and use the result to transform into hours, minutes and seconds.

For days, just get the integer value, for hours multiply with 24, minutes and seconds with 60 * and another * 60.

Play around and you can check the real value, use modulus formula to rebuild the fraction.

[Bobby]

When you say both date time fields, do you mean the current day/time and then the future day/time?

You would have to constantly update the current day/time to get the countdown to work correctly though right?

Maybe every time someone visits the page it updates that field to the current day/time?

[Yongki]

To avoid the continuous getting calculated date time, when user go to that specific screen, current time can be saved and calculated, but this will remove the real time updates.

But you can calculate based on current time directly and show in real time, but this will consume both connection and performance in users device.

[Bobby]

I cannot get this to work for the life of me… I still cannot even get an accurate countdown let alone the update factor of it all.

[Victor]

Hi @Bobby,

This video might be useful for you: Adalo Mini-App series: CountDown Timer Pause and Continue - YouTube
It doesn’t answer your question directly, but explains some parts of the logic working with countdown timer.

Best,
Victor.

[Bobby]

Thanks, @Victor

Any idea how to get the amount of seconds from a date picker?

Do we know how that is stored?

[Victor]

Hi @Bobby,

Datepicker by itself doesn’t have any functionality. Treat it like a “selector”. So what you can do:

• add a numeric property to some collection (e.g. MySeconds)
• add a button. For this button, add an “Update” action to update MySeconds. The value should be taken from DatePicker and multiplied by 86400.
• the result you get will be number of seconds from 01/01/1970, 12:00 AM, GMT+0.

I am not sure why would you need it though If you would like to have a number of seconds between now and some date in future, then you need to update this numeric property with something like “(value from datepicker - current time) * 86400”.

Maybe you will need it to do in 2 steps: first put the values of Current Time and Datepicker’s into 2 additional datetime properties, and then use the values from these properties to calculate the difference. But in my opinion one-step should work.

Best,
Victor.

[Bobby]

Thanks, @Victor

That formula is giving me no results. Maybe you can see what I’m doing wrong.

The user picks a date in the date picker and presses a button which updates the user

That then links to a new screen with the countdown timer which is setup like this:

The result I get from that initial calculation is blank.

[Victor]

Hi @Bobby,

I can’t imagine what you could be doing wrong - I have just created the same setup and it works for me perfectly (no need for 2 step, same formula).

Is “Seconds” a Numeric property?
Are you 100% sure the user is logged-in? If you get to this screen with non-logged-in user then this property won’t be changed.

Best,
Victor.

[Bobby]

Thanks, @Victor
No clue what I was doing wrong so I rebuilt the test and now it seems to be working.

Thanks again!