PDA

View Full Version : Local Time script as external .JS file?



tpk
08-11-2007, 10:00 PM
Local Time script as external .JS file?

http://www.dynamicdrive.com/dynamicindex6/localtime.htm

Problem:

Dear all,

I´d like to use the Local Time script on multiple pages and have it in an external Javascript file. I know this might sound stupid as most of you will lough about how easy it is... I'm a newbee in Javascript, sorry :D .

I created a clean file (no html/php) with the .js ending and removed the <script type="text/javascript"> at the top and the </script> at the bottom.

I inserted the following into the head section of the page: <script src="localtimescript.js" type="text/javascript"> to load the Javascript.


In the <body> I have:

Local Time in Lima:<span id="timecontainer"></span>
<script type="text/javascript">
new showLocalTime("timecontainer", "server-php", -420, "short")
</script>

...It doesn&#180;t work...

Is there an additional command to execute the script?

But when I embedd the script (as per instruction) in a test page works fine!

TNX for any help!

tpk

ddadmin
08-11-2007, 10:29 PM
In this case you won't be able to just drop the script into a .js file, since the following line of code within it needs to be dynamically parsed based on your page's type (ie: .shtml, .php etc):


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() %>'

Once you put the script in a .js file, it's no longer parsed correctly. What you can do is move the above line of code to the page itself:


Local Time in Lima:<span id="timecontainer"></span>
<script type="text/javascript">
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() %>'
new showLocalTime("timecontainer", "server-php", -420, "short")
</script>


That should work. There are other ways as well, for example, if your pages are PHP pages, you can output the entire .js file as a .php file (see this tutorial: http://www.javascriptkit.com/javatutors/externalphp.shtml).

wrangler25x
11-08-2007, 11:45 PM
Hello,

I want to make sure I got this: I place the following code in the body:

Local Time in Lima:<span id="timecontainer"></span>
<script type="text/javascript">
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() %>'
new showLocalTime("timecontainer", "server-php", -420, "short")
</script>

And then I place the remainder in an external .js file? I did just that and it's not working for me. I'm linking to the .js file in the <head></head> tag.

Thanks:)
Dan

ddadmin
11-09-2007, 07:11 AM
Wrangler:
The entire code of Step 1 would be the portion that's put into an external .js file, and called in the HEAD section of the page like before:


<script type="text/javascript" src="myexternal.js"></script>

The code you posted above is what goes in the BODY, and remains like before.

wrangler25x
11-09-2007, 04:29 PM
Thanks but I can't get to work for some reason. I did just what you said and no clock is displayed. Is it because mine are .html pages? But the script is working fine when placed entirely within the html code.

ddadmin
11-09-2007, 08:02 PM
Nope, it shouldn't matter what your pages extension are. When putting the script in an external file, did you remember to take out the surrounding <script></script> tags? Explanation here (http://www.javascriptkit.com/javatutors/external.shtml).

wrangler25x
11-09-2007, 11:19 PM
Sure did. Here's the code I'm using for both pages:

clock.php

/***********************************************
* Local Time 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.
***********************************************/

var weekdaystxt=["Sun", "Mon", "Tues", "Wed", "Thurs", "Fri", "Sat"]

function showLocalTime(container, servermode, offsetMinutes, displayversion){
if (!document.getElementById || !document.getElementById(container)) return
this.container=document.getElementById(container)
this.displayversion=displayversion
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.localtime.setTime(this.serverdate.getTime()+offsetMinutes*60*1000) //add user offset to server time
this.updateTime()
this.updateContainer()
}

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

showLocalTime.prototype.updateContainer=function(){
var thisobj=this
if (this.displayversion=="long")
this.container.innerHTML=this.localtime.toLocaleString()
else{
var hour=this.localtime.getHours()
var minutes=this.localtime.getMinutes()
var seconds=this.localtime.getSeconds()
var ampm=(hour>=12)? "PM" : "AM"
var dayofweek=weekdaystxt[this.localtime.getDay()]
this.container.innerHTML=formatField(hour, 1)+":"+formatField(minutes)+":"+formatField(seconds)+" "+ampm+" ("+dayofweek+")"
}
setTimeout(function(){thisobj.updateContainer()}, 1000) //update container every second
}

function formatField(num, isHour){
if (typeof isHour!="undefined"){ //if this is the hour field
var hour=(num>12)? num-12 : num
return (hour==0)? 12 : hour
}
return (num<=9)? "0"+num : num//if this is minute or sec field
}

clock.html

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" src="clock.js">
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
Local Time in Lima:<span id="timecontainer"></span>
<script type="text/javascript">
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() %>'
new showLocalTime("timecontainer", "server-php", -420, "short")
</script>
</body>
</html>

ddadmin
11-10-2007, 07:35 AM
Shouldn't your reference to the script be:


<script type="text/javascript" src="clock.php">
</script>

on your HTML page if your external file is saved as "clock.php"?

wrangler25x
11-10-2007, 12:52 PM
My mistake above - the page is saved clock.js not .php

ddadmin
11-11-2007, 08:26 AM
And it still doesn't work? If so, please post a link to the page on your site that contains the problematic script so we can check it out.