EasyCFM.COM ColdFusion Forums / Coding Help! / Help with javascript & cf dates/times

   Reply to Discussion | New Discussion << previous || next >> 
Posted By Discussion Topic: Help with javascript & cf dates/times

book mark this topic Printer-friendly Version  send this discussion to a friend  new posts last

cfwhat?
02-01-2007 @ 3:29 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Senior Member
Posts: 174
Joined: Aug 2006

I would like to display a clock in my application, but I don't want to display the user's time. I want to display the servers time. How could I modify this script to use the server's time?

<script language="javascript">
     function js_clock(){
          var clock_time = new Date();
          var clock_hours = clock_time.getHours();
          var clock_minutes = clock_time.getMinutes();
          var clock_seconds = clock_time.getSeconds();
          var clock_suffix = "AM";
          if (clock_hours > 11){clock_suffix = "PM";clock_hours = clock_hours - 12;}
          if (clock_hours == 0){clock_hours = 12;}
          if (clock_hours < 10){clock_hours = "0" + clock_hours;}
          if (clock_minutes < 10){clock_minutes = "0" + clock_minutes;}
          if (clock_seconds < 10){clock_seconds = "0" + clock_seconds;}
          var clock_div = document.getElementById('js_clock');
          clock_div.innerHTML
= clock_hours + ":" + clock_minutes + ":" + clock_seconds + " " + clock_suffix;
          setTimeout("js_clock()", 1000);}js_clock();
</script>


I know nothing about javascript.

Webmaster
02-01-2007 @ 3:52 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Administrator
Posts: 4533
Joined: Jan 2002

Javascript is client side... though you could do it by defaulting the value of:
var clock_time = new Date();


to:
(Surroung with cfoutput)
var clock_time = #now())#;

Why would you go through the trouble? just output it:

Date/Time: #DateFormat(now(), "mm/dd/yyyy")# #timeFormat(now(), 'hh:mm tt')#

on your page directly...

Pablo Varando
Senior Application Architect
EasyCFM.COM, LLC.

904.483.1457 \\ mobile
webmaster@easycfm.com \\email

cfwhat?
02-01-2007 @ 4:01 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Senior Member
Posts: 174
Joined: Aug 2006

Your right, but I would like to have a clock that works instead of a static one...

One where I can provide the servers time when cf processes the page, then have that time stay current with javascript on the client's pc... This is for a web-based time clock/punch clock for the company I work for.

This message was edited by cfwhat? on 2-1-07 @ 4:02 PM

mquack
02-01-2007 @ 4:25 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Moderator
Posts: 1544
Joined: Jan 2005

If you set the date in javascript by using the server date (as suggested above w/ <cfoutput>), the time will NOT move.  It will be the static time that it was set to.  A javascript clock runs on the client machine, not the server.

http://www.rachelqueensg.com

CJ
02-01-2007 @ 4:40 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Administrator
Posts: 4262
Joined: Oct 2002

you could get AJAX-y and ping the server every second to get the new time.  that'd be fun for the server :D

seriously tho...JS doesn't have a built in dateAdd() function like CF, but people have written them.  just google for javascript dateadd

then use the server's time to set a starting time.  use a setInterval() JS method to call a function every 1000ms (every 1 second) to use the javascript dateAdd() function to add a second and update a div.

it's do-able.

-CJ-
@ #coldfusion/DALNet
http://charlie.griefer.com

Teachers open the door. You enter by yourself.
—Chinese Proverb

Webmaster
02-01-2007 @ 4:45 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Administrator
Posts: 4533
Joined: Jan 2002

I am going to say what everyone is thinking... pursuing this would be a waste of time and resources Smile

Pablo Varando
Senior Application Architect
EasyCFM.COM, LLC.

904.483.1457 \\ mobile
webmaster@easycfm.com \\email

mquack
02-01-2007 @ 5:01 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Moderator
Posts: 1544
Joined: Jan 2005

If you want a clock that bad, use a clock service like this one.


http://www.rachelqueensg.com

CJ
02-01-2007 @ 5:12 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
Administrator
Posts: 4262
Joined: Oct 2002

quote:

I am going to say what everyone is thinking... pursuing this would be a waste of time and resources



i can't speak for everybody, but i know that i wasn't thinking that.  

i was thinking, "how come when bad guys shoot a gun at superman, he just puffs out his chest and lets the bullets bounce off...but when they're out of bullets and throw the gun at him, he ducks?"

yeah.  that's what i was thinkin'.

-CJ-
@ #coldfusion/DALNet
http://charlie.griefer.com

Teachers open the door. You enter by yourself.
—Chinese Proverb

pfarabee
02-05-2007 @ 12:53 PM
Reply
Edit
Profile
Send P.M.
My Gravatar!
Powered by Gravatar
New Member
Posts: 7
Joined: Feb 2007

quote:


I am going to say what everyone is thinking... pursuing this would be a waste of time and resources


Not at all, I've done something similar to this before.  I won't bore you with the details of that project, but I will share with you the problems I encountered, and what I did to counter them.

1) There is no built-in way in javascript to find the difference between two dates.

2) The largest problem is the browser cache.  If you do as someone suggested and output the timestamp as a javascript variable set by coldfusion, then if the page is reloaded using cached information, your timestamp becomes incorrect.

To solve issue #1, I had to write some custom functions to take two dates and determine the difference between them.  This is actually pretty easy to accomplish, and a net search should locate some javascript libraries or tips to help you.

Issue #2 required cookies.  Basically what I did was design a script to follow these steps:

1) Check for my cookie.  If it exists, load it's value as my offset value and skip to step 4. (This way it doesn't get overwritten by reloads of cached data)
2) Calculate difference between current javascript time and "current time" timestamp sent by the server.
3) Store the offset value in my cookie.
4) Use offset value to adjust all future timestamps generated by javascript.

It helps if the original offset computation happens as soon as possible after the page starts to load.  If the layout is too complex and it takes the javascript too long to initialize, it might skew the offset too much.  I suggest placing the script in the header before any other script and sending a cfflush immediately after the script, which will get it running as soon as possible after the cf timestamp is generated.

EDIT: I almost forgot.. I determined that over time, the offset was no longer valid... the server time managed to desynch itself with my cookie, so I modified the code to include a timestamp along with the offset.  If the server detected the cookie and saw that the timestamp was more than a day old, it output a script that would force a recalculation of the offset.  This would keep it much more in synch over time, or so the thought was.

When I made these modifications, I realized that I was in essence right back where I started.. if the user came back to the page that forced the recalc, then the script would force another offset calc with the (now incorrect) server time... so I had to add a third parameter.. a random checksum sent by the server.  If the checksum in the cookie matched the one in the javascript, then the recalc was not performed, since it could assume it had already been done... tons of hoops to jump through, but it's possible. Smile

Hope this gets you in the right direction at least. Smile

--
Pat

This message was edited by pfarabee on 2-5-07 @ 4:12 PM

Sponsored By...
iOpenSoft, LLC is a Houston, Texas Advanced Technology Studio Specializing in Web Design, Web Development, iPhone App Development and Android App Development.