Question
MY PROBLEM IS MILLISECONS INCREASING ONLY WHEN I CLICK START Digital clock with stopwatch Clock use strict; var $ = function(id) { return document.getElementById(id); };
MY PROBLEM IS MILLISECONS INCREASING ONLY WHEN I CLICK START
Digital clock with stopwatch\
"use strict";
var $ = function(id) { return document.getElementById(id); };
var evt = {
attach: function(node, eventName, func) {
document.getElementById(node).addEventListener(eventName, func);
},
detach: function(node, eventName, func) {
document.getElementById(node).removeEventListener(eventName, func);
},
preventDefault: function(e) {
if(typeof e !== 'undefined'){
evt.preventDefault();
}
}
};
//global stop watch timer variable and elapsed time object
var stopwatchTimer;
var elapsed = {minutes: 0, seconds: 0, milliseconds: 0};
var displayCurrentTime = function() {
var now = new Date();
var hours = now.getHours();
var ampm = "AM"; // set default value
// correct hours and AM/PM value for display
if (hours > 12) { // convert from military time
hours = hours - 12;
ampm = "PM";
} else { // adjust 12 noon and 12 midnight
switch (hours) {
case 12: // noon
ampm = "PM";
break;
case 0: // midnight
hours = 12;
ampm = "AM";
}
}
$("hours").firstChild.nodeValue = hours;
$("minutes").firstChild.nodeValue = padSingleDigit(now.getMinutes());
$("seconds").firstChild.nodeValue = padSingleDigit(now.getSeconds());
$("ampm").firstChild.nodeValue = ampm;
};
var padSingleDigit = function(num) {
if (num < 10) { return "0" + num; }
else { return num; }
};
var tickStopwatch = function() {
// increment milliseconds by 10 milliseconds
elapsed.milliseconds+=10;
// if milliseconds total 1000, increment seconds by one and reset milliseconds to zero
if(elapsed.milliseconds==1000){
elapsed.seconds+=1;
elapsed.milliseconds=0;
}
// if seconds total 60, increment minutes by one and reset seconds to zero
if(elapsed.seconds==60){
elapsed.minutes+=1;
elapsed.seconds=0;
}
//display new stopwatch time
$("s_minutes").firstChild.nodeValue = elapsed.minutes;
$("s_seconds").firstChild.nodeValue =elapsed.seconds;
$("s_ms").firstChild.nodeValue =elapsed.milliseconds;
};
// event handler functions
var startStopwatch = function(e) {
// prevent default action of link
evt.preventDefault(e);
// do first tick of stop watch and then set interval timer to tick
tickStopwatch();
// stop watch every 10 milliseconds. Store timer object in stopwatchTimer
stopwatchTimer=setInterval(stopStopwatch, 10);
// variable so next two functions can stop timer.
};
var stopStopwatch = function(e) {
// prevent default action of link
evt.preventDefault(e);
// stop timer
clearInterval(stopwatchTimer);
};
var resetStopwatch = function(e) {
// prevent default action of link
evt.preventDefault(e);
// stop timer
clearInterval(stopwatchTimer);
// clear elapsed object and reset stopwatch display
elapsed.minutes=0;
elapsed.seconds=0;
elapsed.milliseconds=0;
$("s_minutes").firstChild.nodeValue = elapsed.minutes;
$("s_seconds").firstChild.nodeValue =elapsed.seconds;
$("s_ms").firstChild.nodeValue =elapsed.milliseconds;
};
window.onload = function() {
// set initial clock display and then set interval timer to display
// new time every second. Don't store timer object because it
// won't be needed - clock will just run.
displayCurrentTime();
setInterval(displayCurrentTime, 1000);
// set up stopwatch event handlers
$("start").onclick = function() { startStopwatch(evt);};
$("stop").onclick = function() { stopStopwatch(evt);};
$("reset").onclick = function() { resetStopwatch(evt);};
};
Digital clock with stopwatch
Clock : : Stop Watch Start Stop Reset 00: 00: 000
Step by Step Solution
There are 3 Steps involved in it
Step: 1
Get Instant Access to Expert-Tailored Solutions
See step-by-step solutions with expert insights and AI powered tools for academic success
Step: 2
Step: 3
Ace Your Homework with AI
Get the answers you need in no time with our AI-driven, step-by-step assistance
Get Started