UBB.Developers Forums UBB.classic V6.4 - 6.7 Modifications V6 Mod Ideas Time / Date Values Relative To Users Timezone

I recently wrote a customised hack for my UBB that (as far as I am aware) has never been done before. Basically this hack would show all your boards times in relation to your users time zone. It would do this automatically without your users entering any information about their time zone. The reason why I’m posting about this is because I don’t have the time or patience to write instructions for a hack of this scale. So I guess I’m perhaps providing some inspiration for someone else to develop this wicked hack for public use!!!

Before I start I must say this is one of the most advanced hacks I have done to date and involves sound knowledge of the UBB and a very firm understanding of JavaScript.

So lets get on to the details!!! My UBB currently uses this hack on the Ultimate.cgi, forumdisplay.cgi, online.cgi and every public or private topic / thread (ubb_library2.pl). My UBB uses embedded JavaScript templates for all of these pages which incidentally reduces my board size and therefore bandwidth by 70% (And that is no exaggeration!!!) Of course converting these pages over to pure JavaScript isn’t easy by any means and this hack should be workable without having to do this.

There are two distinct methods of converting a date / time to be relative to a users time zone. The method depends whether the user is viewing a CGI parsed page or a standard HTML thread. I’ll go into these two methods separately.


CGI Parsed Page

With a CGI based page you can provide accurate, up to the second dates / times which are relative to the users time zone. This is because with CGI you can set a JavaScript string that contains the exact time value for when the page was created. Example…

var TheBoardTime = "January 31 2001, 03:03:05 PM";

Now you can use the date parse function to convert that string into an integer value representing the number of milliseconds since 1 January 1970 00:00:00.

BoardTime = new Date();
BoardTime = Date.parse(TheBoardTime);

You can then compare this with the users local time to find the difference between the board’s server time and the users local time (time offset).

CurrentTime = new Date();
CurrentTime = Date.parse(CurrentTime);

//Difference Between Board & Local Time
TimeDiff = CurrentTime - BoardTime;

So by subtracting the board time from the users local time you now have a value for the difference between the two. This time offset basically needs to be added to your post times to provide date / time values which are relative to your users time zone. This is where it gets a little tricky. Somewhere you will have to call a JavaScript function and hand it the date / time value. This function will then convert the date / time value relative to the users time zone and write this value back to the page. This is some code that would work…

//This is the call to the function, handing it the date / time values.
CGIDate("Jan 29 2001, 01:56 PM");

//This is the actual function
function CGIDate(ThePostTime) {

//Users Local Time
CurrentTime = new Date();
CurrentTime = Date.parse(CurrentTime);

//Current Board Time
BoardTime = new Date();
BoardTime = Date.parse(TheBoardTime);

//Post Time
PostTime = new Date();
PostTime = Date.parse(ThePostTime);

//Difference Between Board & Local Time
TimeDiff = CurrentTime - BoardTime;

//Relative Post Time
PostTime = PostTime + TimeDiff;


//Format Post Time
//Date <-
ThePostTime = new Date(PostTime);
PostDate = months[ThePostTime.getMonth() + 1] + " ";

theday = ThePostTime.getDate();
dayend = "th";
if (theday==1 || theday==21 || theday==31) dayend = "st";
if (theday==2 || theday==22) dayend = "nd";
if (theday==3 || theday==23) dayend = "rd";
PostDate += theday + dayend;
PostDate2 = PostDate;
PostDate += ", " + ThePostTime.getFullYear();


//Time <-
thehour = ThePostTime.getHours();
if (thehour > 12) {
thehour = thehour - 12;
ampm = " PM";
} else if (thehour == 0) {
thehour = 12;
}

PostTime2 = thehour + ":";

themin = ThePostTime.getMinutes();
if (themin < 10) {
themin = "0" + themin;
}
PostTime2 += themin + ampm;
PostTime3 = PostTime2

if ((CurrentTime - PostTime) < 60000) {
PostTime2 = "Just Posted!!!";
} else if ((CurrentTime - PostTime) < 120000) {
PostTime2 = "" + Math.round((CurrentTime - PostTime) / 60000) + " min ago";
} else if ((CurrentTime - PostTime) < 3600000) {
PostTime2 = "" + Math.round((CurrentTime - PostTime) / 60000) + " mins ago";
}


}


The above code allows the date / time values to be returned in different formats. One example of this is posts made less than 60 minutes ago can be shown as ??minutes ago or as an actual time value. The beauty of using JavaScript is that you can format the date returned to any format you desire depending on certain conditions.


So that was the first method for CGI Parsed pages. Now onto the second method for standard HTML pages (threads). As these pages aren’t created on the fly like CGI you can’t use a variable to find out the boards time. I couldn’t find an effective way of using cookies either. The best method I can up with uses the JavaScript TimeZoneOffset function.

now = new Date();
TimeZoneOffset = now.getTimezoneOffset();
TimeZoneOffset = 0 - (TimeZoneOffset * 60000);
TimeZoneOffset = TimeZoneOffset + (300 * 60000);

So this finds the time zone offset as in the difference between local time and Greenwich Mean Time (GMT). From this value you then add / subtract the difference between the board server time and GMT. That is a little hard to get your head round so let me explain it with an example.

My board’s server is in Canada (GMT – 5). I am in Italy (GMT + 1). Using the JavaScript getTimezoneOffset function it will return me as having a time zone offset of 60mins (1 hour) from GMT. I know my board is in Canada which is – 5 from GMT. So the difference between my servers time and my time is –5 – 1 = - 6 hours. So I have to add 6 hours worth of time to all the date / time values to make them relative to my time.

The TimeZoneOffset function will return time offsets in minutes. Because we are primarily working in milliseconds this value need to be multiplied by 60,000. Now we have the time difference between the board time and the users local time we can use the code from the other method to convert and format the date / time value. This method is only accurate to a few minutes and depends on whether the server and users PC clock are correct!!!


One thing to mention is browser compatibility for this JavaScript. IE 4 + works fine with this code. Netscape 6 also works fine. Netscape 4.7 doesn’t 100% like all of this code however.


I hope this information can be of some use to someone in a possible future hack. If you would like to contact me about this code, or possibly get a sneak view of it in action at my board, you can e-mail me evil_sod69@hotmail.com . I will try to get back to you but I make no promises!!!


------------------
Digital Paradise

This message has been edited by JK on January 31, 2001 at 10:08 AM