TP-Docs
HTML5 Icon HTML5 Icon HTML5 Icon
TP on Social Media

Recent

User

Welcome to TinyPortal. Please login or sign up.

June 26, 2024, 09:49:02 AM

Login with username, password and session length

Stats

Members
Stats
  • Total Posts: 195,280
  • Total Topics: 21,227
  • Online today: 319
  • Online ever: 3,540 (September 03, 2022, 01:38:54 AM)
Users Online
  • Users: 1
  • Guests: 333
  • Total: 334
  • illori

World Time Block

Started by alan s, July 05, 2006, 02:31:35 PM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

Print
Go Down Pages1 2 All
User actions

alan s

July 05, 2006, 02:31:35 PM Last Edit: July 05, 2006, 03:08:07 PM by Alan S
Been messing around with this all morning and now here it is , i know a aplet clock for world time was posted before but sure..............

Code Select
<SCRIPT LANGUAGE="JavaScript">


<!--Thanks To Alan S For The Script--!>
<!-- Begin
var timerRunning = false;
var timezone = "Greenwich Mean Time";  // what time zone are you in ?
var adjust = 0;

function timeCheck(tzone, diff) {
if (timerRunning) {
clearTimeout(updatetime);
timerRunning = false; }
gmtOffset=eval(diff+adjust);
timezone = tzone;
checkDateTime();
}

function checkDateTime () {
var today = new Date();
var year = today.getYear() + 1900;
var month = today.getMonth()+1;
var date = today.getDate();
var day = today.getDay();
var hour = today.getHours();
var minute = today.getMinutes();
var second = today.getSeconds();

var lastSat = date - (day+1);
while (lastSat < 32) lastSat+=7;
if (lastSat > 31) lastSat+=-7;
var firstSat = date - (day+1);
while (firstSat > 0) firstSat+=-7;
if (firstSat < 1) firstSat+=7;
if ((((month == 4) && (date >= firstSat)) || month > 4) &&
(month < 11 || ((month == 10) && day <= lastSat))) adjust += 60;
yourOffset = (new Date()).getTimezoneOffset();
yourOffset = yourOffset + adjust;

var xx = navigator.appName
var xy = navigator.appVersion;
xy = xy.substring(0,1);
if ((xy == 4) && (xx == "Netscape")) yourOffset = yourOffset+adjust;
if ((((month == 4) && (date > 20)) || month > 4) && (month < 11 || ((month == 10) &&
day < 30))) adjust -= 60;

ourDifference = eval(gmtOffset - yourOffset);
var half = eval(ourDifference % 60);
ourDifference = Math.round(ourDifference / 60);
hour = eval(hour - ourDifference);
var m = new Array("",
"Jan","Feb","Mar",
"Apr","May","Jun",
"Jul","Aug","Sept",
"Oct","Nov","Dec");
var leap = eval(year % 4);

if ((half == -30) || (half == 30)) minute += 30;
if (minute > 59) minute -= 60, hour++;
if (minute < 0) minute += 60, hour--;
if (hour > 23) hour -= 24, date += 1;
if (((month == 4) || (month == 6) ||
(month == 9) || (month == 11)) && (date==31)) date = 1, month ++;
if (((month == 2) && (date > 28)) && (leap != 0)) date = 1, month ++;
if ((month == 2) && (date > 29)) date = 1, month++;
if (hour < 0) hour += 24, date --;
if ((date == 32) && (month == 12)) month = m[1], date = 1, year++;
if (date == 32) date = 1, month++;
if ((date < 1) && (month == 1)) month= m[12], date = 31, year--;
if (date < 1) date = 31, month --;
if (((month == 4) || (month == 6) ||
(month== 9) || (month == 11)) && (date == 31)) date = 30;
if ((month == 2) && (date > 28)) date = 29;
if (((month == 2) && (date > 28)) && (leap != 0)) date=28;
for (i=1; i<13; i++) {
if (month == i) {
month = m[i]; break;
   }
}

var dateTime = hour;
dateTime = ((dateTime < 10) ? "0":"") + dateTime;
dateTime = "   " + dateTime;
dateTime += ((minute < 10) ? ":0" : ":") + minute;
dateTime += ((second < 10) ? ":0" : ":") + second;
dateTime += (hour >= 12) ? " PM, " : " AM, ";
dateTime += month + " " + date + ", " + year;

document.clock.zonetime.value = dateTime;
document.clock.zonename.value = timezone;
updatetime=setTimeout("checkDateTime()", 900);
timerRunning = true;
}
// End -->
</SCRIPT>
<!-- STEP TWO: Insert the onLoad event handler into your BODY tag  -->

<BODY OnLoad="timeCheck(timezone, 0)">

