Countdown does not return from where it left off

[fercamargo3030]

countdown does not return from where it left off, after pressing f5 it returns at the beginning !!! help me please

    var x = setInterval(function() {

        // Get todays date and time
        var now = new Date().getTime();

        // Find the distance between now an the count down date
        var distance = deadline - now;

        // Time calculations for days, hours, minutes and seconds
        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
        var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = Math.floor((distance % (1000 * 60)) / 1000);

        // Display the result in the element with id="demo"
        document.getElementById("dday").innerHTML = days + "d " + hours + "h " +
            minutes + "m " + seconds + "s ";

        // If the count down is finished, write some text 
        if (distance < 0) {
            clearInterval(x);
            document.getElementById("dday").innerHTML = "SITE NA TEIA";
        }
    }, 1000); 
    function getCurrentDeadline() {
        var deadline = document.cookie.match(/(^|;)myClock=([^;]+)/);
        return deadline && new Date(deadline[2]);
    }

    function initDeadline(){
        var now = new Date().getTime();
    var timeInMinutes = 10;
    var deadline = new Date(now + timeInMinutes * 60 * 1000);
    document.cookie = 'myClock=' + deadline + '; path=/; domain=.epizy.com' + window.location.hostname;
    return deadline;
    }

    var deadline = getCurrentDeadline() || initDeadline();

[Paul_Wilkins]

It seems to be your cookie code that’s giving trouble.

It might help if you use more reliable ways to set and read cookies. The following functions have become standard when it comes to that.

function setCookie(name, value, days) {
    var expires = "";
    if (days) {
        var date = new Date();
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        expires = "; expires=" + date.toUTCString();
    }
    document.cookie = name + "=" + (value || "") + expires + "; path=/";
}

function getCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(";");
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == " ") c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
    }
    return null;
}

function eraseCookie(name) {
    document.cookie = name + "=; Max-Age=-99999999;";
}

[fercamargo3030]

can you give me a practical example in my code?

att

 var x = setInterval(function() {

        // Get todays date and time
        var now = new Date().getTime();

        // Find the distance between now an the count down date
        var distance = deadline - now;

        // Time calculations for days, hours, minutes and seconds
        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
        var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = Math.floor((distance % (1000 * 60)) / 1000);

        // Display the result in the element with id="demo"
        document.getElementById("dday").innerHTML = days + "d " + hours + "h " +
            minutes + "m " + seconds + "s ";

        // If the count down is finished, write some text 
        if (distance < 0) {
            clearInterval(x);
            document.getElementById("dday").innerHTML = "SITE NA TEIA";
        }
    }, 1000);



    function getCurrentDeadline() {
        var deadline = document.cookie.match(/(^|;)myClock=([^;]+)/);
        return deadline && new Date(deadline[2]);
    }

    function initDeadline() {
        var now = new Date().getTime();
        var timeInMinutes = 10;
        var deadline = new Date(now + timeInMinutes * 60 * 1000);
        document.cookie = 'myClock=' + deadline + '; path=/; domain=.epizy.com' + window.location.hostname;
        return deadline;
    }

    var deadline = getCurrentDeadline() || initDeadline();

[Paul_Wilkins]

@fercamargo3030

can you give me a practical example in my code?

Sure thing.

Make this replacement:

// var deadline = document.cookie.match(/(^|;)myClock=([^;]+)/);
var deadline = getCookie("myClock");

and this one:

// document.cookie = 'myClock=' + deadline + '; path=/; domain=.epizy.com' + window.location.hostname;
setCookie("myClock", deadline);

[fercamargo3030]

