basics

6 years ago · d46242a438
parent 36c695464b
commit d46242a438
2 changed files with 23 additions and 3 deletions
--- a/app.js
+++ b/app.js
@ -0,0 +1,20 @@
+let startTime;
+let windowInterval;
+
+const displayTime = () => {
+    // console.log(Date.now()-startTime);
+    document.querySelector('h1').innerHTML = Math.floor((Date.now()-startTime)/1000);
+}
+
+document.querySelector('.btn-primary').addEventListener('click', (event) => {
+    startTime=Date.now();
+    windowInterval = window.setInterval(displayTime,1000)
+})
+
+document.querySelector('.btn-secondary').addEventListener('click', (event) => {
+    window.clearInterval(windowInterval)
+})
+
+window.onbeforeunload = function(){
+    return 'Good bye'
+}
--- a/index.html
+++ b/index.html
@ -7,14 +7,14 @@

        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
-
-        <title>Hello, world!</title>
+        <title>Practice Timer</title>
    </head>
    <body>
        <main class="container-fluid">
-            <h1>Hello, world!</h1>
            <button type="button" class="btn btn-primary">Start</button>
            <button type="button" class="btn btn-secondary">Stop</button>
+            <h1></h1>
        </main>
+        <script src="app.js" charset="utf-8"></script>
  </body>
 </html>