var d = new Date()
var gmtHours = d.getTimezoneOffset()/60;
var daylightSavings = 0;

function update_clock(width){
var now = new Date();
//var hours = now.getHours() + gmtHours;
var hours = (now.getHours() + gmtHours) + daylightSavings; //UK daylight savings
var minutes = now.getMinutes();
var seconds = now.getSeconds();
hour_hand.rotate(30*hours+(minutes/2.5), width/2, width/2);
minute_hand.rotate(6*minutes, width/2, width/2);
second_hand.rotate(6*seconds, width/2, width/2);
}

function draw_clock(width, fillColor, strokeWidth, strokeColor, pinWidth, pinColor, hourHandLengh, hourHandColor, minuteHandLengh, minuteHandColor, secondHandLengh, secondHandExceeding, secondHandColor){
canvas = Raphael("clock_uk",width, width);
var clock = canvas.circle(width/2,width/2,22.5);
clock.attr({"fill":fillColor,"stroke":strokeColor,"stroke-width":strokeWidth})
hour_hand = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-hourHandLengh)+"");
hour_hand.attr({stroke: hourHandColor, "stroke-width": 1});
minute_hand = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-minuteHandLengh)+"");
minute_hand.attr({stroke: minuteHandColor, "stroke-width": 1});
second_hand = canvas.path("M"+width/2+" "+((width/2)+secondHandExceeding)+"L"+width/2+" "+((width/2)-secondHandLengh)+"");
second_hand.attr({stroke: secondHandColor, "stroke-width": 1});
var pin = canvas.circle(width/2, width/2, pinWidth);
pin.attr({"fill": pinColor,"stroke": pinColor});
update_clock(width)
setInterval("update_clock("+width+")",1000);
}

function update_clock2(width){
var now = new Date();
var hours = (now.getHours() + gmtHours) - 8 + daylightSavings;
var minutes = now.getMinutes();
var seconds = now.getSeconds();
hour_hand2.rotate(30*hours+(minutes/2.5), width/2, width/2);
minute_hand2.rotate(6*minutes, width/2, width/2);
second_hand2.rotate(6*seconds, width/2, width/2);
}

function draw_clock2(width, fillColor, strokeWidth, strokeColor, pinWidth, pinColor, hourHandLengh, hourHandColor, minuteHandLengh, minuteHandColor, secondHandLengh, secondHandExceeding, secondHandColor){
canvas = Raphael("clock_us",width, width);
var clock = canvas.circle(width/2,width/2,22.5);
clock.attr({"fill":fillColor,"stroke":strokeColor,"stroke-width":strokeWidth})
hour_hand2 = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-hourHandLengh)+"");
hour_hand2.attr({stroke: hourHandColor, "stroke-width": 1});
minute_hand2 = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-minuteHandLengh)+"");
minute_hand2.attr({stroke: minuteHandColor, "stroke-width": 1});
second_hand2 = canvas.path("M"+width/2+" "+((width/2)+secondHandExceeding)+"L"+width/2+" "+((width/2)-secondHandLengh)+"");
second_hand2.attr({stroke: secondHandColor, "stroke-width": 1});
var pin = canvas.circle(width/2, width/2, pinWidth);
pin.attr({"fill": pinColor,"stroke": pinColor});
update_clock2(width)
setInterval("update_clock2("+width+")",1000);
}

function update_clock3(width){
var now = new Date();
var hours = (now.getHours() + gmtHours) + 1 + daylightSavings;
var minutes = now.getMinutes();
var seconds = now.getSeconds();
hour_hand3.rotate(30*hours+(minutes/2.5), width/2, width/2);
minute_hand3.rotate(6*minutes, width/2, width/2);
second_hand3.rotate(6*seconds, width/2, width/2);
}

