Javascript countup timer

C++, C#, Java, PHP, ect...
Post Reply
User avatar
hallsofvallhalla
Site Admin
Posts: 12026
Joined: Wed Apr 22, 2009 11:29 pm

Javascript countup timer

Post by hallsofvallhalla »

wow, I worked my a$$ of on this script. gave me hell on every turn

basically I needed a way for someone to hit a start button and it enter the start time with other info in the DB

Image

then a timer starts to count the time since the person hit start.

Image


this sounds simple and I know there are some scripts out there but I needed to personalize this and I could not find any good pre-made ones. I did find one and I completely gutted it and built it to work.


Soooo here it is, enjoy

place this on your page, javascript

Code: Select all

function updateClock ( )
{
  var startTime = "<?php echo $openstart; ?>";
 var currenthours;
 var currentminutes;
 var currentseconds;
  var currentTime = new Date ( );
  //var finaltime;
  var finaltime;

  var currentHours = currentTime.getHours ( );
  var currentMinutes = currentTime.getMinutes ( );
  var currentSeconds = currentTime.getSeconds ( );

 var totalcurrenttime = currentHours * 3600;
 totalcurrenttime = totalcurrenttime + (currentMinutes * 60);
 totalcurrenttime = totalcurrenttime + currentSeconds;

 var splittime = startTime.split(":");
  var starthours = Number(splittime[0]);
  var startminutes =  Number(splittime[1]);
  var startseconds =  Number(splittime[2]);
 
 var totalstarttime = starthours * 3600;
 totalstarttime  = totalstarttime  + (startminutes * 60);
 totalstarttime  = totalstarttime  + startseconds;
 totalcurrenttime = Number(totalcurrenttime);
 totalstarttime = Number(totalstarttime);
 finaltime = totalcurrenttime - totalstarttime;
 

 if(finaltime > 3599)
 	{
	
	finaltime = finaltime / 60;
 finaltime = finaltime.toFixed(2);
  finaltime = finaltime + '';
  var splitthis = finaltime.split(".")
  	
	
	
	currenthours = splitthis[0] / 60;
	currenthours = currenthours.toFixed(2);
	currenthours = currenthours + '';
	 var splithours = currenthours.split(".")
	currenthours = splithours[0];
	
	currentminutes = splithours[1] * .6;
	currentminutes = currentminutes.toFixed(0);
	currentseconds = splitthis[1] * .6;
	currentseconds = currentseconds.toFixed(0);
	}

else if(finaltime > 60)
 {
 
 finaltime = finaltime / 60;
 finaltime = finaltime.toFixed(2);
  finaltime = finaltime + '';
  var splitthis = finaltime.split(".")
  	currenthours = 0;
	currentminutes =splitthis[0];
	currentseconds = splitthis[1] * .6;
	currentseconds = currentseconds.toFixed(0);
	
	
}	
else
{
	  currenthours = 0;
	  currentminutes = 0;
	 currentseconds = finaltime;
}


 
 
 



  // Pad the minutes and seconds with leading zeros, if required
  currenthours = ( currenthours < 10 ? "0" : "" ) + currenthours;
  currentminutes = ( currentminutes < 10 ? "0" : "" ) + currentminutes;
  currentseconds = ( currentseconds < 10 ? "0" : "" ) + currentseconds;

   // Compose the string for display
  var currentTimeString = currenthours + ":" + currentminutes + ":" + currentseconds;
 
  // Update the time display
  document.getElementById("clock").firstChild.nodeValue = currentTimeString;
}
and to call the timer

Code: Select all

<span id='clock'> </span>
where ever you place that the timer will show. Should work great in games. No matter how much you refresh it will always hold the correct timer, it will not reset. So you could actually have several of these running showing how long someone has been doing an activity. The time is held in the DB.

to share a little more code

here is the form code, you can have anything on there you want them to enter or nothing, ban relates to a account number.

Code: Select all

 echo "<form action='equip.php?saveresearch=1' method='post' >
   <td><input type='text' name='ban' size='15' />
   </td><td><input type='submit' value='Start'></td>
 </form>";
here is the insert statement

Code: Select all

if($_GET['saveresearch'] == 1)
{
$ban = $_POST['ban'];
$time = date('H:i:s');

$SQL = "INSERT into research(ban,agent,date,StartTime) VALUES ('$ban','$userinfo3[name]',CURDATE(),NOW())"; mysql_query($SQL) or die("could not add to research");

}
$date = date("y-m-d");
 $selectresearch="SELECT * from research where date='$date' AND agent='$userinfo3[name]' AND EndTime='00:00:00'";
      $selectresearch2=mysql_query($selectresearch) or die("could not select research");
      while($selectresearch3=mysql_fetch_array($selectresearch2))
      {
	  $iscurrent = 1;
	 $openban = $selectresearch3['ban'];
	 $openstart = $selectresearch3['StartTime'];
	 $currenttime = date('H:i:s');
	   }
i just ran a while check to see if the user already has a timer running but you may want several.

hope someone can use this.
User avatar
kaos78414
Posts: 507
Joined: Thu Jul 22, 2010 5:36 am

Re: Javascript countup timer

Post by kaos78414 »

Oooh this might work for my battle system :D
Thanks!
w00t
User avatar
hallsofvallhalla
Site Admin
Posts: 12026
Joined: Wed Apr 22, 2009 11:29 pm

Re: Javascript countup timer

Post by hallsofvallhalla »

no problem, let me know how easy it is for you to implement.
Post Reply

Return to “Coding”