Question

I’m working on a countdown timer for a site – it doesn’t actually have a purpose, it’s just there. So basically at midnight it starts at 24 hours, counts down the entire day, resets at midnight again. I have the timer working, the only problem is that I want to make sure it never says “0 HRS, 0 MIN” – It should stay on 1 MIN until it resets. I thought I found a way, but I’m not sure it’s working:

var date = new Date();
var month = date.getMonth();
var day = date.getDate();
var dayOfWeek = date.getDay();
var hours = {start: new Date(date.getFullYear(), month, day), end: new Date(date.getFullYear(), month, day)};


updateCountDown();
$(document).ready(function(){
    setInterval('updateCountDown()', 1000);
});

function updateCountDown(){
    var date = new Date();
    var hourDiff = 23 - date.getHours();
    var minDiff = 59 - date.getMinutes();


    $('span.hours').html(23-date.getHours());
    $('span.minutes').html(59 - date.getMinutes());

    if (hourDiff == 0 && minDiff == 0 ) {
     minDiff = 1;
    };
};

Is there a way to test this without waiting until midnight tonight to see what happens? I tried changing the new Date() inside the updateCountDown to new Date(‘2/5/13 4:30:00’) but it didn’t work.

Answer 1

You was updating the minDiff variable after showing it.

Try this:

var date = new Date();
var month = date.getMonth();
var day = date.getDate();
var dayOfWeek = date.getDay();
var hours = {start: new Date(date.getFullYear(), month, day), end: new Date(date.getFullYear(), month, day)};


updateCountDown();
$(document).ready(function(){
    setInterval(updateCountDown, 1000);
 });

function updateCountDown(){
    var date = new Date();
    var hourDiff = 23 - date.getHours();
    var minDiff = 59 - date.getMinutes();

    if (hourDiff == 0 && minDiff == 0 ) {
      minDiff = 1;
    };

    $('span.hours').html(hourDiff);
    $('span.minutes').html(minDiff);
};