Getting 2 scripts to run on the same webpage

[Mary Catherine]

I have 2 scipts that I am trying to get to run on the same page. One
is a time/date script, the other is a countdown script (i.e. countdown
days, hours, mins until a given date). They both work independent of
each other, however, when both are on the page, the "active clock"
does not work. I am assuming it is because some of the variables are
the same???

Can anyone help please?!?!
Here are the 2 scripts:
**Active Clock that displays current time/date info**
<!-- Begin
var dayarray=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
var montharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December")
function getthedate(){
var mydate=new Date()
var year=mydate.getYear()
if (year < 1000)
year+=1900
var day=mydate.getDay()
var month=mydate.getMonth()
var daym=mydate.getDate()
if (daym<10)
daym="0"+daym
var hours=mydate.getHours()
var minutes=mydate.getMinutes()
var seconds=mydate.getSeconds()
var dn="AM"
if (hours>=12)
dn="PM"
if (hours>12){
hours=hours-12
}
{
d = new Date();
Time24H = new Date();
Time24H.setTime(d.getTime() + (d.getTimezoneOffset()*60000) +
3600000);
InternetTime = Math.round((Time24H.getHours()*60+Time24H.getMinutes())
/ 1.44);
if (InternetTime < 10) InternetTime = '00'+InternetTime;
else if (InternetTime < 100) InternetTime = '0'+InternetTime;
}
if (hours==0)
hours=12
if (minutes<=9)
minutes="0"+minutes
if (seconds<=9)
seconds="0"+seconds
//change font size here
var cdate=dayarray[day]+", "+montharray[month]+" "+daym+" "+year+" |
"+hours+":"+minutes+" "+dn+" "
if (document.all)
document.all.clock.innerHTML=cdate
else if (document.getElementById)
document.getElementById("clock").innerHTML=cdate
else
document.write(cdate)
}
if (!document.all&&!document.getElementById)
getthedate()
function goforit(){
if (document.all||document.getElementById)
setInterval("getthedate()",1000)
}
window.onload=goforit

// End -->


And the 2nd script - ****Countdown until given date*****
function setcountdown(theyear,themonth,theday){
yr=theyear;mo=themonth;da=theday
}

//////////CONFIGURE THE COUNTDOWN SCRIPT HERE//////////////////

//STEP 1: Configure the countdown-to date, in the format year, month,
day:
setcountdown(2004,12,25)

//STEP 2: Change the two text below to reflect the occasion, and
message to display on that occasion, respectively
var occasion="Christmas!"
var message_on_occasion="Merry Christmas!"

//STEP 3: Configure the below 5 variables to set the width, height,
background color, and text style of the countdown area
var countdownwidth='480px'
var countdownheight='20px'
var countdownbgcolor='white'
var opentags='<font face="Arial" size="4" color="red"><small>'
var closetags='</small></font>'

//////////DO NOT EDIT PASS THIS LINE//////////////////

var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
var crosscount=''

function start_countdown(){
if (document.layers)
document.countdownnsmain.visibility="show"
else if (document.all||document.getElementById)
crosscount=document.getElementById&&!document.all?document.getElementById("countdownie")
: countdownie
countdown()
}

