title: pausing and resuming a setTimeout program
body: <p>Before yesterday I literally have never written anything with Javascript.  I am brand new at this.  I have written macros in excel but I am very familiar with computers.  I am trying to write a program so I can have an HTML file open in my browser that will have a button.  When I press the button I want it to count down from a random number, and then when the count down is over it will play a beep and randomly pick a text from a list of items.</p>
  
  <p>I have most of this down and working (remember this is my first ever program) but I want to incorporate a feature that allows me to pause the timer so I can resume it later.  I have included some numbers here that work but this is just testing.  </p>
  
  <p>I have been looking online at other "pause and resume" style questions but I'm a little confused.  This is super new to me.</p>
  
  <p>Here is my program so far....</p>
  
  <pre><code>&lt;html&gt;
  &lt;body&gt;
  
  &lt;h2&gt;Javascript CART breakdown calculator&lt;/h2&gt;
  
  &lt;p id="demo"&gt;&lt;/p&gt;
  &lt;p id="breakdown_item"&gt;&lt;/p&gt;
  
  &lt;button onclick="setTimeout(myFunction, my_random_number*1000);"&gt;start timer&lt;/button&gt;
  
  &lt;script&gt;
  var my_random_number, low, high;
  low = 1;
  high = 5;
  my_random_number = Math.floor(Math.random() * high) + low;
  document.getElementById("demo").innerHTML = my_random_number;
  
  var audioCtx = new (window.AudioContext ||  window.webkitAudioContext)();
  
  function myFunction(frequency, duration, callback) {
      duration = 10000 / 1000;     // the 10000 used to be 'duration' 
  
      // create Oscillator node
      var oscillator = audioCtx.createOscillator();
  
      oscillator.type = 'square';
      oscillator.frequency.value = 500; // value in hertz
      oscillator.connect(audioCtx.destination);
  
      oscillator.onended = callback;
      oscillator.start(0);
      oscillator.stop(audioCtx.currentTime + duration);
  
      var random_breakdown_event, low_event, high_event;
      low_event = 1
      high_event = 9
      random_breakdown_event = Math.floor(Math.random() * high_event) + low_event;
  
      var text
      if (random_breakdown_event == 1) text = "blown engine";
      if (random_breakdown_event == 2) text = "broken transmission";
      if (random_breakdown_event == 3) text = "broken suspension";
      if (random_breakdown_event == 4) text = "broken halfshaft";
      if (random_breakdown_event == 5) text = "broken cv joint";
      if (random_breakdown_event == 6) text = "broken wings";
      if (random_breakdown_event == 7) text = "electrical misfire";
      if (random_breakdown_event == 8) text = "broken fuel pump";
      if (random_breakdown_event == 9) text = "change battery";
  
      document.getElementById("breakdown_item").innerHTML = text
  
  }
  
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I would like to incorporate a way to make this timer pause and resume.</p>