JavaScript
*Must use code attached*
Enhance the Clock app’s stopwatch

 

In this exercise, you’ll enhance the stopwatch module from extra exercise 15-1 to calculate the elapsed hours, and you’ll change the Clock application to show the elapsed hours. The enhanced application looks like this: (Example.png)

 

1. Open the HTML and JavaScript files:

Notice that there’s a new library file named library_stopwatch_augment.js. In the HTML file, note that the script tag for this new library comes after the script tag for the stopwatch library. Also note that there’s a new span tag for the hours value of the stopwatch with a default value of “00”.

1. Change the library_stopwatch.js file so the module object has a read-only property that exposes the values of the private elapsed object. NOTE: Because elapsed is an object, if you return it directly, its properties can be changed even if the property that returns it is non-configurable. Thus, you’ll need to return an object that contains copies of the values in the elapsed object’s properties.
2. In the library_stopwatch_augment.js file, add code that augments the stopwatch module by adding a method named getElapsedTimeWithHours. Within this new method, get the object from the read-only property from step 2, add an hours property to it, calculate the number of elapsed hours, adjust the number of elapsed minutes, and return the adjusted object.
3. Change the code in the clock.js file so the displayTick callback function uses the getElapsedTimeWithHours function from step 3 to display the hours in the s_hours span tag. Be sure to reset this span tag in the resetStopwatch callback function.

Attachments:

• 1515154940-clock_augment.zip
• 1515154944-Example.png