<!-- STEP THREE: Copy this code into the BODY of your HTML document  -->

<center>
<h2>World Clock</h2>
<form name=clock>
<input type=text name=zonetime size=21><br>
<br>
<b>Current Time Zone</b><br>
<input type=text name=zonename size=21>
<br>
<br>
<table border=1 cellpadding=5>
<tr>
<td align=center><input type=button value="Pacific" onClick="timeCheck(this.value, +480)"></td>
<tr><td align=center><input type=button value="Central" onClick="timeCheck(this.value, +420)"></td>
<tr><td align=center><input type=button value="Eastern" onClick="timeCheck(this.value, +300)"></td>
</tr>
<tr>
<td align=center><input type=button value="Hawaii" onClick="timeCheck(this.value, +600)"></td>
<tr><td align=center><input type=button value="Mexico" onClick="timeCheck(this.value, +360)"></td>
<tr><td align=center><input type=button value="New Delhi" onClick="timeCheck(this.value, -330)"></td>
</tr>
<tr>
<td align=center><input type=button value="Hong Kong" onClick="timeCheck(this.value, -480)"></td>
<tr></tr><td align=center><input type=button value="Tokyo" onClick="timeCheck(this.value, -540)"></td>
<tr></tr><td align=center><input type=button value="London" onClick="timeCheck(this.value, +0)"></td>
</tr>
</table>
</form>
</center>

Screen :

OR

World Clock With Drop Down Menu Instead Of Buttons

Code Select
  <SCRIPT LANGUAGE="JavaScript">


<!--Thanks To Alan S For The Script--!>
<!-- Begin
var timerRunning = false;
var timezone = "Greenwich Mean Time";  // what time zone are you in ?
var adjust = 0;

function timeCheck(tzone, diff) {
if (timerRunning) {
clearTimeout(updatetime);
timerRunning = false; }
gmtOffset=eval(diff+adjust);
timezone = tzone;
checkDateTime();
}

function checkDateTime () {
var today = new Date();
var year = today.getYear() + 1900;
var month = today.getMonth()+1;
var date = today.getDate();
var day = today.getDay();
var hour = today.getHours();
var minute = today.getMinutes();
var second = today.getSeconds();

var lastSat = date - (day+1);
while (lastSat < 32) lastSat+=7;
if (lastSat > 31) lastSat+=-7;
var firstSat = date - (day+1);
while (firstSat > 0) firstSat+=-7;
if (firstSat < 1) firstSat+=7;
if ((((month == 4) && (date >= firstSat)) || month > 4) &&
(month < 11 || ((month == 10) && day <= lastSat))) adjust += 60;
yourOffset = (new Date()).getTimezoneOffset();
yourOffset = yourOffset + adjust;

var xx = navigator.appName
var xy = navigator.appVersion;
xy = xy.substring(0,1);
if ((xy == 4) && (xx == "Netscape")) yourOffset = yourOffset+adjust;
if ((((month == 4) && (date > 20)) || month > 4) && (month < 11 || ((month == 10) &&
day < 30))) adjust -= 60;

ourDifference = eval(gmtOffset - yourOffset);
var half = eval(ourDifference % 60);
ourDifference = Math.round(ourDifference / 60);
hour = eval(hour - ourDifference);
var m = new Array("",
"Jan","Feb","Mar",
"Apr","May","Jun",
"Jul","Aug","Sept",
"Oct","Nov","Dec");
var leap = eval(year % 4);

if ((half == -30) || (half == 30)) minute += 30;
if (minute > 59) minute -= 60, hour++;
if (minute < 0) minute += 60, hour--;
if (hour > 23) hour -= 24, date += 1;
if (((month == 4) || (month == 6) ||
(month == 9) || (month == 11)) && (date==31)) date = 1, month ++;
if (((month == 2) && (date > 28)) && (leap != 0)) date = 1, month ++;
if ((month == 2) && (date > 29)) date = 1, month++;
if (hour < 0) hour += 24, date --;
if ((date == 32) && (month == 12)) month = m[1], date = 1, year++;
if (date == 32) date = 1, month++;
if ((date < 1) && (month == 1)) month= m[12], date = 31, year--;
if (date < 1) date = 31, month --;
if (((month == 4) || (month == 6) ||
(month== 9) || (month == 11)) && (date == 31)) date = 30;
if ((month == 2) && (date > 28)) date = 29;
if (((month == 2) && (date > 28)) && (leap != 0)) date=28;
for (i=1; i<13; i++) {
if (month == i) {
month = m[i]; break;
   }
}

var dateTime = hour;
dateTime = ((dateTime < 10) ? "0":"") + dateTime;
dateTime = "   " + dateTime;
dateTime += ((minute < 10) ? ":0" : ":") + minute;
dateTime += ((second < 10) ? ":0" : ":") + second;
dateTime += (hour >= 12) ? " PM, " : " AM, ";
dateTime += month + " " + date + ", " + year;

document.clock.zonetime.value = dateTime;
document.clock.zonename.value = timezone;
updatetime=setTimeout("checkDateTime()", 900);
timerRunning = true;
}
// End -->
</SCRIPT>
<!-- STEP TWO: Insert the onLoad event handler into your BODY tag  -->

