Stopwatch

Example

Basic Features

Step 1: From the Cloud9 dashboard: Create a new workspace
Fill in the following text boxes on the form:
→ Workspace name: stopwatch Copy
→ Clone from Git or Mercurial URL: https://github.com/studentmrcode/stopwatch.git Copy
Click Create workspace button
Open index.html and click Run

Step 2: Make a button to start the stopwatch.
Hint: If you're having trouble, rewatch the timing events video. The video shows an example. Do NOT copy it exactly.

Step 3: Make a Boolean variable to store whether the stopwatch is running or not. Put the following variable with your other variables:
var running = false;
After starting the stopwatch, update the running variable:
running = true;
Step 4: When the button is clicked again, pause the stopwatch. Use an if...else statment:
if (running) {
    // the stopwatch is running, so pause the stopwatch
}
else {
    // the stopwatch is not running, so start the stopwatch
}
When you start a timer, a timer ID is returned. With your other variables, make a variable for the timer ID, and initialize it to null, indicating that is starts with no value:
var timerId = null;
Where you start the timer, save the timer ID to that variable:
timerId = setInterval(someFunction, someMilliseconds);
Where you want to stop the timer, use the clearInterval method with the timer ID:
clearInterval(timerId);

Step 5: Make a reset button. The button should stop the timer if it's running.

Debugging help

Last topic Next topic