www.webdeveloper.com
Results 1 to 4 of 4

Thread: Making a count down clock repeat daily..

Hybrid View

  1. #1
    Join Date
    Jul 2010
    Posts
    71

    Question Making a count down clock repeat daily..

    What im trying to do is have a count down timer count down to the same time every day. For example, if i set it to count down to July 9th 2010 8:00pm. At 8pm i want it to pause or wait for 30 min. During that time i want it to display some text. After that 30min is up i want to reset it to count down to the same time the next day. (July 9th 2010 8:00pm) ect. I figgured maybe adding 23 1/2 hours to it but i dont even no how to reset this thing, let alone change the time it counts down to.

    Im not asking any one to do this for me (though i wouldnt hate it) but i really need some direction. All i really think i know is that some functions nned to be placed n the "Else - (if variable = 0) then ........."

    Here is the javascript im using (it works but does not reset) it also takes some information from php:
    Code:
    // Here’s where the Javascript starts
    countdown = <?=$diff?>;
    
    // Converting date difference from seconds to actual time
    function convert_to_time(secs)
    {
    	secs = parseInt(secs);	
    	hh = secs / 3600;	
    	hh = parseInt(hh);	
    	mmt = secs - (hh * 3600);	
    	mm = mmt / 60;	
    	mm = parseInt(mm);	
    	ss = mmt - (mm * 60);	
    		
    	if (hh > 23)	
    	{	
    	   dd = hh / 24;	
    	   dd = parseInt(dd);	
    	   hh = hh - (dd * 24);	
    	} else { dd = 0; }	
    		
    	if (ss < 10) { ss = "0"+ss; }	
    	if (mm < 10) { mm = "0"+mm; }	
    	if (hh < 10) { hh = "0"+hh; }	
    	if (dd == 0) { return (hh+":"+mm+":"+ss); }	
    	else {	
    		if (dd > 1) { return (dd+" days "+hh+":"+mm+":"+ss); }
    		else { return (dd+" day "+hh+":"+mm+":"+ss); }
    	}	
    }
    
    // Our function that will do the actual countdown
    function do_cd()
    {
    	if (countdown < 0)	
    	{ 	
    		<?php
    			if(strtolower(trim($_GET['do'])) == 'r' )
    			{
    		?>
    		// redirect web page
    		document.location.href = "<?=$_GET['data']?>";
    		<?php } ?>
    
    		<?php
    			if(strtolower(trim($_GET['do'])) == 't' )
    			{
    		?>
    		// change text
    		document.getElementById('cd').innerHTML = "<?=$_GET['data']?>";
    		<?php } ?>
    
    	}	
    	else	
    	{	
    		document.getElementById('cd').innerHTML = convert_to_time(countdown);
    		setTimeout('do_cd()', 1000);
    	}	
    	countdown = countdown - 1;	
    }
    
    document.write("<div id='cd'></div>\n");
    
    do_cd();
    
    <? exit(); ?>
    Code in the body:
    Code:
    <SCRIPT language="JavaScript" SRC="countdown.php?timezone=America/Indianapolis&countto=2010-07-08 16:00:00&do=t&data=Dead Front Has Began!"></SCRIPT>
    Text displayed after count down is here^^

    Thanks in advance
    -ZZy

    PS i had to retype this twice cause the site logged me out b4 i could post!

  2. #2
    Join Date
    Jul 2010
    Posts
    71
    for some reason i cant edit posts on this forum and i left out a peice of info. The date is n YYYY:MMD time is HH:MM:SS and it is a 24 hour clock

  3. #3
    Join Date
    Apr 2010
    Posts
    121

    Post

    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style style="text/css">

    .lcdstyle{ /*Example CSS to create LCD countdown look*/
    background-color:black;
    color:lime;
    font: bold 18px MS Sans Serif;
    padding: 3px;
    }

    .lcdstyle sup{ /*Example CSS to create LCD countdown look*/
    font-size: 80%
    }

    </style>

    <script type="text/javascript">

    /***********************************************
    * Universal Countdown script- © Dynamic Drive (http://www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit http://www.dynamicdrive.com/ for this script and 100s more.
    ***********************************************/

    function cdLocalTime(container, servermode, offsetMinutes, targetdate, debugmode){
    if (!document.getElementById || !document.getElementById(container)) return
    this.container=document.getElementById(container)
    var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
    this.localtime=this.serverdate=new Date(servertimestring)
    this.targetdate=new Date(targetdate)
    this.debugmode=(typeof debugmode!="undefined")? 1 : 0
    this.timesup=false
    this.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
    this.updateTime()
    }

    cdLocalTime.prototype.updateTime=function(){
    var thisobj=this
    this.localtime.setSeconds(this.localtime.getSeconds()+1)
    setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
    }

    cdLocalTime.prototype.displaycountdown=function(baseunit, functionref){
    this.baseunit=baseunit
    this.formatresults=functionref
    this.showresults()
    }

    cdLocalTime.prototype.showresults=function(){
    var thisobj=this
    var debugstring=(this.debugmode)? "<p style=\"background-color: #FCD6D6; color: black; padding: 5px\"><big>Debug Mode on!</big><br /><b>Current Local time:</b> "+this.localtime.toLocaleString()+"<br />Verify this is the correct current local time, in other words, time zone of count down date.<br /><br /><b>Target Time:</b> "+this.targetdate.toLocaleString()+"<br />Verify this is the date/time you wish to count down to (should be a future date).</p>" : ""

    var timediff=(this.targetdate-this.localtime)/1000 //difference btw target date and current date, in seconds
    if (timediff<0){ //if time is up
    this.targetdate.setDate(this.targetdate.getDate()+1)
    }
    var oneMinute=60 //minute unit in seconds
    var oneHour=60*60 //hour unit in seconds
    var oneDay=60*60*24 //day unit in seconds
    var dayfield=Math.floor(timediff/oneDay)
    var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
    var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
    var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
    if (this.baseunit=="hours"){ //if base unit is hours, set "hourfield" to be topmost level
    hourfield=dayfield*24+hourfield
    dayfield="n/a"
    }
    else if (this.baseunit=="minutes"){ //if base unit is minutes, set "minutefield" to be topmost level
    minutefield=dayfield*24*60+hourfield*60+minutefield
    dayfield=hourfield="n/a"
    }
    else if (this.baseunit=="seconds"){ //if base unit is seconds, set "secondfield" to be topmost level
    var secondfield=timediff
    dayfield=hourfield=minutefield="n/a"
    }
    this.container.innerHTML=debugstring+this.formatresults(dayfield, hourfield, minutefield, secondfield)
    setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
    }

    /////CUSTOM FORMAT OUTPUT FUNCTIONS BELOW//////////////////////////////

    //Create your own custom format function to pass into cdLocalTime.displaycountdown()
    //Use arguments[0] to access "Days" left
    //Use arguments[1] to access "Hours" left
    //Use arguments[2] to access "Minutes" left
    //Use arguments[3] to access "Seconds" left

    //The values of these arguments may change depending on the "baseunit" parameter of cdLocalTime.displaycountdown()
    //For example, if "baseunit" is set to "hours", arguments[0] becomes meaningless and contains "n/a"
    //For example, if "baseunit" is set to "minutes", arguments[0] and arguments[1] become meaningless etc

    //1) Display countdown using plain text
    function formatresults(){
    if (this.timesup==false){//if target date/time not yet met
    var displaystring="<span style='background-color: #CFEAFE'>"+arguments[1]+" hours "+arguments[2]+" minutes "+arguments[3]+" seconds</span> left until launch time"
    }
    else{ //else if target date/time met
    var displaystring="Launch time!"
    }
    return displaystring
    }

    //2) Display countdown with a stylish LCD look, and display an alert on target date/time
    function formatresults2(){
    if (this.timesup==false){ //if target date/time not yet met
    var displaystring="<span class='lcdstyle'>"+arguments[0]+" <sup>days</sup> "+arguments[1]+" <sup>hours</sup> "+arguments[2]+" <sup>minutes</sup> "+arguments[3]+" <sup>seconds</sup></span> left until 5:00pm server time."
    }
    else{ //else if target date/time met
    var displaystring="" //Don't display any text
    alert("Launch time!") //Instead, perform a custom alert
    }
    return displaystring
    }

    </script>
    </head>
    <body>
    <div id="cdcontainer"></div>
    <script type="text/javascript">
    var servermode='server-php' //Set to server mode
    var targettime='17:00:00' //Set to target time leave seconds as 00
    var container='cdcontainer' //Set to name of container
    var offsetMinutes=0 //Set to LocaltimeoffsetMinutes
    /////////////////// Stop Editing ///////////////////
    var servertimestring=(servermode=="server-php")? '<? print date("F d, Y H:i:s", time())?>' : (servermode=="server-ssi")? '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' : '<%= Now() %>'
    var prep=new Date(servertimestring); prep.months=['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
    prep.limit=targettime.split(':');
    for (var i_tem = 0; i_tem < prep.limit.length; i_tem++)
    prep.limit[i_tem]=parseInt(prep.limit[i_tem], 10);
    if(prep.getHours()>prep.limit[0]||(prep.getHours()==prep.limit[0]&&prep.getMinutes()>=prep.limit[1]))
    prep.setDate(prep.getDate()+1);
    prep.base=prep.months[prep.getMonth()]+' '+prep.getDate()+', '+prep.getFullYear()+' '+targettime;
    var launchdate=new cdLocalTime(container, servermode, offsetMinutes, prep.base);
    launchdate.displaycountdown("days", formatresults2);
    </script>

    </body>
    </html>
    Try That?

  4. #4
    Join Date
    Apr 2010
    Posts
    121
    After a certain amount of time, you can no longer edit your post.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center

"

"

X vBulletin 4.2.2 Debug Information

  • Page Generation 0.10051 seconds
  • Memory Usage 3,013KB
  • Queries Executed 13 (?)
More Information
Template Usage (31):
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_global_above_footer
  • (1)ad_global_below_navbar
  • (1)ad_global_header1
  • (1)ad_global_header2
  • (1)ad_navbar_below
  • (2)bbcode_code
  • (1)bbcode_php
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)headinclude_bottom
  • (4)memberaction_dropdown
  • (1)navbar
  • (4)navbar_link
  • (1)navbar_moderation
  • (1)navbar_noticebit
  • (1)navbar_tabs
  • (2)option
  • (4)postbit
  • (4)postbit_onlinestatus
  • (4)postbit_wrapper
  • (1)showthread_list
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available (6):
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files (27):
  • ./showthread.php
  • ./global.php
  • ./includes/class_bootstrap.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/functions_navigation.php
  • ./includes/class_friendly_url.php
  • ./includes/class_hook.php
  • ./includes/class_bootstrap_framework.php
  • ./vb/vb.php
  • ./vb/phrase.php
  • ./includes/functions_facebook.php
  • ./includes/functions_calendar.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_notice.php
  • ./includes/functions_threadedmode.php
  • ./packages/vbattach/attach.php
  • ./vb/types.php
  • ./vb/cache.php
  • ./vb/cache/db.php
  • ./vb/cache/observer/db.php
  • ./vb/cache/observer.php 

