So I have this code for a daily timer set to countdown to 3pm PST everyday.
function makeTimer() {
// var endTime = new Date("29 April 2018 9:56:00 GMT+08:00");
var endTime = new Date(today + " 15:00:00");
endTime = (Date.parse(endTime) / 1000);
var now = new Date();
now = (Date.parse(now) / 1000);
var timeLeft = endTime - now;
var days = Math.floor(timeLeft / 86400);
var hours = Math.floor((timeLeft - (days * 86400)) / 3600);
var minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600 )) / 60);
var seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));
if (hours < "10") { hours = "" + hours; }
if (minutes < "10") { minutes = "" + minutes; }
if (seconds < "10") { seconds = "" + seconds; }
$("#days").html(days + " <span>Days</span>");
$("#hours").html(hours + " <span>Hours</span>");
$("#minutes").html(minutes + " <span>Minutes</span>");
$("#seconds").html(seconds + " <span>Seconds</span>");
}
setInterval(function() { makeTimer(); }, 1000);
// End
I need to be able to give it a different target time for Saturday and Sunday, each days need to be different.
Saturday Timer end is 1:00PM PST
Sunday Timer end is 12:00PM PST
How can I achieve this with the script above. Any help is appreciated.
Consider the following.
$(function() {
function updateTimer(timeLeft) {
var days = Math.floor(timeLeft / 86400);
var hours = Math.floor((timeLeft - (days * 86400)) / 3600);
var minutes = Math.floor((timeLeft - (days * 86400) - (hours * 3600)) / 60);
var seconds = Math.floor((timeLeft - (days * 86400) - (hours * 3600) - (minutes * 60)));
if (hours < "10") {
hours = "0" + hours;
}
if (minutes < "10") {
minutes = "0" + minutes;
}
if (seconds < "10") {
seconds = "0" + seconds;
}
$("#days").html(days);
$("#hours").html(hours);
$("#minutes").html(minutes);
$("#seconds").html(seconds);
}
function makeTimer() {
var endTime = new Date();
switch (endTime.getDay()) {
case 0:
if (endTime.getHours() >= 12) {
endTime.setDate(endTime.getDate() + 1);
}
endTime.setHours(12, 0, 0);
break;
case 6:
if (endTime.getHours() >= 13) {
endTime.setDate(endTime.getDate() + 1);
}
endTime.setHours(13, 0, 0);
break;
default:
if (endTime.getHours() >= 15) {
endTime.setDate(endTime.getDate() + 1);
}
endTime.setHours(15, 0, 0);
}
var now = Date.now();
return Math.floor((endTime - now) / 1000);
}
$(".timer").data("interval", setInterval(function() {
var tl = makeTimer();
console.log(tl);
if (tl <= 0) {
clearInterval($(".timer").data("interval"));
} else {
updateTimer(tl);
}
}, 1000))
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="timer">
<span id="days"></span> Days <span id="hours"></span> Hours <span id="minutes"></span> Minutes <span id="seconds"></span> Seconds
</div>Best practice is to break things down into small easily repeatable steps or functions. With the number of Seconds left, we can update and display the timer. That just leaves the step of calculating the seconds left between now and a specific time.
When I check the day, if it's Saturday (6) or Sunday (0), we have unique times. The default is then set if it's not.