A Flexible Countdown Timer

Had a quick play with an idea of using months shown as month names rather than number.
The idea is that a month view will show the current month name with a green bar in it and the remains months plain,

Was also testing past moths being marked with a red line. but not sure that part works as expected in the way I wrote this and could actually be left out.

This coding is just me fleshing the idea out to see how practical it is to use a current month and remainder month view instead of numbers, it is not optimised and the logic would need work. I may not come back to this to do more with it but it may help ..

FlexibleCountdownTimer_months.hype.zip (65.4 KB)

1 Like

Thank you for the observation and the explanation. I wonder what does swoogo use in this scenario clearly they think it works for them, I did however bring it to the designers attention the hours were off the event starts at 9:00am 9/6/2023 however he had it completely off according to their timing in my code the event will be starting at var countDownDateString = "2023-09-04T13:00:00-00:00";?

Can you kindly check to see if whatever I'm doing here makes any sense as it relates when the even will actually occur?
Counddown.hype.zip (174.3 KB)

I wonder what would the code look like with moment .js in my example.

@MarkHunte your approach to countdown with the weeks vs months maybe the best alternative though I want to match it to style of presentation used in the example.

The code for that is in an above post.

Don't for get to add the class name countdown_weeks countdown_format_1 to the element.


On an aside I changed the line in my code from
var diff = monthDiff(currentDate, endDate) ;

var diff = monthDiff(currentDate, endDate) + 1;
Which will make sure the end month is listed.
And then added code ( not posting here since its a hacked together concept code, i.e messy) to show the remaining days in each month.

So if the date is 2023-08-10T00:00:00-00:00

or

2023-09-02T00:00:00-00:00

Any way just a thought...

1 Like

Question, How would I change the weeks to month given that you did your precise countdown using the weeks countdown method?

I linked to the code in my last post..

Dates are complex enough and so out of my wheel house that I wouldn't feel comfortable making guarantees on date solutions... The good news is that since it is all local you should be able to test by changing the times/locations on your computer and manually testing/verifying, at least for the important locales. I think you were doing this for particular sales, so that should at least limit the possibilities.

The reality is that using simple arithmetic on dates is incorrect, it is just a matter of if you hit those cases with your sale times.

1 Like

Ok I see, btw, It's nothing to do with the immediate nature of sales as its not about driving sales maybe not at this point, though I do understand where you're coming from.