Posted by: hid Feb 13 2020, 09:59 AM
I am making a countdown like this:
CODE
Date.prototype.addDays = function(d){
return new Date(this.valueOf()+864E5*d);
};
// get cd date
var cdDate = new Date().addDays(5);
var cd = setInterval(function(){
// Get time now
var now = Date.now();
// Get distance between now and cdDate
var distance = cdDate - now;
// Get time left
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);
// Update UI
ui_days.firstElementChild.textContent = days;
ui_hours.firstElementChild.textContent = hours;
ui_minutes.firstElementChild.textContent = minutes;
ui_second.firstElementChild.textContent = seconds;
}, 1000);
I'm confused on why whenever the page is loaded/refreshed the counter starts at 5 days when it should be somewhere around 4 days and ~10 hours.
I believe it has something to do with when I declare the variable
cdDate, because when I make it statically without using
.addDays it seems to work:
CODE
var cdDate = new Date(2020, 6, 5, 5, 55, 25, 552);
How can I fix this so I can use
.addDays and have the timer work properly?
Posted by: Christian J Feb 13 2020, 12:30 PM
QUOTE(hid @ Feb 13 2020, 03:59 PM)
I'm confused on why whenever the page is loaded/refreshed the counter starts at 5 days
I don't understand prototype syntax, but this part:
CODE
var cdDate = new Date().addDays(5);
appears to send 5 (for five days I assume?) as a function call argument. Would you rather have it send 4 days 10 hours?
Apparently "864E5" means https://stackoverflow.com/questions/18359401/javascript-date-gettime-code-snippet-with-mysterious-additional-characters/18359426#18359426, so
864E5*d becomes five full days worth of milliseconds.
QUOTE
when it should be somewhere around 4 days and ~10 hours.
Why?
(Keep in mind the javascript is reset everytime the page is loaded unless you e.g. set a cookie.)
Posted by: hid Feb 13 2020, 11:36 PM
QUOTE(Christian J @ Feb 13 2020, 12:30 PM)
QUOTE(hid @ Feb 13 2020, 03:59 PM)
I'm confused on why whenever the page is loaded/refreshed the counter starts at 5 days
I don't understand prototype syntax, but this part:
CODE
var cdDate = new Date().addDays(5);
appears to send 5 (for five days I assume?) as a function call argument. Would you rather have it send 4 days 10 hours?
Apparently "864E5" means https://stackoverflow.com/questions/18359401/javascript-date-gettime-code-snippet-with-mysterious-additional-characters/18359426#18359426, so
864E5*d becomes five full days worth of milliseconds.
QUOTE
when it should be somewhere around 4 days and ~10 hours.
Why?
(Keep in mind the javascript is reset everytime the page is loaded unless you e.g. set a cookie.)
Ok, I was going to respond with an example to try to explain what I wanted and just figured out why it wasn't working.
The
cdDate was being set to +5 days, but with the same hours as the day today and so the counter would always start at exactly 5 days instead of more around 4 days and ~19 hours since it is 04:00 in the morning already.
I fixed this by doing this:
CODE
var cdDate = new Date().addDays(5);
var cdDate = new Date(cdDate.getFullYear(), cdDate.getMonth(), cdDate.getDate(),
0, 0, 0, 0);
Thanks for your response and sorry I wansn't the best at explaining my issue.