JSFiddle - React, Tailwind, and code Playground
HTML
<form>
<span class="timer-title"><strong>Activity timer</strong></span>h: <input id="hours" readonly="readonly" size="2" type="text" /> m: <input id="minutes" readonly="readonly" size="2" type="text" /> s: <input id="seconds" readonly="readonly" size="2" type="text" /><span class="timer-buttons"><input onclick="doTimer()" type="button" value="Start" /> <input onclick="stopCount()" type="button" value="Stop" /> <input onclick="resetCount()" type="button" value="Reset" /> </span></form>
JavaScript
var sec=00;
var min=00;
var hr=00;
var t;
var timer_is_on=0;
function timedCount()
{
if (min==0) {
min=1;
}
document.getElementById('seconds').value=sec;
document.getElementById('minutes').value=min;
$('.node-form .form-item:nth-child(4) input').val(min);
document.getElementById('hours').value=hr;
$('.node-form .form-item:nth-child(3) input').val(hr);
sec=sec+1;
if (sec==60)
{
sec=0;
min=min+1;
if (min==60)
{
min=1;
hr=hr+1;
}
}
t=setTimeout("timedCount()",1000);
}
function doTimer()
{
if (!timer_is_on)
{
timer_is_on=1;
timedCount();
}
}
function stopCount()
{
clearTimeout(t);
timer_is_on=0;
}
function resetCount()
{
stopCount();
sec=0;
min=0;
hr=0;
document.getElementById('hours').value=00;
$('.node-form .form-item:nth-child(3) input').val('0');
document.getElementById('minutes').value=00;
$('.node-form .form-item:nth-child(4) input').val('0');
document.getElementById('seconds').value=00;
}
function putInTimelog()
{
// Put hours
var hourItems=[];
var hourFields=document.getElementById("node-form").getElementsByTagName("input");
for (var i=0; i<hourFields.length; i++) {
//omitting undefined null check for brevity
if (hourFields[i].id.lastIndexOf("edit-field-timelog-hours-0-value-", 0) === 0) {
hourItems.push(hourFields[i]);
}
}
var hourField='edit-field-timelog-hours-0-value-';
hourField=hourField.concat(hourItems.length);
document.getElementById(hourField).value=hr;
// Put minutes
var minuteItems=[];
var hourFields=document.getElementById("node-form").getElementsByTagName("input");
for (var i=0; i<hourFields.length; i++) {
//omitting undefined null check for brevity
if (hourFields[i].id.lastIndexOf("edit-field-timelog-minutes-0-value-", 0) === 0) {
minuteItems.push(hourFields[i]);
}
}
var minuteField='edit-field-timelog-minutes-0-value-';
minuteField=minuteField.concat(minuteItems.length);
...