// Server Clock - WINTER - GMT
// *********************************************** SETTINGS ****************************************
S1clocksize="80";
// Summer - BST settings
S1clockface="SS21.gif";
S1hourhandcolor = "dodgerblue";
S1minutehandcolor = "black";
S1secondhandcolor = "red";
S1clocktextcolor = "black";
// Winter - GMT settings
S1clockface="WS21.gif";
S1hourhandcolor = "blue";
S1minutehandcolor = "black";
S1secondhandcolor = "red";
S1clocktextcolor = "red"
S1hourhandcolorOutline = S1hourhandcolor; // change outline to a valid color if required - Probably only useful on large clock.
S1minutehandcolorOutline = S1minutehandcolor; // change outline to a valid color if required - Probably only useful on large clock.
S1secondhandcolorOutline = S1secondhandcolor; // change outline to a valid color if required - Probably only useful on large clock.
// ******************************************* End of SETTINGS *************************************
// ************************************** Get the Server Time Values *******************************
var S1dayarray=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
var S1montharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December")
var S1serverdate=new Date(S1currenttime)
function S1padlength(what){
var output=(what.toString().length==1)? "0"+what : what
return output
}
function S1changeHour() {
var S1serverDate = new Date(S1currenttime);
S1serverDatePlusOne = new Date(S1serverDate.setHours(S1serverDate.getHours()+1));
S1serverdate = S1serverDatePlusOne;
}
function S1swaptext(S1TodaysStatus) {
var S1serverdateStringTemp = S1serverdate
var S1serverdateString = S1serverdateStringTemp.toString();
return S1TodaysStatus;
}
S1dateDisplay = S1dayarray[S1serverdate.getDay()]+" "+S1montharray[S1serverdate.getMonth()]+" "+S1padlength(S1serverdate.getDate())+", "+S1serverdate.getFullYear();
// ******************************** testing ground ***********************************
// Method 1 - Comparing UTC to Server GMT - (in the summer gives -60 - in the winter gives 0)
// var S1ddd1 = S1serverdate;
// var S1nnn1 = S1ddd1.getTimezoneOffset();
// var S1nnn1 = "-60"; // Force BST for testing only
// S1TodaysStatus = "GMT";
// if (S1nnn1=="-60") {
// S1TodaysStatus = "BST";
// S1changeHour();
// }
// Info regarding confusing output from server or PC Clock -
// GMT+0000 (GMT Standard Time) - Winter ie. GMT ie. Standard Time !!
// GMT+0100 (GMT Standard Time) - Summer ie. BST ie. Daylight Time !!
// These are the fixed output from both pc local "new Date();" and Server times.
// BST is clearly misleading (Standatd Time) and should be Daylight Time.
// Method 3 - Using GMT+0000 (GMT Daylight Time) Javasript to determine BST / GMT
var S1serverdateLoopStr = S1serverdate.toString();
var isit = S1serverdateLoopStr.search("0000");
if (isit != (-1)) {
S1status="GMT";
}
var isit = S1serverdateLoopStr.search("0100");
if (isit != (-1)) {
S1status="BST";
}
S1TodaysStatus = S1status;
// S1TodaysStatus ="BST"; // Force BST for testing
if (S1TodaysStatus=="BST") {
// S1changeHour();
}
// END of Methods
// ******************************** end of testing ground ***********************************
document.write('
');
document.write('
');
var S1canvas = document.getElementById('S1myCanvas');
var S1context = S1canvas.getContext('2d');
var S1clockImage = new Image();
var S1clockImageLoaded = false;
S1clockImage.onload = function(){
S1clockImageLoaded = true;
}
S1clockImage.src = '/' + LocalImageFolder + '/clockfaces/' + S1clockface;
function S1addBackgroundImage(){
S1context.drawImage(S1clockImage, S1canvas.width/2 * -1 ,S1canvas.height/2 * -1,S1canvas.width, S1canvas.height);
}
function S1degreesToRadians(S1degrees) {
return (Math.PI / 180) * S1degrees
}
function S1drawHourHand(S1theDate){
var S1hours = S1theDate.getHours() + S1theDate.getMinutes() / 60;
var S1degrees = (S1hours * 360 / 12) % 360;
S1context.save();
S1context.fillStyle = S1hourhandcolor;
S1context.strokeStyle = S1hourhandcolorOutline;
S1context.rotate( S1degreesToRadians(S1degrees));
S1drawHand(100, 10, 3);
S1context.restore();
}
function S1drawMinuteHand(S1theDate){
var S1minutes = S1theDate.getMinutes() + S1theDate.getSeconds() / 60;
S1context.save();
S1context.fillStyle = S1minutehandcolor;
S1context.strokeStyle = S1minutehandcolorOutline;
S1context.rotate( S1degreesToRadians(S1minutes * 6));
S1drawHand(140, 10, 5);
S1context.restore();
}
function S1drawSecondHand(S1theDate){
var S1seconds = S1theDate.getSeconds();
S1context.save();
S1context.fillStyle = S1secondhandcolor;
S1context.globalAlpha = 0.8; // transparency
S1context.strokeStyle = S1secondhandcolorOutline;
S1context.rotate( S1degreesToRadians(S1seconds * 6));
S1drawHand(150, 8, 8); // S1length, S1thickness, S1shadowOffset
S1context.restore();
}
function S1drawHand(S1size, S1thickness, S1shadowOffset){
S1thickness = S1thickness || 4;
S1context.shadowColor = '#555';
S1context.shadowBlur = 10;
S1context.shadowOffsetX = S1shadowOffset;
S1context.shadowOffsetY = S1shadowOffset;
S1context.beginPath();
S1context.moveTo(0,0); // center
S1context.lineTo(S1thickness *-1, -10);
S1context.lineTo(0, S1size * -1);
S1context.lineTo(S1thickness,-10);
S1context.lineTo(0,0);
S1context.fill();
S1context.stroke();
}
function S1writeBrandName(S1theDate){
S1context.font = 'bold 40pt Arial';
S1context.fillStyle = S1clocktextcolor;
var S1brandName = 'UK ' + S1TodaysStatus;
var S1brandNameSize = S1context.measureText(S1brandName);
S1bottomhours = S1theDate.getHours();
if (S1bottomhours > 14 && S1bottomhours < 21) {
S1context.fillText(S1brandName, 0 - S1brandNameSize.width / 2, -50); // at top
}
else {
if (S1bottomhours < 3 || S1bottomhours > 8) {
S1context.fillText(S1brandName, 0 - S1brandNameSize.width / 2, 95); // at bottom
}
else
S1context.fillText(S1brandName, 0 - S1brandNameSize.width / 2, -50); // at top
}
}
function S1createClock(){
// ******************************** in-the-loop testing ground ***********************************
S1swaptext(S1TodaysStatus);
// S1changedinfo = S1serverdate;
// document.getElementById("S1changedTimeandDate").innerHTML = S1changedinfo
//
// S1datestring = S1dayarray[S1serverdate.getDay()]+" "+S1montharray[S1serverdate.getMonth()]+" "+S1padlength(S1serverdate.getDate())+", "+S1serverdate.getFullYear();
// S1datestring = S1dayarray[S1serverdate.getDay()]+" "+S1montharray[S1serverdate.getMonth()]+" "+S1padlength(S1serverdate.getDate())+", "+S1serverdate.getFullYear()+" "+S1padlength(S1serverdate.getSeconds());
// document.getElementById("S1changedDate").innerHTML = S1datestring
// ******************************** end of in-the-loop testing ground ***********************************
S1serverdate.setSeconds(S1serverdate.getSeconds()+1)
S1addBackgroundImage();
var S1theDate = S1serverdate;
S1drawHourHand(S1theDate);
S1drawMinuteHand(S1theDate);
S1drawSecondHand(S1theDate);
S1writeBrandName(S1theDate);
}
function S1clockApp(){
if(!S1clockImageLoaded){
setTimeout('S1clockApp()', 100);
return;
}
S1context.translate(S1canvas.width/2, S1canvas.height/2);
S1createClock();
setInterval('S1createClock()', 1000)
}
S1clockApp();
S1canvas.style.width = S1canvas.style.height= S1clocksize + 'px';
S1titlealt = S1dateDisplay + ' UK Time ('+ S1TodaysStatus + ')';
document.write('
');
// document.write('
');
document.write('
');
document.write('
');
document.write('
');