dknelson 12-22-2005, 02:13 AM I have a page on my site to show countdown timers to some our upcoming events. I am using a script called jscountdown that allows me to place multiple scripts on the same page. It works great in IE but in Firefox, only the first couple of timers show up and even they don't count dynamically.
I've pulled what little hair I have left out by the roots. If any of you can help with this script or recommend another that allows multiple countdowns on the same page, it would be appreciated.
The page is at http://www.venturerider.org/rally
I will happily post the script or whatever you need here for you to look at. Please just tell me what is needed.
Thanks,
Don Nelson
dknelson 12-22-2005, 03:01 AM By the way, here is the script that I've got installed.
var spring = new Countdown();
with (spring) {
tagID = "spring";
setEventDate(2006, 03, 20, 0, 0, 0);
event = "Spring";
onevent = "The moment we have been waiting for...!";
afterevent = "Spring has ARRIVED";
}
addCountdown(spring);
var VWII = new Countdown();
with (VWII) {
tagID = "VWII";
setEventDate(2006, 04, 07, 0, 0, 0);
event = "Venture West II";
onevent = "Venture West II Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(VWII);
var VRSpring = new Countdown();
with (VRSpring) {
tagID = "VRSpring";
setEventDate(2006, 06, 04, 0, 0, 0);
event = "VentureRider Spring Rally";
onevent = "The VentureRider Spring Rally Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(VRSpring);
var vrradium = new Countdown();
with (vrradium) {
tagID = "vrradium";
setEventDate(2006, 08, 04, 0, 0, 0);
event = "Rocky Mountain Radium Ride";
onevent = "The Rocky Mountain Radium Ride Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(vrradium);
var dragon = new Countdown();
with (dragon) {
tagID = "dragon";
setEventDate(2006, 08, 09, 0, 0, 0);
event = "2nd Annual Tail of the Dragon Rally";
onevent = "The 2nd Annual Tail of the Dragon Rally Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(dragon);
var pork = new Countdown();
with (pork) {
tagID = "pork";
setEventDate(2006, 09, 01, 0, 0, 0);
event = "Pork in the Pines VentureIn";
onevent = "The Pork in the Pines VentureIn Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(pork);
dknelson 12-22-2005, 08:06 PM Folks...what am I doing wrong here. I've posted this problem in a couple of different forums and have never had a response. Am I asking the question wrong, placing it in the wrong place, not including enough information or what? I basically am just a self taught webmaster who is usually able to hack through this type thing and I KNOW there are a LOT of people who are much better at these things than I am so I just can't imagine that it's something that nobody can figure out.
Don
vwphillips 12-22-2005, 08:52 PM sorry you have not replies, just noted this one.
I cant do much now as its bed time but promice to look tomorrow
olks...what am I doing wrong here.
just the luck of the draw I guess
back tomorrow
dknelson 12-23-2005, 01:21 AM Thank you. That is much appreciated.
Don
vwphillips 12-23-2005, 12:21 PM You posted the definition code but not the functional code so a made a new script that may meet your requirement but I'm only guessing on the requirement
texted with IE6 and FF
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
</head>
<script language="JavaScript" type="text/javascript">
<!--
// Days To
// by Vic Phillips (23-12-2005) http://www.vicsjavascripts.org.uk
var zxcDateAry=new Array();
function zxcInitCountDown(){
var zxcSpring=new zxcCountDown('Spring',[2006,03,04],'Spring','The moment we have been waiting for...!','Spring has ARRIVED')
var zxcVWII=new zxcCountDown('VWII',[2006,04,07],'Venture West II','Venture West II Has ARRIVED','Hope all enjoyed it')
}
function zxcCountDown(zxcid,zxcdate,zxcstartmess,zxcdatemess,zxcendmess){
var zxcobj=document.getElementById(zxcid);
zxcobj.finish=new Date(zxcdate[0],(zxcdate[1]-1),zxcdate[2]);
zxcobj.startmess=zxcstartmess;
zxcobj.datemess=zxcdatemess;
zxcobj.endmess=zxcendmess;
zxcobj.run=true;
zxcobj.txt=document.createTextNode(' ')
zxcDateAry[zxcDateAry.length]=zxcobj;
zxcobj.appendChild(zxcobj.txt);
if (zxcDateAry.length==1){ setTimeout('zxcShowDate();',500); }
}
function zxcShowDate(){
var zxctoday=new Date();
zxctoday=new Date(zxctoday.getFullYear(),zxctoday.getMonth(),zxctoday.getDate());
var zxcrun=false;
for (var zxc0=0;zxc0<zxcDateAry.length;zxc0++){
var zxcdays=Math.floor((zxcDateAry[zxc0].finish-zxctoday)/1000/60/60/24)
if (zxcdays>0){
zxcrun=true;
var zxcdaystxt=' day to ';
if (zxcdays>1){ zxcdaystxt=' days to '; }
zxcDateAry[zxc0].txt.data=zxcdays+zxcdaystxt+zxcDateAry[zxc0].startmess;
}
else if (zxctoday-zxcDateAry[zxc0].finish==0){
zxcrun=true;
zxcDateAry[zxc0].txt.data=zxcDateAry[zxc0].startmess+' '+zxcDateAry[zxc0].datemess;
}
else {
zxcDateAry[zxc0].txt.data=zxcDateAry[zxc0].startmess+' '+zxcDateAry[zxc0].endmess;
zxcDateAry=zxcDateAry.remove(zxcDateAry,zxcDateAry[zxc0]);
}
}
if (zxcrun){
setTimeout('zxcShowDate()',1000*60);
}
}
Array.prototype.remove=function(zxcrema,zxcremi){
for (var zxc0=0;zxc0<zxcrema.length;zxc0++){
if (zxcrema[zxc0]==zxcremi){
zxcrema.splice(zxc0,1);
}
}
return zxcrema;
}
//-->
</script>
<body onload="zxcInitCountDown();" >
<center>
<div id="Spring" style="position:relative;width:370px;height:60px;" ></div>
<br>
<br>
<br>
<br>
<br>
<div id="VWII" style="position:relative;width:370px;height:60px;" ></div>
</center>
</body>
</html>
dknelson 12-23-2005, 12:35 PM Is this what you mean by the functional code? Where do I put the code that you posted? I tried replacing my previous code with it but that does not seem to work.
var spring = new Countdown();
with (spring) {
tagID = "spring";
setEventDate(2006, 03, 20, 0, 0, 0);
event = "Spring";
onevent = "The moment we have been waiting for...!";
afterevent = "Spring has ARRIVED";
}
addCountdown(spring);
var VWII = new Countdown();
with (VWII) {
tagID = "VWII";
setEventDate(2006, 04, 07, 0, 0, 0);
event = "Venture West II";
onevent = "Venture West II Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(VWII);
var VRSpring = new Countdown();
with (VRSpring) {
tagID = "VRSpring";
setEventDate(2006, 06, 04, 0, 0, 0);
event = "VentureRider Spring Rally";
onevent = "The VentureRider Spring Rally Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(VRSpring);
var vrradium = new Countdown();
with (vrradium) {
tagID = "vrradium";
setEventDate(2006, 08, 04, 0, 0, 0);
event = "Rocky Mountain Radium Ride";
onevent = "The Rocky Mountain Radium Ride Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(vrradium);
var dragon = new Countdown();
with (dragon) {
tagID = "dragon";
setEventDate(2006, 08, 09, 0, 0, 0);
event = "2nd Annual Tail of the Dragon Rally";
onevent = "The 2nd Annual Tail of the Dragon Rally Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(dragon);
var pork = new Countdown();
with (pork) {
tagID = "pork";
setEventDate(2006, 09, 01, 0, 0, 0);
event = "Pork in the Pines VentureIn";
onevent = "The Pork in the Pines VentureIn Has ARRIVED";
afterevent = "Hope all enjoyed it";
}
addCountdown(pork);
dknelson 12-23-2005, 12:40 PM Okay...I replaced my script with yours. Now nothing is showing up in regards to the counters. http://www.venturerider.org/rally
Not showing in IE or Firefox.
Don
dknelson 12-23-2005, 01:30 PM Okay...I got yours to work...(not installed at the page right now though)...it was just a matter of me installing it correctly. :(
That does what mine did but the one that I had showed the actual countdown in hours, minutes, seconds. How hard would it be to add that?
Don
Pyth007 12-23-2005, 01:30 PM I don't have time to actually go through your code right now, but what vwp means is the code that states what the different functions do...
Definition code: var someItem = new ItemClass();
Functional code: function ItemClass { ... // Do stuff here ... }
VWPhillip: Looking at the site in FF, I was able to get at the functional code (http://www.venturerider.org/rally/jscountdown.js)...
dknelson 12-23-2005, 01:31 PM Yes...I think I finally figured out what he needed and posted it a couple of posts up.
Don
dknelson 12-23-2005, 01:35 PM Okay...maybe I hadn't.
var myCountdown = new Array();
var repeat = false;
function checkPlural(noun, value) {
noun = ((value == 1) || (value == 0)) ? noun : (noun += "s");
return noun;
}
function updateDisplay(text, id) {
var tag = document.getElementById(id);
if (tag.firstChild) {
tag.firstChild.nodeValue = text;
}
else {
textNode = document.createTextNode(text);
tag.appendChild(textNode);
}
return;
}
function doCountdown() {
for (i = 0; i < myCountdown.length; i++) {
if (!myCountdown[i].expired) {
var currentDate = new Date();
var eventDate = myCountdown[i].eventDate;
var timeLeft = new Date();
timeLeft = eventDate - currentDate;
msPerDay = 24 * 60 * 60 * 1000;
msPerHour = 60 * 60 * 1000;
msPerMin = 60 * 1000;
msPerSec = 1000;
daysLeft = Math.floor(timeLeft / msPerDay);
hoursLeft = Math.floor((timeLeft % msPerDay) / msPerHour);
minsLeft = Math.floor(((timeLeft % msPerDay) % msPerHour) / msPerMin);
secsLeft = Math.floor((((timeLeft % msPerDay) % msPerHour) % msPerMin) / msPerSec);
day = checkPlural("day", daysLeft);
hour = checkPlural("hour", hoursLeft);
minute = checkPlural("minute", minsLeft);
second = checkPlural("second", secsLeft);
if ((daysLeft == 0) && (hoursLeft == 0) && (minsLeft == 0) && (secsLeft == 0)) {
updateDisplay(myCountdown[i].onevent, myCountdown[i].tagID);
}
else {
if (daysLeft <= -1) {
updateDisplay(myCountdown[i].afterevent, myCountdown[i].tagID);
myCountdown[i].expired = true;
}
else {
updateDisplay(daysLeft + " " + day + " " + hoursLeft + " " + hour +
" " + minsLeft + " " + minute + ", and " +
secsLeft + " " + second + " left until " +
myCountdown[i].event, myCountdown[i].tagID);
repeat = true;
}
}
}
}
if (repeat) {
repeat = false;
window.setTimeout("doCountdown()", 1000);
}
else {
return;
}
}
function setEventDate(year, month, day, hour, minute, second) {
this.eventDate = new Date(year, month - 1, day, hour, minute, second);
return;
}
function addCountdown(countdown) {
myCountdown[myCountdown.length] = countdown;
return;
}
function Countdown() {
this.tagID = "";
this.eventDate = new Date();
this.setEventDate = setEventDate;
this.event = "";
this.onevent = "";
this.afterevent = "";
this.expired = false;
vwphillips 12-23-2005, 01:45 PM OK I see the link now, twas late last night
would prefer to use my code, the original seems overcomplex for the task
if thats OK say
dknelson 12-23-2005, 01:50 PM Actually, the script that you posted seems to be okay but I guess if I could request anything more...it would be for it to display the hours, minutes, seconds. I don't know if it would be easier to add that function to yours or figure out why mine doesn't work in Firefox.
Don
vwphillips 12-23-2005, 06:18 PM let me know if more needs doing
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
</head>
<script language="JavaScript" type="text/javascript">
<!--
// DaysTo Part1 (23-12-2005)
// by Vic Phillips http://www.vicsjavascripts.org.uk
// Customising Code
function zxcInitCountDown(){
var zxcSpring=new zxcCountDown('Spring',[2006,03,04],'Spring','The moment we have been waiting for...!','Spring has ARRIVED')
var zxcVWII=new zxcCountDown('VWII',[2006,04,07],'Venture West II','Venture West II Has ARRIVED','Hope all enjoyed it')
}
//-->
</script>
<script language="JavaScript" type="text/javascript">
<!--
// DaysTo Part2 (23-12-2005)
// by Vic Phillips http://www.vicsjavascripts.org.uk
// Functional Code - NO NEED to Change
var zxcDateAry=new Array();
var zxcDay=24*60*60*1000;
var zxcHour=60*60*1000;
var zxcMin=60*1000;
var zxcSec=1000;
function zxcCountDown(zxcid,zxcdate,zxcstartmess,zxcdatemess,zxcendmess){
var zxcobj=document.getElementById(zxcid);
zxcobj.finish=new Date(zxcdate[0],(zxcdate[1]-1),zxcdate[2]);
zxcobj.startmess=zxcstartmess;
zxcobj.datemess=zxcdatemess;
zxcobj.endmess=zxcendmess;
zxcobj.run=true;
zxcobj.txt=document.createTextNode(' ')
zxcDateAry[zxcDateAry.length]=zxcobj;
zxcobj.appendChild(zxcobj.txt);
if (zxcDateAry.length==1){ zxcShowDate(); }
}
function zxcShowDate(){
var zxctoday=new Date();
for (var zxc0=0;zxc0<zxcDateAry.length;zxc0++){
var zxcleft=zxcDateAry[zxc0].finish-zxctoday;
var zxcdays=Math.floor(zxcleft/zxcDay);
var zxchours=Math.floor((zxcleft%zxcDay)/zxcHour);
var zxcmins=Math.floor(((zxcleft%zxcDay)%zxcHour)/zxcMin);
var zxcsecs=Math.floor((((zxcleft%zxcDay)%zxcHour)%zxcMin)/zxcSec);
if (zxcleft>0){
var zxcdaystxt=' day to ';
if (zxcdays>1){ zxcdaystxt=' days to '; }
zxcDateAry[zxc0].txt.data=zxcdays+zxcFormatTxt(' days ',zxcdays)+zxcFormatNu(zxchours)+zxcFormatTxt(' hours ',zxchours)+zxcFormatNu(zxcmins)+zxcFormatTxt(' minutes ',zxcmins)+zxcFormatNu(zxcsecs)+zxcFormatTxt(' Seconds ',zxcsecs)+' to '+zxcDateAry[zxc0].startmess;
}
else if (zxcleft+zxcDay>0){
zxcDateAry[zxc0].txt.data=zxcDateAry[zxc0].startmess+' '+zxcDateAry[zxc0].datemess;
}
else {
zxcDateAry[zxc0].txt.data=zxcDateAry[zxc0].startmess+' '+zxcDateAry[zxc0].endmess;
zxcDateAry=zxcDateAry.remove(zxcDateAry,zxcDateAry[zxc0]);
}
}
if (zxcDateAry.length>0){ setTimeout('zxcShowDate()',1000); }
}
function zxcFormatTxt(zxctxt,zxcnu){
if (zxcnu==1) {zxctxt=zxctxt.replace('s',' '); }
return zxctxt;
}
function zxcFormatNu(zxcnu){
if (zxcnu<10) {zxcnu='0'+zxcnu; }
return zxcnu;
}
Array.prototype.remove=function(zxcrema,zxcremi){
for (var zxc0=0;zxc0<zxcrema.length;zxc0++){
if (zxcrema[zxc0]==zxcremi){
zxcrema.splice(zxc0,1);
}
}
return zxcrema;
}
//-->
</script>
<body onload="zxcInitCountDown();" >
<div id="Spring" style="position:relative;width:370px;height:60px;" ></div>
<br>
<br>
<br>
<br>
<br>
<div id="VWII" style="position:relative;height:60px;" ></div>
</body>
</html>
dknelson 12-23-2005, 08:47 PM That works. Thank you so very much. Sincerely appreciated.
Don
|
|