Prevent Resetting Countdown Timer On Page Refresh

How to prevent resetting of countdown timer on page refresh using javascript? 

Run the following html snippet, this serves your purpose. 

When timer starts new then no cookie will be found and it starts with a default value set (100 in this case) and stored in cookie each second. 

When page is refreshed then cookie is checked first for the value and takes it from cookie else starts with default value. 

When the time elapses (becomes 0) cookie is deleted. 

A cookie named timer is stored in this example: 

<html>
<head>

<script type="text/javascript">

function Get_Cookie( check_name ) {

     var a_all_cookies = document.cookie.split( ';' );
     var a_temp_cookie = '';
     var cookie_name = '';
     var cookie_value = '';
     var b_cookie_found = false; 

     for ( i = 0; i < a_all_cookies.length; i++ )
     {
         a_temp_cookie = a_all_cookies\[i\].split( '=' );
         cookie_name = a_temp_cookie\[0\].replace(/^\s+|\s+$/g, '');
         if ( cookie_name == check_name )
         {
             b_cookie_found = true;
             if ( a_temp_cookie.length > 1 )
             {
                 cookie_value = unescape( a_temp_cookie\[1\].replace(/^\s+|\s+$/g, '') );
             }

             return cookie_value;

             break;
         }

         a_temp_cookie = null;
         cookie_name = '';

     }

     if ( !b_cookie_found )
     {

         return null;

     }

}

function setCookie(name, value, path)

{
    document.cookie = name+"="+value+";path="+path;
}

function deleteCookie(name, path)

{

    if (Get_Cookie(name))

        document.cookie = name+"="+((path)?";path="+path :"")+";expires=Thu, 01-Jan-1970 00:00:01 GMT";

}

var secs
var timerID = null
var timerRunning = false
var delay = 1000

function InitializeTimer()

{

    if(Get_Cookie('timer')){

        document.getElementById('cookieText').innerHTML = 'cookie found with value '+Get_Cookie('timer');
        secs = Get_Cookie('timer');

        }

    else{

        document.getElementById('cookieText').innerHTML = 'no cookie found timer starting from default value';

     secs = 100;

    }

StartTheTimer();

}

function StopTheClock()

{

if(timerRunning)

clearTimeout(timerID);

timerRunning = false;

    deleteCookie('timer', '/');

    document.getElementById('cookieText').innerHTML = 'cookie deleted';

}

function StartTheTimer()

{

if (secs==0)

{

        document.getElementById('tim').innerHTML = secs;

        setCookie('timer', secs, '/');

StopTheClock();

}

else

{

self.status = secs;

        document.getElementById('tim').innerHTML = secs;

        setCookie('timer', secs, '/');

secs = secs - 1;

timerRunning = true;
timerID = self.setTimeout("StartTheTimer()", delay);

}

}

//-->

</script>

</head>
<body>

<div id="tim"></div>
<div id="cookieText"></div>

<script type="text/javascript">

InitializeTimer();

</script>

</body>
</html>

See also
JavaScript Tutorial Index

Do you have a Java Problem?
Ask It in The Java Forum

Java Books
Java Certification, Programming, JavaBean and Object Oriented Reference Books

Return to : Java Programming Hints and Tips

All the site contents are Copyright © www.erpgreat.com and the content authors. All rights reserved.
All product names are trademarks of their respective companies.
The site www.erpgreat.com is not affiliated with or endorsed by any company listed at this site.
Every effort is made to ensure the content integrity.  Information used on this site is at your own risk.
 The content on this site may not be reproduced or redistributed without the express written permission of
www.erpgreat.com or the content authors.