We Keep Coding

Vuejs and laravel calculate hours and minutes

I have data in json from laravel backend which looks like: "03:30:00", "01:45:00", "00:15:00"
Is there an easy way to count them together in vuejs so its looks like this: "05:30:00"

So this is simple javascript.
If the time string is always going to look the same, you can do:
let times = ["03:30:00", "01:45:00", "00:15:00"]; // you can have an unlimited number of time strings
let hours = 0;
let minutes = 0;
let seconds = 0;
for (const i in times) {
const time = times[i];
let splitTime = (time + "").split(":"); // make sure it's a string
seconds += parseInt(splitTime[2]);
if(seconds > 59){ // make sure it only goes until 59
minutes++;
seconds = seconds % 60;
}
minutes += parseInt(splitTime[1]);
if(minutes > 59){ // make sure it only goes until 59
hours++;
minutes = minutes % 60;
}
hours += parseInt(splitTime[0]);
}
let totalTime = (hours < 10 ? "0" + hours : hours) + ":"
+ (minutes < 10 ? "0" + minutes : minutes) + ":"
+ (seconds < 10 ? "0" + seconds : seconds); // put the left side zeros

output time in hh:mm:ss format relative to how many seconds

I have created a function within JavaScript which converts seconds to the format hh:mm:ss. It works fine at the moment, however, I'd like it to be a little bit more refined than it currently is.
This is what I have at the moment:
convertTime(secs){
var sec = parseInt(secs, 10),
hours = Math.floor(sec / 3600),
minutes = Math.floor((sec - (hours * 3600)) / 60),
seconds = sec - (hours * 3600) - (minutes * 60);
if(hours < 10){ hours = "0" + hours; }
if(minutes < 10){ minutes = "0" + minutes; }
if(seconds < 10){ seconds = "0" + seconds; }
return hours + ":" + minutes + ":" + seconds;
}
// this will output 00:02:03
convertTime(123);
However, I would prefer the returned outputs to be something along the lines of this instead:
11 -> 0:11
60 -> 1:00
1200 -> 20:00
3600 -> 1:00:00
36000 -> 10:00:00
I have made countless attempts at creating (and finding) a function which can do something similar, but all JavaScript conversions I've come across (and / or made) are always done in the format hh:mm:ss, or are just output incorrectly.
All help is really appreciated,
Cheers.

Just change your return statement to
return parseInt( hours ) > 0 ? ( hours + ":" + minutes + ":" + seconds ) : ( minutes + ":" + seconds ) ;
Simply don't return hours if hours is not greater than 0
In case, your minutes need to be trimmed if there are no hours then update your padding logic to
if(hours > 0 && minutes < 10){ minutes = "0" + minutes; }

A more compact version of #gurvinder372 response
return (parseInt(hours) > 0 ? hours + ":" : "") + minutes + ":" + seconds;

JavaScript timer to count down from a certain time for a number of hours

I have created a countdown timer. The problem is, I am wanting it to count down from midnight clock 00:00:00 until clock 17:00:00.
I have made the timer count down starting at 17 hours 00 minutes 00 seconds and it works a treat, but I need a way to take off the time from 00:00:00 to present from the 17 hours.
Here is my JS code
function startTimer(duration, display) {
var start = Date.now(),
diff,
hours,
minutes,
seconds;
function timer() {
// get the number of seconds that have elapsed since
// startTimer() was called
diff = duration - (((Date.now() - start) / 1000) | 0);
// Setting and displaying hours, minutes, seconds
hours = (diff / 360) | 0;
minutes = (diff / 60) | 0;
seconds = (diff % 60) | 0;
hours = hours < 10 ? "0" + hours : hours;
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
display.textContent = hours + ":" + minutes + ":" + seconds;
if (diff <= 0) {
// add one second so that the count down starts at the full duration
// example 17:00:00 not 16:59:59
start = Date.now() + 1000;
}
};
// don't want to wait a full second before the timer starts
timer();
setInterval(timer, 1000);
}
window.onload = function () {
var timeLeft = 3600 * 17,
display = document.querySelector('#time');
startTimer(timeLeft, display);
};
Here is my HTML code:
<div>Order by: <span id="time"></span> for Next Day Delivery.</div>
My thoughts were to get the timeLeft = 3600 * 17 and take off the diff.

