How to countdown and divide the time into segments?

Question

I wish to do a countdown to a specific date and hour (January 10, 2018, 19:30). Which in large part I am able to do. Below code shows the remaining days, hours, minutes and seconds.

The tricky bit is to get certain periods of time. The countdown should respond to the following: 1. on the deadline day and hour show the message 'Now going live'. Which is 10 January 2018 19:30. 2. That same day but BEFORE 19:30 it should say 'Going live tonight' 3. The complete day before the deadline day (from 00:00 to 23:59) it should say 'last day' 4. The complete days before that it should say 'many days to go'

Step 1 and 2 I managed, but I'm having trouble getting the complete day before the deadline day and the complete days before that. That's because I'm not able to define the complete day before the deadline day (and the days before that). Because it counts '1 day' as 1 day before 10 January 19:30 (so it also takes those hours/minutes of 19:30 into account).

Step 1 and 2 I managed in the if-loop, but I can't figure out how to do step 3 and 4. Step 3 should say something like 'count one day, but before 10 January 2018 00:00. So it should subtract that 19:30 to get to 9 januari 2018 00:00-23:59. And the same for step 4. Can someone fix my code?

// Get todays date and time
var now = new Date().getTime();

// Set the date we're counting down to
var countDownDate = new Date("Januari 10, 2018 19:30").getTime();

// Find the distance between now an the count down date
var distance = countDownDate - now;

// Time calculations for days, hours, minutes and seconds
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);

// Display the result 
this.timeleft.text = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";

// countdown day 19:30
if ((days == 0) && (hours == 0) && (minutes == 0)) {
    this.countdown.text = "NOW GOING LIVE!";
    // countday day 00:00 - 19.30
} else if ((days == 0) && (hours <= 19) && (minutes <= 30)) {
    this.countdown.text = "GOING LIVE TONIGHT!";
    // 9 January 00:00 - 23:59
} else if ((days <= 1) && (hours >= 19) && (minutes >= 30)) {
    this.countdown.text = "LAST DAY";
    // days before 10 January
} else if (days >= 1) {
    this.countdown.text = "MANY DAYS TO GO";
}

Instead of using the raw time, you can just use the Date API to determine [when a day before the end date is](https://stackoverflow.com/questions/1296358/subtract-days-from-a-date-in-javascript) for example. Also, on a separate note, you have a typo - it's supposed to be Januar**y** instead of Januar**i**. — VLAZ, Jan 05 '18 at 14:58

score 0 · Accepted Answer · answered Jan 05 '18 at 15:14

Since the "deadline" is hard-coded, you can hard-code everything and end up with something very simple:

var now = new Date().getTime();

var lastDayThreshold = new Date("January 9, 2018 00:00").getTime();
var liveTonightThreshold = new Date("January 10, 2018 00:00").getTime();
var countDownDate = new Date("January 10, 2018 19:30").getTime();

if (now < lastDayThreshold) this.countdown.text = "MANY DAYS TO GO";
else if(now < liveTonightThreshold) this.countdown.text = "LAST DAY";
else if(now < countDownDate) this.countdown.text = "LIVE TONIGHT";
else this.countdown.text = "NOW GOING LIVE";

score 0 · Answer 2 · answered Jan 06 '18 at 10:42

Alex's answer was indeed what I was after. Those 'treshhold times' did the trick. Was thinking about improving it though as now I have to hard-code three dates/times. Preferably I would like to only specify the countDownDate date/time. And then let both Threshold dates calculate themselves. I tried to do that in a way, but ran into a problem. I know how to specify one day (1000 * 60 * 60 * 24), so I could subtract this 'oneday' value to get to the day before. But I wasn't able to calculate the milliseconds for the specified time 19:30. In order to read the miilliseconds since the beginning of January 10 until January 10 19:30. If I were able to do that it would look something like this (though I know this is incorrect, but you'll get the idea):

var oneday = 1000 * 60 * 60 * 24;
var countDownDate = new Date("January 10, 2018 19:30").getTime();
var lastDayThreshold = new Date(countDownDate - oneday "00:00").getTime();
var liveTonightThreshold = new Date(countDownDate "00:00").getTime();

You'll see my problem: for lastDayTreshold I could subtract one day of the countdowndate but then it would consider that 19:30 the previous day, not 00:00. And for liveTonightThreshold I also couldn't specify that I mean 00:00 of the countdowndate.

Would there be a way of doing that? Then I would just have to specify the countdown day and time and the rest would figure them out themselves.

How to countdown and divide the time into segments?

2 Answers2