From 470c27486cf3c9ecc4d3c45522f893c14bbbceaf Mon Sep 17 00:00:00 2001 From: mwb86 Date: Sun, 27 Nov 2016 19:01:01 -0500 Subject: [PATCH 1/2] basic timer --- timers.js | 43 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 43 insertions(+) diff --git a/timers.js b/timers.js index fd40910..086d040 100644 --- a/timers.js +++ b/timers.js @@ -1,4 +1,47 @@ +/* +1. Create Javascript selectors that target each of the timer buttons. +2. Create click handlers (empty, for now) for each of the timer buttons. +3. Instantiate `seconds` and `timerId` variables for your timer. The latter will make more sense after reading up on `setInterval()`. +4. Create an `updateTime()` function that increments the `seconds` counter and inserts that value into the `

` element with `id="timer"`. +5. Inside your click handler for the start button... + - Replace "Stop Watch" in the HTML with the content of the `seconds` variable. + - Use `setInterval()` to increment the timer by 1 every second. +6. Inside your click handler for the pause button... + - Stop -- but do not reset! -- the timer using `clearInterval()`. +7. Once again, inside your click handler for the start button... + - Make sure the timer starts back up when you hit the "Start" button after hitting "Pause". +8. Inside your click handler for the reset button... + - Stop the timer using `clearInterval()`. + - Reset the timer. + - Replace the time in your HTML with the original "Stop Watch" text. +*/ +let start = $('#start'); +let pause = $('#pause'); +let reset = $('#reset'); +$(reset).on("click"); +let timerId = $('#timer'); +let seconds = 0; +let updateTime = function(){ + const addSecond = function() { + seconds = seconds + 1; + $('#timer').html(seconds); + } + interval = setInterval(addSecond, 1000); +}; +$(start).on("click", updateTime); + +let stopTime = function(){ + clearInterval(interval); +}; +$(pause).on("click", stopTime); + +let resetTime = function(){ + clearInterval(interval); + seconds = 0; + $('#timer').html("Stop Watch"); +}; +$(reset).on("click", resetTime); From 840789467832a2528329f770395ea7e14b789a72 Mon Sep 17 00:00:00 2001 From: mwb86 Date: Tue, 29 Nov 2016 09:16:55 -0500 Subject: [PATCH 2/2] removed useless code --- timers.js | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) diff --git a/timers.js b/timers.js index 086d040..c5cf5ac 100644 --- a/timers.js +++ b/timers.js @@ -16,32 +16,28 @@ - Replace the time in your HTML with the original "Stop Watch" text. */ -let start = $('#start'); -let pause = $('#pause'); -let reset = $('#reset'); - -$(reset).on("click"); -let timerId = $('#timer'); let seconds = 0; let updateTime = function(){ - const addSecond = function() { seconds = seconds + 1; $('#timer').html(seconds); } interval = setInterval(addSecond, 1000); }; -$(start).on("click", updateTime); + +$('#start').on("click", updateTime); let stopTime = function(){ clearInterval(interval); }; -$(pause).on("click", stopTime); + +$('#pause').on("click", stopTime); let resetTime = function(){ clearInterval(interval); seconds = 0; $('#timer').html("Stop Watch"); }; -$(reset).on("click", resetTime); + +$('#reset').on("click", resetTime);