Javascript Timer Pause & Resume

Question

The code is below.

How to add pause function and stop the timer, also set a button to pause the timer and resume when pressing resume?

//startTimer will start the timer onload of body.

 function startTimer() {

    userInput = "35";

    if(userInput.length == 0){
        alert("Please enter a value");
    } 
    else {
        var numericExpression = /^[0-9]+$/;
        if(!userInput.match(numericExpression)){
        alert("Please enter a number")
        }       
        else {
        function display( notifier, str ) {
        document.getElementById(notifier).innerHTML = str;
            }

        function toMinuteAndSecond( x ) {
         return Math.floor(x/60) + ":" + x%60;
  }

  function setTimer( remain, actions ) 
  {

    (function countdown() 
        {
       display("countdown", toMinuteAndSecond(remain));         
       actions[remain] && actions[remain]();
       (remain -= 1) >= 0 && setTimeout(arguments.callee, 1000);
        })();
  }


  setTimer(userInput, {
    35: function () { display("score", "6"); document.getElementById("total").value = 6 },
    20: function () { display("score", "4"); document.getElementById("total").value = 4 },
    15: function () { display("score", "3"); document.getElementById("total").value = 3 },
    10: function () { display("score", "2"); display("notifier", "10 seconds left"); document.getElementById("total").value = 2 },
     5: function () { display("score", "1"); display("notifier", "5 seconds left"); document.getElementById("total").value = 1 },
     0: function () { display("score", "0"); display("notifier", "Time is up"); document.getElementById("total").value = 0 },
  }); 
}  
}
}

// setTimer sets the countdown and displays the time on the page.

//The setTimer(userInput) is to display score randomly on timer scope, as timer changes the score also changes.

On certain limit I need to pause the timer which will display correct score whenever I stop the timer.

Thank you for all of your help!!

Possible duplicate of [javascript: pause setTimeout();](https://stackoverflow.com/questions/3969475/javascript-pause-settimeout) — TheCrzyMan, Sep 08 '17 at 12:41
http://www.htmlcenter.com/blog/pausing-javascript-timers/ Just google "javascript pause settimeout" — TheCrzyMan, Sep 08 '17 at 12:44

score 1 · Answer 1 · answered Sep 08 '17 at 12:36

1

This gives you a basic, stopable Timer

HMTL:

<p>A script on this page starts this clock:</p>
<p id="demo"></p>
<p>Elapsed Seconds:</p>
<p id="secondsPassed"></p>

<button onclick="stopTimer()">Stop time</button>
<button onclick="startTimer()">Start Timer</button>
<button onclick="resumeTimer()">Resume Timer</button>

JS:

var myVar = setInterval(start ,1000);
var Seconds = 0;

function startTimer() { 
    myVar = setInterval(start ,1000);
    Seconds = 0;
}

function resumeTimer() {    
    myVar = setInterval(start ,1000);
}

function start() {
    var d = new Date();
    document.getElementById("demo").innerHTML = d.toLocaleTimeString();
    Seconds++;
    document.getElementById("secondsPassed").innerHTML = Seconds;
}

function stopTimer() {
    clearInterval(myVar)
}

Edited From: https://www.w3schools.com/js/tryit.asp?filename=tryjs_setinterval3

Tutorial: https://www.w3schools.com/js/js_timing.asp

answered Sep 08 '17 at 12:36

Max Kuchenkiller

113
8

I need to edit my given above code, there are many examples related to this, could you help me in my code? – Omkar Patil Sep 08 '17 at 12:48
What exactly are you trying to do? I think you have a timerdependent switch case right? Give me a short intro on what you are trying to do, maybe i can help. – Max Kuchenkiller Sep 08 '17 at 12:53
Actually I have made a simple game, in which timer starts from 35 secs, and goes on decreasing, as time decreases I have assigned scores on specific time slots. now there is a requirement to pause a timer on button click that's it. kindly ignore the score logic, I just need function to pause/stop the timer. in easy way I can say how to pause function countdown() – Omkar Patil Sep 08 '17 at 12:55
Okay, I will prepare a single html file and send you on the email. – Omkar Patil Sep 08 '17 at 13:11
I have sent you an email, kindly check and revert back. – Omkar Patil Sep 08 '17 at 13:34
Thank you Max for immediate help and follow up. – Omkar Patil Sep 11 '17 at 06:25

Javascript Timer Pause & Resume

1 Answers1