Custom countdown

That’s what I figured, thank you so much!!

1 Like

This is a first step to be proud of by relying on the limitations of Glide. So far I have used free.timeanddate.com but only limited to countdown. Although there are analog or digital clocks with all the customizations, if you click it it will connect to the website.
Different if it can be developed in Glide will remain our own.

1 Like

Great work

1 Like

Yeah, and we can manipulate it just like what we want :wink:

1 Like

Yes @ThinhDinh, still leaving the alignment issue. I can’t find a way to align it to the center when dealing with webview components. And turn off hover.

Can you send me a screenshot of the problem?

If you look at my image above it’s the top left alignment. If it’s a digital countdown, there is an option for setting the padding. But I plan to add a small analog clock (no padding option) in the center or upper right corner that has not been implemented.

This is the HTML code:

<iframe src="https://free.timeanddate.com/clock/i87e54u3/n108/szw110/szh110/hoc000/hbw4/cf100/hgr0/hcw2/fav0/fiv0/mqc000/mqs3/mql25/mqw2/mqd96/mhc000/mhs3/mhl20/mhw2/mhd96/mmc000/mms3/mml5/mmw2/mmd96/hhs2/hhw8/hms2/hmw8/hmr4/hsc000/hss3/hsl90" frameborder="0" width="110" height="110"></iframe>

with all respect to Thin… you know that you can do that with the rich text component, without using a PRO feature web view? just CSS. I posted the demo on top.

1 Like

My app is pro so no problem if using webview. Maybe you can share your CSS here to share with others.

1 Like

Small bug though…when I enter 75 seconds, the delay only lasts for 15 seconds.

thank you for testing… I set CSS for 1 min… i need to upgrade it :wink: I did not think someone would test it for more than 1 min lol… but I will fix it

1 Like

It’s a clever use of CSS to make an animated second hand. In @ThinhDinh’s case, he wants actual numerals counting down to zero. I was able to coerce the stopwatch component to be a countdown timer, but it looks funny because it has negative numbers:
CleanShot 2022-02-17 at 22.46.48

1 Like

i just test it for 75 sec and it goes well… can you describe more details… what exactly you do?

3 Likes

Glide reminds me of Facebook a few months ago… putting cookies everywhere and embedding everything… Facebook stopped doing it… after a few lawsuits now you can run secure apps there… without crushing.

Look no further, I’ve found a way with CSS to set the clock position and clock size except for the hover popup.

1 Like

@ThinhDinh Do you know if it’s possible to add a sound that plays when the timer is finished? Forked your original code and made a few updates and have found references for adding sound but can’t seem to get it to work. Here is a link to the code I’m using. Thank you so much for your help, it has gone a long way and really appreciate it!

There is something called “autoplay policy” for Chrome, Safari, and many other browsers to make sure you get a user’s “approval” before playing audio.

Personally, I have no experience in doing something like this, but you may get some idea with the answer below.

1 Like

Thank you!

1 Like

I have made a couple of adjustments (removing the days and hour function + setting the date to the selected date instead of now). How can I make a link similar to yours? And how can I make the different info-boxes in glide (Ending time, font size…)?