javascript clock?

Hi,

I need a javascript clock where I can put the time and date into the code (example 3:00pm, 6-28-99)(the actual gmt time and date will be timestamped from the server, I can set the format for the date differently or set the time to 24 hr), offset it by a number of minutes to get the correct timezone (example -60)(this will be pulled from a database using php and could be any value from -720 to +720) and output a running clock with the correct time (using am/pm) and date.

Can anyone here either create or know of where such an animal is?  Or is this to much to ask from from javascript and I need to go to java?

Chris
ChrisAndrewsAsked:
Who is Participating?
 
Michel PlungjanConnect With a Mentor IT ExpertCommented:
var now = new Date(phpyear,phpmonth-1,phpday,phphour,phpminute,phpsecond-1);

       function showtime () {
          now= new Date(now.getTime()+1000); /* get a new date object one second further */
0
 
ChrisAndrewsAuthor Commented:
Edited text of question.
0
 
ChrisAndrewsAuthor Commented:
Edited text of question.
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
JustinCaseCommented:
Not now (It's late hours in Denmark), but there's a good running clock on http://www.nymans.dk/clock/after.htm.

For inspiration purposes only

:)

JustinCase
0
 
sidcapCommented:
Yes JustinCase, but I think ChrisAndrews is looking for an clock independent of the client's hour, His server sets the Javascript clock and then, when the script is loaded at client side, the offset'll be applied.

ChrisAndrews:
Is that what you are looking for?
0
 
ChrisAndrewsAuthor Commented:

Correct, I'd like to have it so that the server sets the start time (gmt) in the script with a timestamp.  That will make it so that the time is correct whether the client computer has the correct time set or not.

Then in the script I need to be able to indicate the offset in minutes.
0
 
Michel PlungjanIT ExpertCommented:
All you need is a clock that does not call the Date() function each second.

The danish clock can easily be modified to call
dato = new Date(phpyear,phpmonth,phpday,phphourmphpminute,phpsecond)
currentSecs = dato.getTime();


and in the clock part do a
currentSecs = currentSecs + 60000;
dato2 = new Date(currentSecs);

Michel
0
 
Michel PlungjanIT ExpertCommented:
Sorry, missed a comma:
dato = new Date(phpyear,phpmonth,phpday,phphour,phpminute,phpsecond)

Michel
0
 
ChrisAndrewsAuthor Commented:

Thank you for your help with this.  I found a clock script that I would like to use, is the script below something that can be adapted to use a timestamp in the script as a 'start time'?

For example, instead of it pulling the time and date from the client browser, I would like to use a timestamp that indicates that the current time and date is  "06-29-1999 2:35pm"  and for it to run from that point on keeping time.  I can put the date and time in any format necessary for the javascript to work.

If you don't mind, since I am not very javascript literate, please give examples instead of explaining what I need to do.... you could just take this script and write in a start time and date where it would need to go.  I also metioned in the questiong that I needed a way to adjust timezone, I found a way I can do that with the timestamp so don't worry about that.

Script below, thanks again,  Chris




<HTML>
 
<HEAD>
<TITLE></TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from old browsers

var timerID = null
var timerRunning = false

function stopclock (){
        if(timerRunning){
                clearTimeout(timerID);
                timerRunning = false
        }
}

function showtime () {
        var now = new Date();
        year = new String(now.getYear());
        month = new String(now.getMonth() + 1);
        date = new String(now.getDate());
        hours = new String(now.getHours());
        minutes = new String(now.getMinutes());
        seconds = new String(now.getSeconds());
       
        document.ampm.src = (hours < 12) ? "dgam.gif" : "dgpm.gif";
        hours = (hours > 12) ? (hours - 12) + "" : hours + ""
        hours = (hours == "0") ? "12" : hours
        document.day1.src = (date < 10) ? "dg0.gif" : "dg" + date.charAt(0) + ".gif";
        document.day2.src = (date < 10) ? "dg" + date + ".gif" : "dg" + date.charAt(1) + ".gif";
        document.month1.src = (month < 10) ? "space.gif" : "dg" + month.charAt(0) + ".gif";
        document.month2.src = (month < 10) ? "dg" + month + ".gif" : "dg" + month.charAt(1) + ".gif";
        document.year1.src = (year < 10) ? "dg0.gif" : "dg" + year.charAt(0) + ".gif";
        document.year2.src = (year < 10) ? "dg" + year + ".gif" : "dg" + year.charAt(1) + ".gif";
        document.hour1.src = (hours < 10) ? "space.gif" : "dg" + hours.charAt(0) + ".gif";
        document.hour2.src = (hours < 10) ? "dg" + hours + ".gif" : "dg" + hours.charAt(1) + ".gif";
        document.colon.src = (seconds % 2) ? "dgon.gif" : "dgoff.gif";
        document.minute1.src = (minutes < 10) ? "dg0.gif" : "dg" + minutes.charAt(0) + ".gif";
        document.minute2.src = (minutes < 10) ? "dg" + minutes + ".gif" : "dg" + minutes.charAt(1) + ".gif";

        timerID = setTimeout("showtime()",1000);
        timerRunning = true
}

function startclock () {
        stopclock();
        showtime()
}
// -->
</SCRIPT>

</HEAD>

<BODY ONLOAD="startclock();">
<IMG SRC="http://www.andrews.com/wwcimg/space.gif" HEIGHT="21" WIDTH="16"
 NAME="month1" BORDER="0"><IMG SRC="http://www.andrews.com/wwcimg/space.gif"
HEIGHT="21" WIDTH="16" NAME="month2" BORDER="0"><IMG
SRC="http://www.andrews.com/wwcimg/dg-.gif" HEIGHT="21" WIDTH="16"
BORDER="0"><IMG SRC="http://www.andrews.com/wwcimg/space.gif"
HEIGHT="21" WIDTH="16" NAME="day1" BORDER="0"><IMG
SRC="http://www.andrews.com/wwcimg/space.gif" HEIGHT="21" WIDTH="16"
NAME="day2" BORDER="0"><IMG SRC="http://www.andrews.com/wwcimg/dg-.gif"
HEIGHT="21" WIDTH="16" BORDER="0"><IMG
SRC="http://www.andrews.com/wwcimg/space.gif" HEIGHT="21" WIDTH="16"
NAME="year1" BORDER="0"><IMG SRC="http://www.andrews.com/wwcimg/space.gif"
HEIGHT="21" WIDTH="16" NAME="year2" BORDER="0">
<IMG SRC="http://www.andrews.com/wwcimg/space.gif" HEIGHT="21" WIDTH="16"
 BORDER="0"><IMG SRC="http://www.andrews.com/wwcimg/space.gif"
HEIGHT="21" WIDTH="16" NAME="hour1" BORDER="0"><IMG
SRC="http://www.andrews.com/wwcimg/space.gif" HEIGHT="21" WIDTH="16"
NAME="hour2" BORDER="0"><IMG
SRC="http://www.andrews.com/wwcimg/dgc.gif" HEIGHT="21" WIDTH="10" NAME="colon"
BORDER="0"><IMG SRC="http://www.andrews.com/wwcimg/space.gif"
HEIGHT="21" WIDTH="16" NAME="minute1" BORDER="0"><IMG
SRC="http://www.andrews.com/wwcimg/space.gif" HEIGHT="21" WIDTH="16"
NAME="minute2" BORDER="0"><IMG SRC="http://www.andrews.com/wwcimg/space.gif"
HEIGHT="21" WIDTH="16" NAME="ampm" BORDER="0">
</BODY>
</HTML>
0
 
Michel PlungjanIT ExpertCommented:
The now in

function showtime () {
               var now = new Date();

is the one that gets the client time. - every time the script is called, in this case once a second (1000 miliseconds...)

If you take the now outside the function and give it a php time - here the values must be comma delimited so it ends up as new Date(1999,5,29,23,59,00):

var now = new Date(phpyear,phpmonth-1,phpday,phphour,phpminute,phpsecond-1);

function showtime () {
   now= new Date(now.getTime()+1000); /* get a new date object one second further */
   
That should be all you need to do... I am sorry I have no time to test it right now. I am off to bed...
Michel


0
 
ChrisAndrewsAuthor Commented:

Yea, that did the trick :)

Thank you,

Chris
0
 
Michel PlungjanIT ExpertCommented:
Glad to be of service

Michel
0
All Courses

From novice to tech pro — start learning today.