Time Left until Next 5 Minutes - Javascript

Question

I'm trying to display the remaining time over the next 5 minutes (tied to the full 5 minutes of the current time, for example, 15:05, 15:10 ..)

I was able to achieve the same time left for the next hour (not minutes):

<span class="timer"></span> <script> function secondPassed() { var cur_date = new Date(); var hour = cur_date.getHours(); var minutes = cur_date.getMinutes(); var seconds = cur_date.getSeconds(); var minutes_remain = parseInt(59 - parseInt(minutes)); var seconds_remain = parseInt(60 - parseInt(seconds)); var timers = document.getElementsByClassName('timer'); for (var i = 0; i < timers.length; i++) { timers[i].innerHTML = minutes_remain+":"+seconds_remain; } } var countdownTimer = setInterval(secondPassed, 1000); </script> 

JSfiddle: http://jsfiddle.net/ov0oo5f7/

Answer 1

Something like that?

 function secondPassed() { var cur_date = new Date(); var minutes = cur_date.getMinutes(); var seconds = cur_date.getSeconds(); var timers = document.getElementsByClassName('timer'); for (var i = 0; i < timers.length; i++) { timers[i].innerHTML = (4 - minutes % 5) + ":" + (seconds >= 50 ? "0" : "") + (59 - seconds); } } var countdownTimer = setInterval(secondPassed, 1000); 

 <span class="timer"></span> 

Answer 2

You can slightly reduce the code and make it more accurate, use setTimeout and call the function as close as possible to the next full second. setInterval will drift slowly.

 // Return the time to next 5 minutes as m:ss function toNext5Min() { // Get the current time var secs = (new Date() / 1000 | 0) % 300; // Function to add leading zero to single digit numbers function z(n){return (n < 10? '0' : '') + n;} // Return m:ss return (5 - secs/60 | 0) + ':' + z(60 - (secs%60 || 60)); } // Call the function just after the next full second function runTimer() { console.log(toNext5Min()); var now = new Date(); setTimeout(runTimer, 1020 - now % 1000); } 

The above is ticking in full minute, so say, 10:00:00, it shows 5:00. If you prefer to show 0:00, then the last line toNext5Min should be:

  return (5 - (secs? secs/60 : 5) | 0) + ':' + z(60 - (secs%60 || 60)); 

Answer 3

This is what you need to change to make it work the way you want:

 var minutes = cur_date.getMinutes(); var seconds = cur_date.getSeconds(); 

try changing it to this:

 var minutes_remain = 5 - minutes%5 - 1; var seconds_remain = 59 - seconds; 

Try it here: jsFiddle

Answer 4

Changing the minutes remains on the next line. It calculates the current minute mod by 5, subtracted from 5, what you need.

 function secondPassed() { var cur_date = new Date(); var hour = cur_date.getHours(); var minutes = cur_date.getMinutes(); var seconds = cur_date.getSeconds(); var minutes_remain = parseInt(5 - parseInt(minutes%5)); var seconds_remain = parseInt(60 - parseInt(seconds)); var timers = document.getElementsByClassName('timer'); for (var i = 0; i < timers.length; i++) { timers[i].innerHTML = minutes_remain+":"+seconds_remain; } } var countdownTimer = setInterval(secondPassed, 1000); 

Updated fiddle http://jsfiddle.net/ov0oo5f7/2/

Answer 5

You can determine what the next 5-minute interval will be if you divide it by 5, round it and multiply by 5 again.

You need to process if you are at the exact minute, otherwise minutes_remain will display 1 minute less.

As for accuracy, you do not need parseInt everywhere since they are already all numbers. I tried to make it as efficient as possible. In any case, you only check it once per second, so you cannot guarantee accuracy.

http://jsfiddle.net/ov0oo5f7/6/

 function secondPassed() { var cur_date = new Date(); var hour = cur_date.getHours(); // handle 0 seconds - would be 60 otherwise var seconds_remain = 60 - (cur_date.getSeconds() || 60); // handle ceil on 0 seconds - otherwise out by a minute var minutes = cur_date.getMinutes() + (seconds_remain == 0 ? 0 : 1); var minutes_remain = Math.ceil(minutes/5) * 5 - minutes; var timers = document.getElementsByClassName('timer'); for (var i = 0; i < timers.length; i++) { timers[i].innerHTML = minutes_remain+":"+seconds_remain; } } var countdownTimer = setInterval(secondPassed, 1000); 

Answer 6

If you are looking for time for mechine and consider it within 5 minutes, this may help -

 var startTime = new Date(); function secondPassed() { var cur_date = new Date(); if(parseInt((cur_date - startTime)/1000) >300 ){ window.clearInterval(countdownTimer); } var hour = cur_date.getHours(); var minutes = cur_date.getMinutes(); var seconds = cur_date.getSeconds(); var minutes_remain = parseInt(59 - parseInt(minutes)); var seconds_remain = parseInt(60 - parseInt(seconds)); var timers = document.getElementsByClassName('timer'); for (var i = 0; i < timers.length; i++) { timers[i].innerHTML = minutes_remain+":"+seconds_remain; } } var countdownTimer = setInterval(secondPassed, 1000); 

Answer 7

A simple approach is nothing that 5 minutes 5 * 60 * 1000 milliseconds, so

 var k = 5*60*1000; var next5 = new Date(Math.ceil((new Date).getTime()/k)*k);