End User is right.
I went and found that old timer script and modified it a little to be more flexible.
There are 4 variables that can be adjusted.
In the PHP section you have:
$hours
$minutes
$seconds
And in the Javascript section you have:
seconds_delay
I added in the hours and I added in the ability to delay the clocks output by a user defined interval (seconds_delay).
I also added in a feature that will automatically adjust the clock to equal increments of seconds_delay.
I have seconds_delay preset to 5 seconds.
Enter the number of hours, minutes and seconds you want the timer to run, into the PHP variables.
And enter the number of seconds you want the clock to delay before changing the time remaining, into the Javascript variable.
This program uses a session variable to store the time the clock will end.
PHP Code:
<?php session_start();
/* If you refresh the page or leave the page to browse and come back then the timer will continue to count down until finished. */
// $hours, $minutes and $seconds are added together to get total time. $hours = 0; // Enter hours $minutes = 0; // Enter minutes $seconds = 30; // Enter seconds $time_limit = ($hours * 60 * 60) + ($minutes * 60) + $seconds; // Convert total time into seconds if(empty($_SESSION["end_time"])){$_SESSION["end_time"] = mktime(date(G),date(i),date(s),date(m),date(d),date(Y)) + $time_limit;} // Add $time_limit (total time) to start time. And store into session variable. ?> <html> <head> <style> #clock { border:2px solid red; font-family:verdana; font-size:16pt; font-weight:bold; background: #FECFC7; width:125px; text-align:center; color:#000000; } </style> <script> var seconds_delay = 5; // Adjust this value for number of seconds to delay before changing the time display. var ct,mins,secs,hrs,sw = 1; function calculate_time() { var end_time = "<?php echo $_SESSION["end_time"]; ?>"; // Get end time from session variable (total time in seconds). var dt = new Date(); // Create date object. var time_stamp = dt.getTime()/1000; // Get current minutes (converted to seconds). var total_time = end_time - Math.floor(time_stamp); // Subtract current seconds from total seconds to get seconds remaining. hrs = Math.floor(total_time / 60 / 60); mins = Math.floor((total_time / 60) - (hrs * 60)); // Extract minutes from seconds remaining. secs = total_time - ((mins * 60) + (hrs * 60 * 60)); // Extract remainder seconds if any. if(secs < 10){secs = "0" + secs;} // Check if seconds are less than 10 and add a 0 in front. if(mins < 10){mins = "0" + mins;} // Check if minutes are less than 10 and add a 0 in front. if(hrs < 10 && hrs > -1){hrs = "0" + hrs;} // Check if hourss are less than 10 and add a 0 in front. document.getElementById("clock").value = hrs + ":" + mins + ":" + secs; // Display remaining minutes and seconds.
// This if statement adjusts time to increments of seconds_delay if(secs % seconds_delay > 0) { sw = 0; ct = setTimeout("calculate_time()",500); } else{sw = 1;} // Check for end of time, stop clock and display message. if(hrs < 0 && mins >= 0 && secs >= 0 || hrs == 0 && mins == 0 && secs == 0) { clearTimeout(ct); document.getElementById("clock").value = "00:00:00"; alert("The time is up."); sw = 0; } if(sw){ct = setTimeout("calculate_time()",seconds_delay * 1000);} // Display the time once every seconds_increment seconds. 1000 equals approximatly 1 second. } </script> </head> <body onload="ct = setTimeout('calculate_time()',1);"> <!-- // Start clock. // --> <input id="clock" readonly> </body> </html>
I have a couple of questions regarding using this timer:
1. I've noticed that if a user was to clear their browser sessions the timer seems to reset itself since that is were it's being stored. Is it possible to combine this script with something like AJAX to store the timer so it won't reset if a user clears their session?
2. Would it be possible to have multiple timers that are independent of one another, just as an example six of them, with this code or would more code be needed?
Something like <input id="clock" readonly> and <input id="clock_2" readonly> etc.
I have a couple of questions regarding using this timer:
1. I've noticed that if a user was to clear their browser sessions the timer seems to reset itself since that is were it's being stored. Is it possible to combine this script with something like AJAX to store the timer so it won't reset if a user clears their session?
I suppose you could use a file to store the end time instead of a session variable.
Quote:
Originally Posted by PopSmith
2. Would it be possible to have multiple timers that are independent of one another, just as an example six of them, with this code or would more code be needed?
Something like <input id="clock" readonly> and <input id="clock_2" readonly> etc.
Yes it would be possible to have more than one timer going at once.
But it would require additional programming.
making a countdown timer
Linear Mode
