title: jquery pause/resume timer toggle
body: <p>I've got this simple countdown timer - </p>
  
  <pre><code>$(document).ready(function() {
  
  var Clock = {
      totalSeconds: 800,
  
      start: function () {
          var self = this;
  
          this.interval = setInterval(function () {
              self.totalSeconds -= 1;
  
              $("#hour").text(Math.floor(self.totalSeconds / 3600));
              $("#min").text(Math.floor(self.totalSeconds / 60 % 60));
              $("#sec").text(parseInt(self.totalSeconds % 60));
          }, 1000);
      },
  
      pause: function () {
          clearInterval(this.interval);
          delete this.interval;
      },
  
      resume: function () {
          if (!this.interval) this.start();
      }
  };
  
  Clock.start();
  
  $('#pauseButton').click(function () { Clock.pause(); });
  $('#resumeButton').click(function () { Clock.resume(); });
  
  
  });
  </code></pre>
  
  <p>I really only want a pause/resume button as one thing</p>
  
  <p>how do I turn </p>
  
  <pre><code>$('#pauseButton').click(function () { Clock.pause(); });
  </code></pre>
  
  <p>so it toggles the pause/resume command</p>
  
  <p>EDIT....</p>
  
  <p>how would I get a CMS (PHP) to decide what the totalSeconds is? As you can see it's currently going to be in a .js file so I guess I need the totalSeconds to be added at the bottom of the html/php page and edited/amended by the cms inputed?</p>