StopWatch for Frame - JSFiddle

this is the stop watch that need to to embedded in frame

by espyMur

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.14.1/moment.min.js"></script>
<span id="sec"></span>
<br>
<span id="startDate"></span> 
<br>
<span id="endDate"></span>
<br>
<button id="start">start</button>
<button id="pause">pause</button>
<button id="resume">resume</button>
<button id="stop">stop</button>

JavaScript

let start = document.getElementById('start');
let stop = document.getElementById('stop');
let resume = document.getElementById('resume');
let pause = document.getElementById('pause');
let seconds = document.getElementById('sec');
let startDate = document.getElementById('startDate');
let endDate = document.getElementById('endDate');
let Clock = {
   /* this object encapsulate all the action that can be done on the       counter */
  totalSeconds: 0, // the second for the counter
  duration : 0, // final duration of a session
  start: function () {
    /*
    this is to start the session
    */
    let self = this; 
    console.log("started " + this.isStarted+ " paused " + this.isPaused);
    if (!this.isStarted || this.isPaused) {
    /*
    if we the session hasen't started yet, we are not in pause context
    */
    this.isStarted = !this.isStarted;
    this.isPaused = !this.isPaused;
    this.interval = setInterval(function () {
      self.totalSeconds += 1;
      seconds.innerHTML = parseInt(self.totalSeconds );
    }, 1000);
    console.log("started " + this.isStarted+ " paused " + this.isPaused);
    }
    else{
    throw 'cannot start this session';
    }
    
  },
  
  pause: function () {
    console.log("started " + this.isStarted+ " paused " + this.isPaused);
    if (!this.isPaused) {
    /*
    we must be sure that we can only pause a started session
    */
    clearInterval(this.interval);
    delete this.interval;
    this.isPaused = !this.isPaused;
    console.log("started " + this.isStarted+ " paused " + this.isPaused);
    }
    else {
    // throw a new exception here
    throw 'cannot pause this session';
    }
  },

  resume: function () {
  /*
  this is for resuming session
  */
  console.log("started " + this.isStarted+ " paused " + this.isPaused);
  if (this.isPaused && this.isStarted) {
    /*
    we must be sure that we can only resume  a started session and         paused
    */
    this.isStarted = !this.isStarted;
    if...