<BODY OnLoad="timeCheck(timezone, 0)">

<!-- STEP THREE: Copy this code into the BODY of your HTML document  -->

<center>
<h2>World Clock</h2>
<form name=clock>
<input type=text name=zonetime size=21><br>
<br>
<b>Current Time Zone</b><br>
<input type=text name=zonename size=21>
<br>
<br>
<table border=1 cellpadding=5>
<tr>
<form name="links1">
<select name="externallinks" OnChange="location.href=menu1.externallinks.options[selectedIndex].value">
<option value="">Timezones</option>
<option value=<input type=button value="Pacific" onClick="timeCheck(this.value, +480)">Pacific</option>
<option value=<input type=button value="Central" onClick="timeCheck(this.value, +420)">Central</option>
<option value=<input type=button value="Eastern" onClick="timeCheck(this.value, +300)">Eastern</option>
<option value=<input type=button value="Hawaii" onClick="timeCheck(this.value, +600)">Hawaii</option>
<option value=<input type=button value="Mexico" onClick="timeCheck(this.value, +360)">Mexico</option>
<option value=<input type=button value="New Delhi" onClick="timeCheck(this.value, -330)">New Delhi</option>
<option value=<input type=button value="Hong Kong" onClick="timeCheck(this.value, -480)">Hong Kong</option>
<option value=<input type=button value="Tokyo" onClick="timeCheck(this.value, -540)">Tokyo</option>
<option value=<input type=button value="London" onClick="timeCheck(this.value, +0)">London</option>
</select>
</form>
</form>
</center>

Screen :


Live Demo Available At www.theteenzone.net/forum



Enjoy

stormlrd

#1
July 05, 2006, 02:35:57 PM
Nice job lol, I like my digital clock, can you do one like it with a dropdown for the buttons rather than the buttons? takes up to much vertical space otherwise.

Sample mine in my sig right hand blocks frontpage.

Crip

#2
July 05, 2006, 02:58:01 PM
Forgot [Mountian] time zone..or is it the same as Mexico?
I have become comfortably numb!

Cripzone | Crip's Free 2.0.2 Themes

alan s

#3
July 05, 2006, 03:14:14 PM
Think its the same as mexico crip , @ StormLrd i edited my first post to include 2 codes one for the first clock and then another one for the clock with the drop down menu like you requested , enjoy

stormlrd

#4
July 05, 2006, 03:15:33 PM
danka good job

RoarinRow

#5
July 05, 2006, 05:44:11 PM
I just tested the drop down menu on your site and it didn't change the time.  Can the date/time wrap around?

SMF 2.0 RC3
TP 1.0 beta 5-1
Wordpress 3.0

alan s

#6
July 05, 2006, 06:15:44 PM
Quote from: RoarinRow on July 05, 2006, 05:44:11 PM
I just tested the drop down menu on your site and it didn't change the time.  Can the date/time wrap around?

its working perfectly for me , are you sure you didnt click on something else?

RoarinRow

#7
July 05, 2006, 07:35:39 PM
Quote from: Alan S on July 05, 2006, 06:15:44 PM
Quote from: RoarinRow on July 05, 2006, 05:44:11 PM
I just tested the drop down menu on your site and it didn't change the time.  Can the date/time wrap around?

its working perfectly for me , are you sure you didnt click on something else?

Yup positive.   ;)  See attached.  Hawaii is selected, but it still says Greenwich and time is still the same.

SMF 2.0 RC3
TP 1.0 beta 5-1
Wordpress 3.0

alan s

#8
July 05, 2006, 08:07:07 PM
your not using the arrow keys by any chance to select the timezones?

RoarinRow

#9
July 05, 2006, 08:11:37 PM
Quote from: Alan S on July 05, 2006, 08:07:07 PM
your not using the arrow keys by any chance to select the timezones?

Nope not using the arrows, but I noticed that when I chose a time zone I get an IE error message icon on the bottom left of the screen.  When I double click it I get the following message.

SMF 2.0 RC3
TP 1.0 beta 5-1
Wordpress 3.0
Print
Go Up Pages1 2 All
User actions