if (document.all||document.getElementById)
document.write('<span id="countdownie"
style="width:'+countdownwidth+';
background-color:'+countdownbgcolor+'"></span>')

window.onload=start_countdown


function countdown(){
var today=new Date()
var todayy=today.getYear()
if (todayy < 1000)
todayy+=1900
var todaym=today.getMonth()
var todayd=today.getDate()
var todayh=today.getHours()
var todaymin=today.getMinutes()
var todaysec=today.getSeconds()
var todaystring=montharray[todaym]+" "+todayd+", "+todayy+"
"+todayh+":"+todaymin+":"+todaysec
futurestring=montharray[mo-1]+" "+da+", "+yr
dd=Date.parse(futurestring)-Date.parse(todaystring)
dday=Math.floor(dd/(60*60*1000*24)*1)
dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
//if on day of occasion
if(dday<=0&&dhour<=0&&dmin<=0&&dsec<=1&&todayd==da){
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+message_on_occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+message_on_occasion+closetags
return
}
//if passed day of occasion
else if (dday<=-1){
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+"Occasion
already passed! "+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+"Occasion already passed! "+closetags
return
}
//else, if not yet
else{
if (document.layers){
document.countdownnsmain.document.countdownnssub.document.write(opentags+dday+
" days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left
until "+occasion+closetags)
document.countdownnsmain.document.countdownnssub.document.close()
}
else if (document.all||document.getElementById)
crosscount.innerHTML=opentags+dday+ " days, "+dhour+" hours, "+dmin+"
minutes, and "+dsec+" seconds left until "+occasion+closetags
}
setTimeout("countdown()",1000)
}

 

[McKirahan]

I have 2 scipts that I am trying to get to run on the same page. One
is a time/date script, the other is a countdown script (i.e. countdown
days, hours, mins until a given date). They both work independent of
each other, however, when both are on the page, the "active clock"
does not work. I am assuming it is because some of the variables are
the same???

[snip]

"montharray" is declared twice.

var montharray=new
Array("January","February","March","April","May","June","July","August","Sep
tember","October","November","December")

var montharray=new
Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec
")

 

[Dr John Stockton]

JRS: In article <hPMkd.86544$R05.20332@attbi_s53>, dated Thu, 11 Nov
2004 16:54:37, seen in McKirahan

I have 2 scipts that I am trying to get to run on the same page. One
is a time/date script, the other is a countdown script (i.e. countdown
days, hours, mins until a given date). They both work independent of
each other, however, when both are on the page, the "active clock"
does not work. I am assuming it is because some of the variables are
the same???

[snip]

"montharray" is declared twice.

var montharray=new
Array("January","February","March","April","May","June","July","August","Sep
tember","October","November","December")

var montharray=new
Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec
")

That's undesirable, but does no harm.

The OP's code is not indented for structure, and therefore not worth
reading in full. However :-

For a clock, setTimeout(..., 1000) is unsuitable; see
<URL:http://www.merlyn.demon.co.uk/js-date0.htm#TaI>

var year=mydate.getYear() ; if (year < 1000) year+=1900
will fail on browsers which give the sequence 97,98,99,00,01 ; such
were said to exist. Use getFullYear or a substitute :
<URL:http://www.merlyn.demon.co.uk/js-date0.htm#gFY>, getFY() .

InternetTime appears to be an estimate of Central European Standard
Time; but it seems not to be used.

The countdown will not allow for Summer Time transitions; users will
expect an integer number of days between 25 Jun 0000h and 25 Dec 0000h.

The programmer should have modularised the code, Leading Zero being an
example.

 

[Michael Winter]

I have 2 scipts that I am trying to get to run on the same page. One is
a time/date script, the other is a countdown script (i.e. countdown
days, hours, mins until a given date). They both work independent of
each other, however, when both are on the page, the "active clock" does
not work. I am assuming it is because some of the variables are the
same???

Whilst some identifiers do clash, I doubt that has much of an impact. The
biggest problem is that both try to assign a function to the document's
load event handler, resulting in the second block of code replacing the
first's starting function.

Can anyone help please?!?!

Certainly. The first thing is to bin the scripts you presented. I
apologise if you authored them, but they are badly written (the fact
you've had problems proves that), bloated, and inefficient.

I've written replacements, but as the second block of code wouldn't
execute (perhaps you didn't post part of it), I've had to guess at what it
did. The same is true, to an extent with the first: I was unable to see
what the author was trying to achieve with the getTimezoneOffset part of
the script, so I ignored that. If they don't produce what you expected,
please describe in detail what should occur.

A demo can be found at
<URL:http://www.mlwinter.pwp.blueyonder.co.uk/clj/catherine/time.html>. It
will be deleted in about a week. There are three script files; two for the
functions, and a third which contains some library code of mine.

There is an important caveat to using this code[1], with the events code
in particular. If you need to add code to be fired when the page loads, do
*not* write

<body ... onload="...">

The code I've presented will be interferred with, and it will stop
working. Instead, write

dom.events.addEventListener(this, 'load', function() {
/* Your code here. */
});

in a script block.

Similarly, don't write

window.onload = funcName;

Use

dom.events.addEventListener(this, 'load', funcName);

instead. This might mean you need to change other scripts.

The reason, if you're interested, is that the events library code creates
a function, a dispatcher, which is added as an event listener. When you
add your own event listeners, the dispatcher adds it to an internal list
and, when the event is fired, it calls all of the functions in this list.
This allows you to add multiple event listeners to the same element[2].

Please be aware that I classify the library code as a beta version: you
may find bugs. If you read this post Dr Stockton, I'd be interested to
know if IE4 runs the demo properly.

[snipped code]

If you post here again with more code, could I make a request? Please
either manually wrap the code to about 70 characters wide, or place a
demonstration online and link to it (preferred). There were numerous
syntax errors where your newsreader automatically wrapped the code. String
literals split across lines, single line comments on two lines, etc. This
makes a debugging effort harder.

Hope that helps,
Mike


[1] Aside from the obvious one: don't pretend you wrote it.
[2] The W3C DOM provides this functionality too, which is used if
available, but browsers like IE need this emulation.

 

[Mary Catherine]

JRS: In article <hPMkd.86544$R05.20332@attbi_s53>, dated Thu, 11 Nov
2004 16:54:37, seen in McKirahan

I have 2 scipts that I am trying to get to run on the same page. One
is a time/date script, the other is a countdown script (i.e. countdown
days, hours, mins until a given date). They both work independent of
each other, however, when both are on the page, the "active clock"
does not work. I am assuming it is because some of the variables are
the same???

[snip]

"montharray" is declared twice.

var montharray=new
Array("January","February","March","April","May","June","July","August","Sep
tember","October","November","December")

var montharray=new
Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec
")

That's undesirable, but does no harm.

The OP's code is not indented for structure, and therefore not worth
reading in full. However :-

For a clock, setTimeout(..., 1000) is unsuitable; see
<URL:http://www.merlyn.demon.co.uk/js-date0.htm#TaI>

var year=mydate.getYear() ; if (year < 1000) year+=1900
will fail on browsers which give the sequence 97,98,99,00,01 ; such
were said to exist. Use getFullYear or a substitute :
<URL:http://www.merlyn.demon.co.uk/js-date0.htm#gFY>, getFY() .

InternetTime appears to be an estimate of Central European Standard
Time; but it seems not to be used.

The countdown will not allow for Summer Time transitions; users will
expect an integer number of days between 25 Jun 0000h and 25 Dec 0000h.

The programmer should have modularised the code, Leading Zero being an
example.

***********************
I will take a look at your suggestions and see if that works. Thanks!
MC

 

[Dr John Stockton]

JRS: In article <opshckp2nqx13kvk@atlantis>, dated Fri, 12 Nov 2004
10:27:03, seen in Michael Winter <M.Winter@bl
ueyonder.co.invalid> posted :

A demo can be found at
<URL:http://www.mlwinter.pwp.blueyonder.co.uk/clj/catherine/time.html>. It
will be deleted in about a week. There are three script files; two for the
functions, and a third which contains some library code of mine.

Please be aware that I classify the library code as a beta version: you
may find bugs. If you read this post Dr Stockton, I'd be interested to
know if IE4 runs the demo properly.

I've not worked out exactly what it should do.

It displays, in my IE4 :

If you want to style the text below, use CSS. You can use the id
attribute values as selectors.

Friday, 12 November 2004 23:46
There are approximately 41 days, 0 hours, and 13 minutes until
Christmas

then twice gives a script error message box, approximately :

Line: 1
Char: 1
Error: Object expected
Code: 0

Suggestion : the countdown, for demo purposes, should show seconds;
otherwise it takes a long time to tell that nothing happens.




From reading the thread, I suspect that an adapted subset of <URL:http:
//www.merlyn.demon.co.uk/js-date2.htm#RC> would do what is wanted;
/inter alia/, it shows a running DoW YYYY-MM-DD hh:mm:ss local clock
and a countdown in Days + hh:mm:ss to the nearest Christmas noon
(i.e., IIRC, at Christmas noon each year it jumps 365/6 days).

By using new Date(+N) at least part of the code is made valid for
the years -68 to +99, or so my comment implies. Admittedly, Christmas
is not applicable in negative years; and no future Christmas is numbered
less than 2004.

Note that the page uses one setTimeout for both YMDhms clock and
countdown, and another for JDN & suchlike.

 

[Michael Winter]

On Sat, 13 Nov 2004 16:08:23 +0000, Dr John Stockton

[snip]

I've not worked out exactly what it should do.

Sorry. The "first" line should display the current time. The "second"
should display a countdown, currently set to 2004-12-25 00:00 (though it
would have been the 24th when you saw it).

Just to note, the reason for the lack of synchronisation between the two
outputs is that they are calculated separately, rather than being linked
to the same Date object. They could be combined, but should one need to be
separated from the other, it would burden the user.

It displays, in my IE4 :

If you want to style the text below, use CSS. You can use
the id attribute values as selectors.

Friday, 12 November 2004 23:46
There are approximately 41 days, 0 hours, and 13 minutes
until Christmas

That's promising...

then twice gives a script error message box, approximately :

Line: 1
Char: 1
Error: Object expected
Code: 0

....but that's confusing. I was worried that IE4 might object to something,
probably due to the type of patterns used. The result I was expecting was
either no problems at all, or total failure. Seems to be neither. Of
course, Microsoft's infamous script debugging messages don't really help
narrow down the cause.

The other cause of concern was the library code used, including a modified
version of DynWrite (dom.write), has never been used in IE4 as far as I
know.

Suggestion : the countdown, for demo purposes, should show seconds;
otherwise it takes a long time to tell that nothing happens.

True. I had that when I was testing the code, but removed it before
uploading. I've restored it. I also added links to the scripts (though
that may not be useful with IE).

From reading the thread, I suspect that an adapted subset of
<URL:http://www.merlyn.demon.co.uk/js-date2.htm#RC> would do what is
wanted;

That's what's effectively happened. As an afterthought, I decided to look
at your site, particularly as you corrected me on a related matter in the
past. The code is comparable, with the only part of note that's missing is

D += (N.getTimezoneOffset()-X.getTimezoneOffset())*60000 // ST

from the function, ReptNow. To be honest, I don't see the point in it.
Surely the timezone in both Date objects will be identical, so you'll
always add zero. I must be missing something.

[snip]

(i.e., IIRC, at Christmas noon each year it jumps 365/6 days).

That's what I see from reading the code.

[snip]

Thank you for looking,
Mike

 

[Dr John Stockton]

JRS: In article <opshey5aaax13kvk@atlantis>, dated Sat, 13 Nov 2004
17:32:39, seen in Michael Winter <M.Winter@bl
ueyonder.co.invalid> posted :

As an afterthought, I decided to look
at your site, particularly as you corrected me on a related matter in the
past. The code is comparable, with the only part of note that's missing is

D += (N.getTimezoneOffset()-X.getTimezoneOffset())*60000 // ST

from the function, ReptNow. To be honest, I don't see the point in it.
Surely the timezone in both Date objects will be identical, so you'll
always add zero. I must be missing something.

Comment ST. N is today, and X is Christmas. In Summer Time, D is a
one-hour adjustment. That's for civil days displayed.

That's what I see from reading the code.

Good. I don't recall whether I ever watched it happen. But on second
thoughts, it should change at 00:00 on the 25th, because of variable Z.


By the way, I control NewPix with Limits to be SURE that the page cannot
ever continuously fetch images from the server. If it can be confirmed
that GetFigs() actually fetches the ten GIFs, and NewPix() does not
cause Web access, I can remove Limits.

 

[Michael Winter]

JRS: In article <opshey5aaax13kvk@atlantis>, dated Sat, 13 Nov 2004
17:32:39, seen in Michael Winter
<[email protected]> posted :
[snip]

D += (N.getTimezoneOffset()-X.getTimezoneOffset())*60000 // ST

[snip]

In Summer Time, D is a one-hour adjustment. [...]

Of course!

Good. I don't recall whether I ever watched it happen. But on second
thoughts, it should change at 00:00 on the 25th, because of variable Z.

I suppose it depends on your aims. In the OP's case, the target date
requires a special case message. At present my code should display the
message for exactly twenty-four hours (must admit I haven't actually
tested that, though). After that, nothing is displayed, but it could be
changed to start the countdown again.

By the way, I control NewPix with Limits to be SURE that the page cannot
ever continuously fetch images from the server.

I don't think you could ever guarantee that. If the user agent doesn't
cache the images due to browser settings, they will be retrieved
constantly.

Mike

 

[Mary Catherine]

I have 2 scipts that I am trying to get to run on the same page. One is
a time/date script, the other is a countdown script (i.e. countdown
days, hours, mins until a given date). They both work independent of
each other, however, when both are on the page, the "active clock" does
not work. I am assuming it is because some of the variables are the
same???

Whilst some identifiers do clash, I doubt that has much of an impact. The
biggest problem is that both try to assign a function to the document's
load event handler, resulting in the second block of code replacing the
first's starting function.

Can anyone help please?!?!

Certainly. The first thing is to bin the scripts you presented. I
apologise if you authored them, but they are badly written (the fact
you've had problems proves that), bloated, and inefficient.

I've written replacements, but as the second block of code wouldn't
execute (perhaps you didn't post part of it), I've had to guess at what it
did. The same is true, to an extent with the first: I was unable to see
what the author was trying to achieve with the getTimezoneOffset part of
the script, so I ignored that. If they don't produce what you expected,
please describe in detail what should occur.

A demo can be found at
<URL:http://www.mlwinter.pwp.blueyonder.co.uk/clj/catherine/time.html>. It
will be deleted in about a week. There are three script files; two for the
functions, and a third which contains some library code of mine.

There is an important caveat to using this code[1], with the events code
in particular. If you need to add code to be fired when the page loads, do
*not* write

<body ... onload="...">

The code I've presented will be interferred with, and it will stop
working. Instead, write

dom.events.addEventListener(this, 'load', function() {
/* Your code here. */
});

in a script block.

Similarly, don't write

window.onload = funcName;

Use

dom.events.addEventListener(this, 'load', funcName);

instead. This might mean you need to change other scripts.

The reason, if you're interested, is that the events library code creates
a function, a dispatcher, which is added as an event listener. When you
add your own event listeners, the dispatcher adds it to an internal list
and, when the event is fired, it calls all of the functions in this list.
This allows you to add multiple event listeners to the same element[2].

Please be aware that I classify the library code as a beta version: you
may find bugs. If you read this post Dr Stockton, I'd be interested to
know if IE4 runs the demo properly.

[snipped code]

If you post here again with more code, could I make a request? Please
either manually wrap the code to about 70 characters wide, or place a
demonstration online and link to it (preferred). There were numerous
syntax errors where your newsreader automatically wrapped the code. String
literals split across lines, single line comments on two lines, etc. This
makes a debugging effort harder.

Hope that helps,
Mike


[1] Aside from the obvious one: don't pretend you wrote it.
[2] The W3C DOM provides this functionality too, which is used if
available, but browsers like IE need this emulation.

********************
Thanks! Ive looked at the files you've linked for me. I did not write
these files, as js is something I am SLOWLY learning to do. They are,
rather, scripts the former web 'developer' either wrote or got
somewhere.

Thank you for the link you posted. I will save these and take a look
at
them tomorrow when I have more time for 'time wasting activities' as
Ive
been told they are called.

Thanks again everyone - even though 1/2 the conversation was way over
my little blonde head! Im sure with enough time and patience, I'll be
able
to figure out whats going on here!

 

[Michael Winter]

[snip]

The reason, if you're interested, is that the events library code
creates a function, a dispatcher, which is added as an event listener.
When you add your own event listeners, the dispatcher adds it to an
internal list and, when the event is fired, it calls all of the
functions in this list. This allows you to add multiple event listeners
to the same element.

I forgot to add to the above: If you do add listeners using

window.onload = funcName;

the dispatcher will be overwritten and the listeners it manages, lost.

[snip]

Thank you for the link you posted. I will save these and take a look at
them tomorrow when I have more time for 'time wasting activities' as Ive
been told they are called.

There were a couple of mistakes which led to changes to all three script
files[1]. I also added to the countdown script compensation for daylight
savings time.

Thanks again everyone - even though 1/2 the conversation was way over my
little blonde head! Im sure with enough time and patience, I'll be able
to figure out whats going on here!

Usenet is meant for discussion so if you have questions, you're more than
welcome to ask them.

Good luck,
Mike


[1] These changes might prevent the errors Dr Stockton reported in IE 4.

 

[Dr John Stockton]

JRS: In article <opshjw2esix13kvk@atlantis>, dated Tue, 16 Nov 2004
09:35:58, seen in Michael Winter <M.Winter@bl
ueyonder.co.invalid> posted :

[1] These changes might prevent the errors Dr Stockton reported in IE 4.

They do; it shows date and changing time, and counts down to Christmas,
showing a time that agrees with mine.

If you keep it as a demo, ISTM worth noting what the CSS link does (I
was expecting a CSSified version of the demo), and remarking on what the
*.js links might do (my system is not set up to show them as text).

 

[Michael Winter]

JRS: In article <opshjw2esix13kvk@atlantis>, dated Tue, 16 Nov 2004
09:35:58, seen in Michael Winter <M.Winter@bl
ueyonder.co.invalid> posted :

[1] These changes might prevent the errors Dr Stockton reported in IE 4.

They do; it shows date and changing time, and counts down to Christmas,
showing a time that agrees with mine.

It was a mistake similar to one I've made previously.

The functions called by setTimeout are inner functions. This doesn't cause
any problems with function-version of the method, but IE 4 only takes a
string argument.

The error was that the resulting string would evaluate to the inner
function name, but as that isn't available at global scope (the context in
which the string is evaluated), IE throws an error. The solution was to
generate a name that was unique at global scope, and assign a reference to
the inner function there.

If you keep it as a demo, [...]

I did intend to delete it once I was satified the OP didn't need it.

Mike