Here is your corrected code : it was easier to save the timestamp of 17h of the current day (next day if we are after 17h) and compare it to the current timestamp. And to calculate the number of hours left, you have to divide the number of seconds by 3600 (60*60) and not 360
function startTimer(display) {
var date = new Date();
var h17 = new Date(date.getFullYear(), date.getMonth(), date.getDate(), 17);
if(date.getHours() >= 17) {
h17.setDate(h17.getDate()+1);
}
h17 = h17.getTime();
var diff,
hours,
minutes,
seconds;
function timer() {
diff = (((h17 - Date.now()) / 1000) | 0);
// Setting and displaying hours, minutes, seconds
hours = (diff / 3600) | 0;
minutes = ((diff % 3600) / 60) | 0;
seconds = (diff % 60) | 0;
hours = hours < 10 ? "0" + hours : hours;
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
display.textContent = hours + ":" + minutes + ":" + seconds;
};
timer();
setInterval(timer, 1000);
}
window.onload = function () {
var timeLeft = 3600 * 17,
display = document.querySelector('#time');
startTimer(display);
};
<div>Order by: <span id="time"></span> for Next Day Delivery.</div>
jsFiddle
PS : I didn't test if the function work correctly after 17h but it should

Unable to convert seconds to HH:MM:SS

While trying to convert seconds into HH:MM:SS seconds format, I am getting the incorrect result. For example, if take value of seconds be 289 the minutes come out as 0. What could be the reason for this
var seconds = this.currentTime;
var hours = Math.floor(seconds/3600); // Get whole hours
seconds -= hours*3600;
var minutes = Math.floor(seconds/3600); // Get remaining minutes
console.log("minutes : " + minutes);
seconds -= minutes*60;
var timeNow = hours + ":" + (minutes<10 ? '0'+minutes : minutes) + ":" + (seconds<10 ? '0'+seconds : seconds);

To calculate minutes, you should divide seconds by 60, not 3600 (there are 60 seconds in a minute after all):
var minutes = Math.floor(seconds/60); // Get remaining minutes
You could also use the Date object in JavaScript to do most of this for you:
var date = new Date(0, 0, 0, 0, 0, 289, 0);
var minutes = date.getMinutes();
// etc.

var timeInSec = this.currentTime;
var hours = Math.floor(timeInSec / 3600) % 24; // Get whole hours
var minutes = Math.floor(timeInSec / 60) % 60; // Get remaining minutes
var seconds = timeInSec % 60; // Get remaining seconds
var timeNow = (hours < 10 ? "0" + hours : hours) + "-" + (minutes < 10 ? "0" + minutes : minutes) + "-" + (seconds < 10 ? "0" + seconds : seconds);

Error in conversion code for minutes to days

Found this lovely piece of code on this site and it worked like a charm until it got over 10,000 minutes
function minToTime(duration) { /*Call function 2 */
var minutes = parseInt(duration%60)
, hours = parseInt((duration/(60))%24)
, days = parseInt((duration/(60*24))%7);
days = (days < 10) ? "0" + days : days;
hours = (hours < 10) ? "0" + hours : hours;
minutes = (minutes < 10) ? "0" + minutes : minutes;
return days + ":" + hours + ":" + minutes;
}
Can anyone help me find a way to solve this problem? Please bear in mind I am new to javascript and have very basic knowledge.
Thank you in advance

I don't think you need to do the %7 to get the number of days. It might only be beneficial if you further want to aggregate days into weeks. So 13 days would become 1 week and 6 days.
But I don't think you need that, so the following code change should suffice:
var minutes = parseInt(duration%60)
, hours = parseInt((duration/(60))%24)
, days = parseInt((duration/(60*24)); //Don't need the %7 here
I have put together a Jsfiddle to explain the same.

you can use like this COnvertmintoday(minutes);
function COnvertmintoday(newMinutes) {
minutes_day = 24 * 60
minutes = newMinutes;
days = Math.floor(minutes / minutes_day )
return days
}

There is a %7 lurking around in the calculation of days, which must have been added number of weeks.
Remove that and the code should work fine, or calculate number of weeks too:
function minToTime(duration) { /*Call function 2 */
var minutes = parseInt(duration%60)
, hours = parseInt((duration/(60))%24)
, days = parseInt(duration/(60*24)); //remove %7
days = (days < 10) ? "0" + days : days;
hours = (hours < 10) ? "0" + hours : hours;
minutes = (minutes < 10) ? "0" + minutes : minutes;
return days + ":" + hours + ":" + minutes;
}
Alternatively you can use it to get number of weeks:
function minToTime(duration) { /*Call function 2 */
var minutes = parseInt(duration%60)
, hours = parseInt((duration/(60))%24)
, days = parseInt(duration/(60*24)%7)
, weeks = parseInt(duration/(60*24*7));
days = (days < 10) ? "0" + days : days;
hours = (hours < 10) ? "0" + hours : hours;
minutes = (minutes < 10) ? "0" + minutes : minutes;
weeks = (weeks < 10) ? "0" + weeks : weeks;
return weeks + ":" + days + ":" + hours + ":" + minutes;
}