Modifying Countdown Script to repeat each week for a specific day and time

Question

I was browsing around at different ideas for a countdown script. I like how this one works because you can enter an exact date instead of having to deal with subtracting 1 for numeric dates because they start on 0.

function cdtd() {
    var xmas = new Date(" 00:01:00");
    var now = new Date();
    var timeDiff = xmas.getTime() - now.getTime();
    if (timeDiff <= 0) {
                clearTimeout(timer);
        document.write("Christmas is here!");
        // Run any code needed for countdown completion here
        }
    var seconds = Math.floor(timeDiff / 1000);
    var minutes = Math.floor(seconds / 60);
    var hours = Math.floor(minutes / 60);
    var days = Math.floor(hours / 24);
    hours %= 24;
        minutes %= 60;
        seconds %= 60;
    document.getElementById("daysBox").innerHTML = days;
    document.getElementById("hoursBox").innerHTML = hours;
    document.getElementById("minsBox").innerHTML = minutes;
    document.getElementById("secsBox").innerHTML = seconds;
    var timer = setTimeout('cdtd()',1000);
}

HTML

Days Remaining:
<div id="daysBox"></div>
Hours Remaining:
<div id="hoursBox"></div>
Minutes Remaining:
<div id="minsBox"></div>
Seconds Remaining:
<div id="secsBox"></div>

Runs Function

<script type="text/javascript">cdtd();</script>

I need it to be in a function like this one; however, I've got a project now that requires the countdown to repeat weekly to detect a specific day of week and time.

So, for instance:

Sunday 10:00am

It needs to countdown until it reaches to that point. And after Sunday at 10:00am, it needs to start over and countdown til the next Sunday at 10:00am.

How can I make this happen. Again, I like the overall structure of how the example countdown works; however, I'm open to suggestions on what others think if you have a better scripted countdown timer.

Thanks!

Answer 1

Something like this would work:

However, I would try and replace the var now with server time (via PHP), so you can be sure all user are seeing the same count down.

 function plural(s, i) {
      return i + ' ' + (i > 1 ? s + 's' : s);
    }

function sundayDelta(offset) {
  // offset is in hours, so convert to miliseconds
  offset = offset ? offset * 60 * 60 * 1000 : 0;
  var now = new Date(new Date().getTime() + offset);
  var days = 7 - now.getDay() || 7;
  var hours = 24 - now.getHours();
  var minutes = 60 - now.getMinutes();
  var seconds = 60 - now.getSeconds();
  return [plural('day', days),
          plural('hour', hours),
          plural('minute', minutes), 
          plural('second', seconds)].join(' ');
}

// Save reference to the DIV
$refresh = $('#refresh');

$refresh.text('This page will refresh in ' + sundayDelta());

// Update DIV contents every second
setInterval(function() {
  $refresh.text('This page will refresh in ' + sundayDelta());
}, 1000);