Hooks Called (72):
  • init_startup
  • friendlyurl_resolve_class
  • init_startup_session_setup_start
  • database_pre_fetch_array
  • database_post_fetch_array
  • init_startup_session_setup_complete
  • global_bootstrap_init_start
  • global_bootstrap_init_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • load_show_variables
  • load_forum_show_variables
  • global_state_check
  • global_bootstrap_complete
  • global_start
  • style_fetch
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • strip_bbcode
  • friendlyurl_clean_fragment
  • friendlyurl_geturl
  • forumjump
  • cache_templates
  • cache_templates_process
  • template_register_var
  • template_render_output
  • fetch_template_start
  • fetch_template_complete
  • parse_templates
  • fetch_musername
  • notices_check_start
  • notices_noticebit
  • process_templates_complete
  • friendlyurl_redirect_canonical
  • showthread_post_start
  • showthread_query_postids_threaded
  • showthread_threaded_construct_link
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • memberaction_dropdown
  • tag_fetchbit
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • build_navigation_data
  • build_navigation_array
  • check_navigation_permission
  • process_navigation_links_start
  • process_navigation_links_complete
  • set_navigation_menu_element
  • build_navigation_menudata
  • build_navigation_listdata
  • build_navigation_list
  • set_navigation_tab_main
  • set_navigation_tab_fallback
  • navigation_tab_complete
  • fb_like_button
  • showthread_complete
  • page_templates