ga-wdi-exercises · mconnors333 · Nov 29, 2016
diff --git a/index.html b/index.html
@@ -5,6 +5,7 @@
   <link rel="stylesheet" href="style.css">
   <title>i &hearts; js</title>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
+  <script src="timers.js"></script>
 </head>
 <body>
 
@@ -14,7 +15,5 @@ <h1 id="timer">Stop Watch</h1>
     <button id="start">Start</button>
     <button id="pause">Pause</button>
   </div>
-
 </body>
-<script src="timers.js"></script>
 </html>
diff --git a/style.css b/style.css
@@ -12,7 +12,7 @@ h1 {
 }
 
 button {
-  background: #4479BA;
+  background: lightgreen;
   color: #FFF;
   font-family: Josefin Slab;
   font-size: 50px;
@@ -27,4 +27,3 @@ button {
 button:hover{
     background: #356094;
 }
-
diff --git a/timers.js b/timers.js
@@ -1,4 +1,45 @@
+window.onload = function() {
 
+let timeElapsed = 1;
+let timeElapsedDisplay = document.createElement('span');
+let startButton = document.getElementById("start");
+let resetButton = document.getElementById("reset");
+let pauseButton = document.getElementById("pause");
+let timerText = document.getElementById("timer");
+let isStarted = false;
 
+//* When "Start" is clicked, the text "Stop Watch" should be replaced by
+// "Time elapsed: 0", and the count should increment every second.
+let startTimer = () => {
+    if(!isStarted){
+            intervalID = window.setInterval(function(){
+            console.log(timeElapsed);
+            timerText.innerHTML = "Time elapsed: " + timeElapsed;
+            timeElapsed++;
+            isStarted = true;
+        }, 1000);
+    }
+};
 
+startButton.addEventListener("click", startTimer);
 
+//* When "Reset" is clicked, the text should return to "Stop Watch"
+let resetTimer = () => {
+    window.clearInterval(intervalID);
+    timerText.innerHTML = "Stop Watch";
+    timeElapsed = 1;
+    isStarted = false;
+};
+
+resetButton.addEventListener("click", resetTimer);
+
+
+//* When "Pause" is clicked, the text should say "Time elapsed: 1",
+//but stop incrementing.
+    let pauseTimer = () => {
+        window.clearInterval(intervalID);
+    };
+
+pauseButton.addEventListener("click", pauseTimer);
+
+};