From d4c23dcf375aaa02512a4ab7273657e2a6553315 Mon Sep 17 00:00:00 2001
From: Petr Glivicky <petrglivicky@gmail.com>
Date: Fri, 4 Dec 2020 20:40:01 +0100
Subject: [PATCH 1/2] Fix bug: Clock can't be stopped when 'Start' clicked
 while running

---
 .../10-clock-setinterval/solution.md                  | 11 +++++++----
 .../10-clock-setinterval/solution.view/index.html     |  7 ++++++-
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md b/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md
index 15238fcf..55debebf 100644
--- a/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md
+++ b/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md
@@ -39,15 +39,18 @@ The clock-managing functions:
 ```js
 let timerId;
 
-function clockStart() { // run the clock
-  timerId = setInterval(update, 1000);
+function clockStart() { // run the clock  
+  if (!timerId) { // only set a new interval if the clock is not running
+    timerId = setInterval(update, 1000);
+  }
   update(); // (*)
-}
 
 function clockStop() {
   clearInterval(timerId);
-  timerId = null;
+  timerId = null; // (**)
 }
 ```
 
 Please note that the call to `update()` is not only scheduled in `clockStart()`, but immediately run in the line `(*)`. Otherwise the visitor would have to wait till the first execution of `setInterval`. And the clock would be empty till then.
+
+Also it is important to set a new interval in `clockStart()` only when the clock is not running. Otherways clicking the start button several times would set multiple concurrent intervals. Even worse - we would only keep the `timerID` of the last interval, losing references to all others. Then we wouldn't be able to stop the clock ever again! Note that we need to clear the `timerID` when the clock is stopped in the line `(**)`, so that it can be started again by running `clockStart()`.
diff --git a/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.view/index.html b/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.view/index.html
index 1bf642b1..de8ec9ae 100644
--- a/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.view/index.html
+++ b/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.view/index.html
@@ -43,12 +43,17 @@
     }
 
     function clockStart() {
-      timerId = setInterval(update, 1000);
+      // set a new interval only if the clock is stopped
+      // otherwise we would rewrite the timerID reference to the running interval and wouldn't be able to stop the clock ever again
+      if (!timerId) { 
+        timerId = setInterval(update, 1000);
+      }
       update(); // <--  start right now, don't wait 1 second till the first setInterval works
     }
 
     function clockStop() {
       clearInterval(timerId);
+      timerId = null; // <-- clear timerID to indicate that the clock has been stopped, so that it is possible to start it again in clockStart()
     }
 
     clockStart();

From 6118cc08785ac568abc1c0745e384448b0b91306 Mon Sep 17 00:00:00 2001
From: Petr Glivicky <petrglivicky@gmail.com>
Date: Fri, 4 Dec 2020 21:13:51 +0100
Subject: [PATCH 2/2] Add a missing bracket in the solution description

---
 .../07-modifying-document/10-clock-setinterval/solution.md       | 1 +
 1 file changed, 1 insertion(+)

diff --git a/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md b/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md
index 55debebf..1414e90c 100644
--- a/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md
+++ b/2-ui/1-document/07-modifying-document/10-clock-setinterval/solution.md
@@ -44,6 +44,7 @@ function clockStart() { // run the clock
     timerId = setInterval(update, 1000);
   }
   update(); // (*)
+}
 
 function clockStop() {
   clearInterval(timerId);