title: How to stop timer after reaching zero?
body: <p>In this <a href="http://jsfiddle.net/kuox9ax2/" rel="nofollow noreferrer">http://jsfiddle.net/kuox9ax2/</a> I have a timer that counts down.</p>
  
  <ul>
  <li>When it reaches zero, it starts over. It shouldn't do that.</li>
  <li>As JS is asynchronous I can't figure out how to get it to call a function only when it have reached zero.</li>
  </ul>
  
  <p>I have tried to as <code>return true</code> in <code>startTimer()</code>, but then I run into that JS is asynchronous, so it returns true right away.</p>
  
  <p>Can someone show how to solve these two issues?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function startTimer(duration, display) {
    var timer = duration, minutes, seconds;
  
    setInterval(function() {
      minutes = parseInt(timer / 60, 10)
      seconds = parseInt(timer % 60, 10);
  
      minutes = minutes &lt; 10 ? "0" + minutes : minutes;
      seconds = seconds &lt; 10 ? "0" + seconds : seconds;
  
      display.textContent = minutes + ":" + seconds;
  
      if (--timer &lt; 0) {
        timer = duration;
      }
    }, 1000);
  }
  
  window.onload = function() {
    var time = 5, display = document.querySelector('#time');
    var isDone = startTimer(time, display);
  
    if (isDone) {
      alert("a");
    }
  };</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div&gt;Timeout in &lt;span id="time"&gt;00:00&lt;/span&gt; minutes&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>