Javascript timer, with stop button

Question

I have a big problem with my JavaScript timer. Everything working fine, except 1 button: STOP! I cant figure out how to stop everything on my counter (like reset every input and the counter). Any ideas how can I fix this?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Feladat 5</title>
</head>
<body>

<form>
    <label>Indulás: </label><input type="number" id="n_start" placeholder="1000"/> <label> (4 számjegyű
    szám)</label><br /><br />
    <label>Megállás: </label><input type="number" id="n_end" placeholder="1008"/> <label> (4 számjegyű szám)</label><br/><br />
    <label>Számolás léptei: </label><input type="number" id="n_count" placeholder="1"/> <br /><br />
    <label>Időközönti számolás: </label><input type="number" id="n_timer" placeholder="1"/> <label> (másodpercben)</label><br /><br />
</form>
<label>Számláló: </label><span id="counter">0</span> <br /><br />
<button id="first" type="button" onclick="count()">Start</button>
<button id="pause" type="button" style="display:none;" onclick="show_resume()">Pause</button>
<button id="resume" type="button" style="display:none;" onclick="show_pause()">Resume</button>
<button id="stop" type="button" name="stop">Stop</button>

<script>
    function counterLoop(callback, delay)
    {
        var id
                ,start
                ,remaining = delay;
        this.pause = function()
        {
            window.clearTimeout(id);
            remaining -= new Date() - start;
        };

        var resume = function()
        {
            start = new Date();
            id = window.setTimeout(function()
            {
                remaining = delay;
                resume();
                callback();
            }, remaining);
        };
        this.resume = resume;
        this.resume();
    }

    function count()
    {
        var startValue = document.getElementById("n_start").value;
        var endValue = document.getElementById("n_end").value;
        var countValue = document.getElementById("n_count").value;
        var timerValue = document.getElementById("n_timer").value;
        var count = startValue;
        if (startValue == "" || endValue == "" || countValue == "" || timerValue == "")
        {
            alert("Minden mező kitöltése kötelező!");
        }
        else
            {
            if (startValue < 999 || endValue < 999)
            {
                alert("Legalább 4 számjegyű kell legyen az érték!")
            }

            else
                {
                var math_check = endValue - startValue;
                if (math_check % countValue != 0 )
                {
                    alert("A számlálás léptei túl lépnék a megállást.");
                }
                else
                    {
                    var counter = new counterLoop(function ()
                    {
                        if (startValue <= endValue)
                        {
                            if (countValue == 1)
                            {
                                ++count;
                                if (count == endValue )
                                {
                                    counter.pause();
                                    document.getElementById('pause').style.display = 'none';
                                    document.getElementById('resume').style.display = 'none';
                                    document.getElementById('first').style.display = 'inline';
                                    counter = 0;
                                }
                            }
                            else
                            {
                                count = +countValue + +count;
                                if (count == endValue)
                                {
                                    counter.pause();
                                    document.getElementById('pause').style.display = 'none';
                                    document.getElementById('resume').style.display = 'none';
                                    document.getElementById('first').style.display = 'inline';
                                    counter = 0;
                                }
                            }
                        }

                        document.getElementById('counter').innerHTML = count;
                    }, timerValue * 1000);
                    document.getElementById('pause').addEventListener('click', function () {
                        counter.pause()
                    }, false);
                    document.getElementById('resume').addEventListener('click', function () {
                        counter.resume()
                    }, false);

                    document.getElementById('pause').style.display = 'inline';
                    document.getElementById('first').style.display = 'none';
                }
            }
            }
    };

    function show_resume()
    {
        document.getElementById('resume').style.display = 'inline';
        document.getElementById('pause').style.display = 'none';
    }

    function show_pause()
    {
        document.getElementById('resume').style.display = 'none';
        document.getElementById('pause').style.display = 'inline';
    }
</script>
</body>
</html>

please go to this link stackoverflow.com/questions/18121766/… might be it will help — Gaurav_0093
– Gaurav_0093, Commented Dec 22, 2016 at 13:27

Ankit · Accepted Answer · 2016-12-22 13:40:21Z

2

do you want to stop that timer and resume or just stop and reset all the fields?

answered Dec 22, 2016 at 13:40

Ankit

3951 silver badge9 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user5780640 Over a year ago

The pause/resume button is working. I just want to stop that timer and reset all the fields

Collectives™ on Stack Overflow

Javascript timer, with stop button

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related