CODEWITHSUNDEEP
javascriptcountdowntimer
Aasiya Mairaj
Aasiya Mairaj

Reputation: 185

how can I get remaining time from Countdown timer?

I am trying to create a countdown timer which submit the form after completing the time if user stop the timer in between then I have to count the remaining time . Here is my code.

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    <script type="text/javascript">
        var total_seconds = 600;
        var c_minutes=parseInt(total_seconds/60);
        var c_seconds=parseInt(total_seconds%60);
        var hours=parseInt(total_seconds/3600);
        function CheckTime(){
        document.getElementById('time-left').innerHTML='Time Left: '+hours+' hours '+c_minutes+' min '+c_seconds+' sec';
        if(total_seconds<=0){
            alert("oops no time left");
            setTimeout('document.form.submit()',1);
        }else{
            total_seconds=total_seconds-1;
            c_minutes=parseInt(total_seconds/60);
            c_seconds=parseInt(total_seconds%60);
            hours=parseInt(total_seconds/3600);
            setTimeout("CheckTime()",1000);
        }
        }
        var timeout = setTimeout("CheckTime()",1000);
        setInterval(function() {
        console.log('Time left: '+getTimeLeft(timeout)+'s');
        }, 2000);
        function getTimeLeft(timeout) {
        return Math.ceil((timeout._idleStart + timeout._idleTimeout - Date.now()) / 1000);
        }
    </script>
    </head>
    <body>
    <h1>Countdown Timer</h1>
    <div id="time-left"> </div>
    <br/><br/>
    <form method="post" name="form" action="timer.php"></form>
     <button onclick="getTimeLeft()">Stop</button>
    </body>
</html>

Upvotes: 1

Views: 2777

Answers (2)

Mairaj Ahmad
Mairaj Ahmad

Reputation: 14624

You can simply use the variable total_seconds to get the remaining time in seconds as this is already in seconds and updated after every two seconds.

var timeout = setTimeout("CheckTime()",1000);
        setInterval(function() {
        console.log('Time left: '+total_seconds+'s');
        }, 2000);

Upvotes: 1

Aasiya Mairaj
Aasiya Mairaj

Reputation: 185

Thanks Leopard i got it.

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    <script type="text/javascript">
        var total_seconds = 600;
        var c_minutes=parseInt(total_seconds/60);
        var c_seconds=parseInt(total_seconds%60);
        var hours=parseInt(total_seconds/3600);
        function CheckTime(){
        document.getElementById('time-left').innerHTML='Time Left: '+hours+' hours '+c_minutes+' min '+c_seconds+' sec';
        if(total_seconds<=0){
            alert("oops no time left");
            setTimeout('document.form.submit()',1);
        }else{
            total_seconds=total_seconds-1;
            c_minutes=parseInt(total_seconds/60);
            c_seconds=parseInt(total_seconds%60);
            hours=parseInt(total_seconds/3600);
            console.log(total_seconds);
            setTimeout("CheckTime()",1000);
        }
        }
        setTimeout("CheckTime()",1000);

    </script>
    </head>
    <body>
    <h1>Countdown Timer</h1>
    <div id="time-left"> </div>
    <br/><br/>
    <form method="post" name="form">
        <input type="submit" name="sub" id="submt" value="Save">
    </form>
    </body>
</html>

Upvotes: 1

Related Questions