still unsuccessful, but the cookie looks ok, what’s missing? thanks

    var x = setInterval(function() {
        // Get todays date and time
        var now = new Date().getTime();

        // Find the distance between now an the count down date
        var distance = deadline - now;

        // Time calculations for days, hours, minutes and seconds
        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
        var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = Math.floor((distance % (1000 * 60)) / 1000);

        // Display the result in the element with id="demo"
        document.getElementById("dday").innerHTML = days + "d " + hours + "h " +
            minutes + "m " + seconds + "s ";

        // If the count down is finished, write some text 
        if (distance < 0) {
            clearInterval(x);
            document.getElementById("dday").innerHTML = "SITE NA TEIA";
        }
    }, 1000);

    function getCurrentDeadline() {
        var deadline = Cookie.get("myClock");
        return deadline && new Date(deadline[2]);
    }

    function initDeadline() {
        var now = new Date().getTime();
        var timeInMinutes = 10;
        var deadline = new Date(now + timeInMinutes * 60 * 1000);
        Cookie.set("myClock",deadline);
        return deadline;
    }

    var deadline = getCurrentDeadline() || initDeadline();![abc|690x355]

Error for console

abc hosted at ImgBB

[Paul_Wilkins]

The first time that I run the code it works fine, the second time onwards it has trouble, showing NaN for each number.

The problem comes from confusions in how the date is being handled. Those issues are all fixed when you ensure that the myClock cookie value is a getTime() string, and you keep all of the other workings of the time as that getTime() number.

Clear out the old cookie:

    Cookie.delete("myClock");
    var deadline = getCurrentDeadline() || initDeadline();

Use getTime() as the deadline when setting the cookie:

        // var deadline = new Date(now + timeInMinutes * 60 * 1000);
        var deadline = new Date(now + timeInMinutes * 60 * 1000).getTime();
        Cookie.set("myClock", deadline);

Don’t mess with the cookie value when retrieving it.

    function getCurrentDeadline() {
        var deadline = Cookie.get("myClock");
        // return deadline && new Date(deadline[2]);
        return deadline;
    }

and after running the code, remove that delete cookie command.

    // Cookie.delete("myClock");
    var deadline = getCurrentDeadline() || initDeadline();

[fercamargo3030]

sorry to be incredibly boring, to do everything but without success, it seems that cookies are not being created

    var x = setInterval(function() {
        // Get todays date and time
        var now = new Date().getTime();

        // Find the distance between now an the count down date
        var distance = deadline - now;

        // Time calculations for days, hours, minutes and seconds
        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
        var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = Math.floor((distance % (1000 * 60)) / 1000);

        // Display the result in the element with id="demo"
        document.getElementById("dday").innerHTML = days + "d " + hours + "h " +
            minutes + "m " + seconds + "s ";

        // If the count down is finished, write some text 
        if (distance < 0) {
            clearInterval(x);
            document.getElementById("dday").innerHTML = "SITE NA TEIA";
        }
    }, 1000);

    function getCurrentDeadline() {
        var deadline = Cookie.get("myClock");
        //return deadline && new Date(deadline[2]);
        return deadline;
    }

    function initDeadline() {
        var now = new Date().getTime();
        var timeInMinutes = 10;
        var deadline = new Date(now + timeInMinutes * 60 * 1000).getTime();
        Cookie.set("myClock", deadline);
        return deadline;
    }
    //Cookie.delete("myClock");
    var deadline = initDeadline() || getCurrentDeadline();

[Pepster64]

Why don’t you look at this tutorial https://www.sitepoint.com/build-javascript-countdown-timer-no-dependencies/

It kind of looks like some of the code, plus I think it might help?

[fercamargo3030]

@Pepster64

código

this tutorial only works the counter, the part of the cookies that I’ve tried unfortunately

[Paul_Wilkins]

@fercamargo3030

sorry to be incredibly boring, to do everything but without success, it seems that cookies are not being created

Not a problem. I have been assuming that you have Cookie.set and Cookie.get defined elsewhere in your code.

Here is a working example using the code that you have above:
https://jsfiddle.net/pmw57/0b8ygxkn/`

[fercamargo3030]

finally after I broke my head, I’m Brazilian I’m sorry for the bad English, thanks to everyone, this is the best forum