|
|||||||||
|
|||||||||
|
|||||||||
 |
|||||||||
| |
||
|
|
|
| ||||||||||||||||||||||||||||||||
 |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
ASP Free Forums Sponsor:
|
|
|
|
#31
June 12th, 2008, 03:47 PM
|
|||
|
|||
|
newbie to java here
i got days added in and found it simple enough however i'm lost with adding centiseconds. i'm assuming of course that i would need to make centiseconds the new standard time in the code instead of seconds. i read somewhere that java keeps track of time in milliseconds naturally. if this is true, would it be as easy as just simply revealing it in a specified place (for example; after seconds, obviously) Code:
function SetCountdownText(seconds) {
//store:
_currentSeconds = seconds;
//get minutes:
var minutes=parseInt(seconds/60);
//shrink:
seconds = (seconds%60);
//get hours:
var hours=parseInt(minutes/60);
//shrink:
minutes = (minutes%60);
//get days:
var days=parseInt(hours/24);
//shrink:
hours = (hours%24);
//build text:
var strText = AddZero(days) + ":" + AddZero(hours) + ":" + AddZero(minutes) + ":" + AddZero(seconds);
EDIT: i figured out a way. i changed window.setTimeout("CountDownTick()", 1000); to window.setTimeout("CountDownTick()", 1); in both instances. then changed seconds, minutes, days, accordingly. seconds are now centiseconds, minutes are now seconds, and so on. putting in the time now is 3600 for 1 minute which kinda blows. if anyone knows of a more "correct" way of doing this, i would still appreciate it.
|
|
#32
October 8th, 2008, 06:45 PM
|
|||
|
|||
|
Hey,
Just wanted to say a massive thanks - this code is exactly what I've been looking for. I'm ok with ASP - just not best with java ... one thing I really need help with is for multiple use of this timer on the page. I made an attempt, but it just screws the countdowns and only worked for the very last container. ie: Time until A = 00:02:15 Time Until B = 01:15:20 Time Until C = 00:15:12 Is this possible? Thanks in advance!
|
|
#33
October 10th, 2008, 08:17 AM
|
||||
|
||||
|
Quote:
sure this is possible.. it posed some challenge to me but as I love challenges, it was fun to do that. see the first post in this thread, I've added zip file with what you need plus full source code. thanks for the idea, let me know if you face any problems. 
|
|
#35
October 23rd, 2008, 11:21 AM
|
||||
|
||||
|
Quote:
download the zip and you'll see the .html file with date format. let me know if you have any questions or problem.
|
|
#36
October 25th, 2008, 09:31 PM
|
|||
|
|||
|
Quote:
Thanks so much! Its working perfectly - your a legend One thing, I'm sure I can find a script that does this easily enough already, but curious how much work it would be to add into your existing js code. I also wanted to display the current server time in realtime... you know just a clock on the page that actually ticks away. Is this a major task or easily added into the code? Again you help is much appreciated!
|
|
#37
October 25th, 2008, 09:36 PM
|
|||
|
|||
|
I'm probably getting really cheeky asking for this as well, but at present your code brings up an alert box when a timer ends...
Instead, how hard would it be to update the font colour of the timer in question? So for example on my page the timers display in black font as they are ticking down. Instead of the alert box once a timer has reached 00:00:00 I'd like the actual displayed timer to change from a black font to red, so the visitor can simply see the colour has changed ie the time is up. Is that hard?
|
|
#38
October 26th, 2008, 04:42 AM
|
||||
|
||||
|
Quote:
this is not easy task. it requires AJAX and pretty advanced code. Quote:
assuming you're using the Advanced code, just change the Callback function code. right now there is line with the word "alert" in that line, you'll need to replace that line with JavaScript code that change the font color. so if now you have such code: Code:
function CountDownEnded1()
{
alert("the time for the first counter has expired!");
}
change to: Code:
function CountDownEnded1()
{
document.getElementById("CountDownPanel1").style.color = "red";
}
|
|
#39
November 21st, 2008, 02:00 PM
|
|||
|
|||
|
Hi shadow wizard, great script! I'm a novice at javascript, can cut and paste and adjust them a little bit, but what I want to do is beyond my knowledge.
I want to countdown a number (to 2 decimal places) rather than a time. The number should have the following variables: nstart (the number to start counting down from) nfinish (the number to countdown to, which will be more than zero) nstep (the amount of each step of the countdown) The display should reduce by the amount of nstep and update every second, just like your clock display... I'd like the number to be displayed on or next to a submit button or link, that when the button is pressed would stop the countdown and take the user to another URL with the number that the countdown stopped at passable to the new page. If the countdown gets to nfinish before the button is pressed then a simple message should display "you missed" Is that easy to achieve from a variation of your script?
|
|
#40
November 23rd, 2008, 02:09 AM
|
||||
|
||||
|
hi broady and welcome to the forum.
yes, it should be pretty simple, but not instant - I'll take a look into it soon when I'll have some time.
|
|
#42
November 24th, 2008, 05:41 AM
|
||||
|
||||
|
well, please take the file AdvancedCountDown.zip from the first post,
I've upgraded the JavaScript and the sample timers. I'll try to elaborate a bit about what you need. first, initialize the timer with such code: Code:
ActivateCountDown("CountDownPanel2", 350.25, "CountDownEnded2");
the second argument is your nstart number. then have such code for container: Code:
<span class="CountDownPanel" id="CountDownPanel2" time_format="RAW" second_value="0.25" finish_value="348.8"></span> the "RAW" as time format will cause the raw value (the number) to be displayed. the second_value is your nstep number and the finish_value is your nfinish number. hope this is clear enough, thanks for the challenge! 
|
|
#43
December 3rd, 2008, 09:51 AM
|
|||
|
|||
|
Help redirecting on AdvancedCountdown
Hello and THANK YOU for the countdown timer. I am using the advanced timer because I need to use multiple timers on my php page. I need to do a redirect when each countdown ends, however I need to send POST variables with the redirect. I have this in mind:
function CountDownEnded() { document.location = "timesup.php?det=true&gnum="+gnum; return; } where variable gnum needs to be specific for each timer. I have somewhat adapted your code to include this: function ActivateCountDown(strContainerID, strCallback, initialValue, gnum) I am getting a value for "gnum" in my redirect page, but it is the value for the last timer initiated, not the one that currently ended. I hope this isn't really confusing, I don't know how to better explain...can you help? I thought of using an array to hold gnum, but not sure how to get the value I need in the "CountDownEnded" function. Maybe passing the strContainerID to that function? Please help! Harv
|
|
#44
December 3rd, 2008, 10:22 AM
|
||||
|
||||
|
hello Harv and welcome to the forum!
put back the original code. with this, have such code in your page: Code:
ActivateCountDown("CountDownPanel1", 100, "CountDownEnded1");
ActivateCountDown("CountDownPanel2", 200, "CountDownEnded2");
ActivateCountDown("CountDownPanel3", 300" "CountDownEnded3");
this will initialize three timers, each with its own time. then, have such code: Code:
<script type="text/javascript">
function PostBack(strNum)
{
var objForm = document.createElement("form");
objForm.action = "timesup.php";
objForm.appendChild(CreateHiddenInput("det", "true");
objForm.appendChild(CreateHiddenInput("gnum", strNum);
document.body.appendChild(objForm);
objForm.submit();
}
function CreateHiddenInput(sName, sValue)
{
var objInput = document.createElement("input");
objInput.type = "hidden";
objInput.name = sName;
objInput.value = sValue;
return objInput;
}
function CountDownEnded1()
{
PostBack("1");
}
function CountDownEnded2()
{
PostBack("2");
}
function CountDownEnded3()
{
PostBack("3");
}
</script>
this will send POST data to your PHP with gnum value of 1 for the first Timer, value of 2 for second Timer and 3 for the third. as you see, when initializing the timer, you send "callback" function. this function will get executed when the time is up and you can have your own code there. hope this make sense!
|
|
#45
December 3rd, 2008, 11:25 AM
|
|||
|
|||
|
I should have mentioned...
It does make sense, but, I guess I should have mentioned that I don't know how many timers are created. I create them in a 'do while' statement depending on a number of rows in a query and then call the script like this:
print "<script>ActivateCountDown('".$span_id."','".CountDownEnded."',".$time.");</script>"; I also put the 'CountDownEnded' function at the bottom of the AdvancedCountdown.js file and I just include the js file when I load the page. (I prefer to keep the js in a separate file to avoid browsers from blocking the script.) it creates all of the timers fine, but I have the problem described earlier. If I use the method you just gave me I am required to know before hand how many timers I am using, right? My var gnum is a value that I get at run time from my query to identify a specific row in a new update query. I know I am being a pain...I know I am close...lol <?php $span_id = "grn_span".$row_rsActive['grenade_number']; $defid = "defuse".$row_rsActive['grenade_number']; if ($totalRows_rsActive > 0) { // Show if recordset not empty $start = $row_rsActive['time_sent']; $end = date("Y-m-d G:i:s"); $time= 600 - (datediff('s', $start, $end, false)); $grenade_number = $row_rsActive['grenade_number']; } ?> <span class="style28"><?php echo $row_rsActive['type']." - "; ?><span class="style32" id="<?php echo $span_id;?>"></span> <?php if ($time > 0) { print "<script>ActivateCountDown('".$span_id."','".CountDownEnded."',".$time.",".$grenade_number.");</script>"; echo $grenade_number; } ?> <br/> </span> Last edited by Howie50 : December 3rd, 2008 at 11:53 AM. Reason: More Code Included:
|
|
| Viewing: ASP Free Forums > Programming > Code Bank > Javascript Countdown Timer |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
|
|
|
 |
|
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