function draw_clock3(width, fillColor, strokeWidth, strokeColor, pinWidth, pinColor, hourHandLengh, hourHandColor, minuteHandLengh, minuteHandColor, secondHandLengh, secondHandExceeding, secondHandColor){
canvas = Raphael("clock_fr",width, width);
var clock = canvas.circle(width/2,width/2,22.5);
clock.attr({"fill":fillColor,"stroke":strokeColor,"stroke-width":strokeWidth})
hour_hand3 = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-hourHandLengh)+"");
hour_hand3.attr({stroke: hourHandColor, "stroke-width": 1});
minute_hand3 = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-minuteHandLengh)+"");
minute_hand3.attr({stroke: minuteHandColor, "stroke-width": 1});
second_hand3 = canvas.path("M"+width/2+" "+((width/2)+secondHandExceeding)+"L"+width/2+" "+((width/2)-secondHandLengh)+"");
second_hand3.attr({stroke: secondHandColor, "stroke-width": 1});
var pin = canvas.circle(width/2, width/2, pinWidth);
pin.attr({"fill": pinColor,"stroke": pinColor});
update_clock3(width)
setInterval("update_clock3("+width+")",1000);
}

function update_clock4(width){
var now = new Date();
var hours = (now.getHours() + gmtHours) + 1 + daylightSavings;
var minutes = now.getMinutes();
var seconds = now.getSeconds();
hour_hand4.rotate(30*hours+(minutes/2.5), width/2, width/2);
minute_hand4.rotate(6*minutes, width/2, width/2);
second_hand4.rotate(6*seconds, width/2, width/2);
}

function draw_clock4(width, fillColor, strokeWidth, strokeColor, pinWidth, pinColor, hourHandLengh, hourHandColor, minuteHandLengh, minuteHandColor, secondHandLengh, secondHandExceeding, secondHandColor){
canvas = Raphael("clock_de",width, width);
var clock = canvas.circle(width/2,width/2,22.5);
clock.attr({"fill":fillColor,"stroke":strokeColor,"stroke-width":strokeWidth})
hour_hand4 = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-hourHandLengh)+"");
hour_hand4.attr({stroke: hourHandColor, "stroke-width": 1});
minute_hand4 = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-minuteHandLengh)+"");
minute_hand4.attr({stroke: minuteHandColor, "stroke-width": 1});
second_hand4 = canvas.path("M"+width/2+" "+((width/2)+secondHandExceeding)+"L"+width/2+" "+((width/2)-secondHandLengh)+"");
second_hand4.attr({stroke: secondHandColor, "stroke-width": 1});
var pin = canvas.circle(width/2, width/2, pinWidth);
pin.attr({"fill": pinColor,"stroke": pinColor});
update_clock4(width)
setInterval("update_clock4("+width+")",1000);
}

function update_clock5(width){
var now = new Date();
var hours = (now.getHours() + gmtHours) + 11 + daylightSavings;
var minutes = now.getMinutes();
var seconds = now.getSeconds();
hour_hand5.rotate(30*hours+(minutes/2.5), width/2, width/2);
minute_hand5.rotate(6*minutes, width/2, width/2);
second_hand5.rotate(6*seconds, width/2, width/2);
}

function draw_clock5(width, fillColor, strokeWidth, strokeColor, pinWidth, pinColor, hourHandLengh, hourHandColor, minuteHandLengh, minuteHandColor, secondHandLengh, secondHandExceeding, secondHandColor){
canvas = Raphael("clock_au",width, width);
var clock = canvas.circle(width/2,width/2,22.5);
clock.attr({"fill":fillColor,"stroke":strokeColor,"stroke-width":strokeWidth})
hour_hand5 = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-hourHandLengh)+"");
hour_hand5.attr({stroke: hourHandColor, "stroke-width": 1});
minute_hand5 = canvas.path("M"+width/2+" "+width/2+"L"+width/2+" "+((width/2)-minuteHandLengh)+"");
minute_hand5.attr({stroke: minuteHandColor, "stroke-width": 1});
second_hand5 = canvas.path("M"+width/2+" "+((width/2)+secondHandExceeding)+"L"+width/2+" "+((width/2)-secondHandLengh)+"");
second_hand5.attr({stroke: secondHandColor, "stroke-width": 1});
var pin = canvas.circle(width/2, width/2, pinWidth);
pin.attr({"fill": pinColor,"stroke": pinColor});
update_clock5(width)
setInterval("update_clock5("+width+")",1000);
}