title: JavaScript - store a countdown time deadline for page reload
body: <p>So here I have created a countdown timer of 10 minutes to initiate upon the press of the 'START' button. I want to store this countdown so that when the user goes off the page and comes back to it the countdown will still be going. Note that I do NOT want the countdown to stop and then continue where it left off upon page reload, I would like it to continue to it's specified deadline. Any suggestions?</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  
  
  
      &lt;a id="sendButton" class="button" onclick=" startClock();"&gt;START&lt;/a&gt;
  
          &lt;div id="sectionClock"&gt;
  
          &lt;div id="clockdiv"&gt;
              &lt;div&gt;
                  &lt;span class="hours"&gt;&lt;/span&gt;
                  &lt;div class="smalltext"&gt;Hours&lt;/div&gt;
              &lt;/div&gt;
              &lt;div&gt;
                  &lt;span class="minutes"&gt;&lt;/span&gt;
                  &lt;div class="smalltext"&gt;Minutes&lt;/div&gt;
              &lt;/div&gt;
              &lt;div&gt;
                  &lt;span class="seconds"&gt;&lt;/span&gt;
                  &lt;div class="smalltext"&gt;Seconds&lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;script&gt;
  function getTimeRemaining(endtime) {
      var t = Date.parse(endtime) - Date.parse(new Date());
      var seconds = Math.floor((t / 1000) % 60);
      var minutes = Math.floor((t / 1000 / 60) % 60);
      var hours = Math.floor((t / (1000 * 60 * 60)) % 24);
      return {
          'total': t,
          'hours': hours,
          'minutes': minutes,
          'seconds': seconds
      };
  }
  var flag = 0;
  
  function startClock() {
  
  
      /************ INITIALIZE CLOCK ************/
      function initializeClock(id, endtime) {
  
          // If countdown time is 0 then operate
          if(flag==0)
          {
              var clock = document.getElementById(id);
              var hoursSpan = clock.querySelector('.hours');
              var minutesSpan = clock.querySelector('.minutes');
              var secondsSpan = clock.querySelector('.seconds');
  
          flag=1; 
          }
  
  
          function updateClock() {
              var t = getTimeRemaining(endtime);
  
  
              hoursSpan.innerHTML = ('0' + t.hours).slice(-2);
              minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
              secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
  
              if (t.total &lt;= 0) {
                  clearInterval(timeinterval);
                  flag=0;
              }
          }
  
          updateClock();
          var timeinterval = setInterval(updateClock, 1000);
      }
  
      var timeInMinutes = 10;
      var currentTime = Date.parse(new Date());
      var deadline = new Date(currentTime + timeInMinutes*60*1000);
      initializeClock('clockdiv', deadline);
  
      document.cookie = deadline
  
      var cookie = document.cookie;
  
      console.log(cookie);
  
  }
  
  function sendTrack(){
      (function() {
  
          var trackUrl = document.getElementById("url");    
  
      }());
  }
  
      &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>