Simple JavaScript timer

Question

I am trying to create a very simple JavaScript count down timer, I have a problem when displaying "minute" with string "0" when it has only 1 digit, it adds "0" every second while "seconds" do not add more "0", only one "0" when it displays 1 numerical digit, how do I display only one "0" to a minute?

Regards.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>count down test</title>
</head>
<body>

<p id="demo"></p>

<script>
var seconds = 10; //10 sec just to test, originally 60
var minutes = 5; //10 min just to test, originally 59
var hour = 1; //can be set to 48 hours for 2days, 72 hours for 3days

//function to display time
function count() {
    if(hour == 0 && minutes == 0 && seconds == 0) {
        clearInterval();
    }

    //reset seconds when reached 0
    if(seconds == 0) {
        seconds = 10; //originally 60
        minutes--;
    }

    if(minutes == 0) {
        minutes = 10; //originally 59

        if(hour != 0) {
            hour--;
        }
    }

    //-1sec every second
    seconds--;

    //if less than 10 sec add "string" character 0 to first digit
    if(seconds < 10) {
        seconds = "0" + seconds;
    }

    //if less than 10 min add "string" character 0 to first digit
    if(minutes < 10) {
        minutes = "0" + minutes;
    }

    document.getElementById("demo").innerHTML = hour + " : " + minutes + " : " + seconds;
}

count();

setInterval(function(){
    count();
}, 1000);
</script>
</body>
</html>

@salma sultana sorry for my bad English, it's not my native language :/ what I was trying to do here is I wanted to make a count down timer. for example 02:59:59 is a timer for 3 hours //if less than 10 sec add "string" character 0 to first digit if(seconds < 10) { seconds = "0" + seconds; } this line of code adds string character "0" when the number is less that 10, since it will count as 9, 8, 7, 6 and so on because I wanted to display the time in 2 digits like 09, 08, 07 and so on. my problem is it will display like this 02: 009: 09 02: 0009: 08 02: 00009: 07 and so on — ha_ryu
– ha_ryu, Commented Jan 29, 2016 at 1:11
sorry above comment is hard to read since it did not indent properly. — ha_ryu
– ha_ryu, Commented Jan 29, 2016 at 1:15

Anant Gulia · Accepted Answer · 2016-01-28 11:53:11Z

1

When the minute digit is less then 10 its adding that string "0" to the orignal data type number minute and converting it to a string type and its getting repeated thats why its adding 0 again and again like string you just have to parseFloat() the orignal minute back to numeric type so that js would not add zero as string again each second.. hope that make sense you can check the code below to test it again.
//you are doing this //WRONG CASE

//if less than 10 sec add "string" character 0 to first digit
if(seconds < 10) {
    seconds = "0" + seconds;
}

//if less than 10 min add "string" character 0 to first digit
if(minutes < 10) { 
    minutes = "0" + minutes;
}

// DO it like this
// RIGHT CASE
//if less than 10 sec add "string" character 0 to first digit
if(seconds < 10) {
seconds = "0" + seconds;
}

//if less than 10 min add "string" character 0 to first digit
if(minutes < 10) {
minutes = "0" + parseFloat(minutes);
}

edited Jan 28, 2016 at 11:53

answered Jan 28, 2016 at 11:41

Anant Gulia

794 bronze badges

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

1 Comment

ha_ryu Over a year ago

@WebDuor thanks for your reply, sorry my explanation wasn't good enough, I got it right with //if less than 10 min add "string" character 0 to first digit if(minutes < 10) { //convert minute to number minutes = parseInt(minutes); minutes = "0" + minutes; } too, thanks for the hint! it was a matter of Data Type. I just used "parseInt()" since I did not need floating number :)

Afsar · Accepted Answer · 2016-01-28 11:38:29Z

0

Do not change your seconds and minutes variable , it will affect in condItions

I have modified the code to your requirement check out this:

    function count() {
                var placerS,placerM;
                if(hour == 0 && minutes == 0 && seconds == 0) {
                clearInterval();
                }

                //reset seconds when reached 0
                if(seconds == 0) {
                seconds = 10; //originally 60
                minutes--;
                }

                if(minutes == 0) {
                minutes = 10; //originally 59

                if(hour != 0) {
                hour--;
                }
                }

                //-1sec every second
                seconds--;

                //if less than 10 sec add "string" character 0 to first digit
                if(seconds < 10) {
                placerS = "0";
                }else{
                placerS = '';
                }

                //if less than 10 min add "string" character 0 to first digit
                if(minutes < 10) {
                placerM = "0";
                }else{
                placerM = '';
                }

                document.getElementById("demo").innerHTML = hour + " : "+placerM + minutes + " : "+placerS + seconds;
    }

answered Jan 28, 2016 at 11:38

Afsar

3,1242 gold badges27 silver badges35 bronze badges

1 Comment

ha_ryu Over a year ago

thanks for your reply! it works but I still have to edit this to make it stop @ 00:00:00 :)

salma sultana · Accepted Answer · 2016-01-31 07:08:38Z

0

You can use the code below for converting minute:

if(minutes < 10) 
{
    var totalmin;
    var init = 0;
    var min = parseFloat(minutes);
    totalmin= init  + min;
    minutes = totalmin.toString();
}

edited Jan 31, 2016 at 7:08

answered Jan 28, 2016 at 11:47

salma sultana

1261 gold badge2 silver badges9 bronze badges

Collectives™ on Stack Overflow

Simple JavaScript timer

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related