Animated Count UP timer component

Hey All! First time poster here.

I was wondering if someone could build a custom component for me please.

I need an animated count UP timer that can be started to time things and will persist when the screen is navigated away from.

I think If I could feed the component a date/time stamp to start from from the database it could look that up when the page with the timer was navigated to. I would also like to be able to customise the font colour, size and typeface. I would need to be able to stop the timer also when I select the option to.

Please could someone let me know if they can help and how much that might cost? I would plan to release it to the component marketplace as a paid component.

Thanks all! :slight_smile:

hey @thisisnickjames, welcome to the community!

do you have an inspiration (demo) video of the component? like from a popular app?

Hi James!

Thanks for the response.

Sure, here you go.

I was thinking that the component could take 2 inputs.

A time to count from
A time to count to (if null, keep counting)

This would support having a list of records, each with their own timer.

The component in the screenshot is a beautiful button with styling but I’m just interested in the actual counter, as I can always group the component with other Adalo components.

Thanks!

NJ

so is it basically a stopwatch but with advanced features?

I guess you could frame it that way. One might decide to have a timer per task or activity displayed within a list. Or just one large one on its own page, which as you say would be more like a stopwatch.

I would definitely pay for a component like this, anyway! Is this something you might be interested in making @James_App_Maker ? :slight_smile:

yeah, if it’s possible i would publish it to the marketplace. i’m still trying to see if the things that you asked for are even possible in adalo

Awesome.

I imagine the component would be looking at a single record.
Provide the component with a date/time field for the ‘start from’ variable
Provide the component with an optional ‘end at’ date/time field.
If the current time is past the end date time field then display the duration between the ‘start from’ and ‘end at’ fields in the timer.
If the ‘end at’ field is null or unspecified, keep the timer counting. This would ensure that the timer always displays the correct information when the user navigates away from the page and back again.

Does that make sense? @James_App_Maker :slight_smile:

Would you?

2 Likes

if you’re up for it you can make the component :grinning:

yeah it does make sense but yesterday when I was testing I wasn’t able to figure out how to implement it

Which particular part was the challenge?:slight_smile:

I would!

i think i’ve figured it out. i’ll let you know when i’m done

Thank you @James_App_Maker