$(document).ready(function () {var aClock = $('#analog-clock');var clockWidthHeight = aClock.width();
function startClock() {aClock.css({ "height": clockWidthHeight + "px" });aClock.fadeIn();setInterval(function () {rotateHands();}, 200);rotateHands();}
function rotateHands() {var now = getServerTime();
var secondAngle = 360 / 60 * now.getSeconds();
$('#secondHand').rotate(secondAngle, 'abs');
$('#secondHand').css({ "left": (clockWidthHeight - $('#secondHand').width()) / 2 + "px", "top": (clockWidthHeight - $('#secondHand').height()) / 2 + "px" }); //set x and y pos
var minuteAngle = 360 / 60 * now.getMinutes(); //turn the time into angle
$('#minuteHand').rotate(minuteAngle, 'abs'); //set the hand angle
$('#minuteHand').css({ "left": (clockWidthHeight - $('#minuteHand').width()) / 2 + "px", "top": (clockWidthHeight - $('#minuteHand').height()) / 2 + "px" }); //set x and y pos
var hourAngle = 360 / 12 * now.getHours(); //turn the time into angle
$('#hourHand').rotate((hourAngle + minuteAngle / 12) % 360, 'abs'); //set the hand angle
$('#hourHand').css({ "left": (clockWidthHeight - $('#hourHand').width()) / 2 + "px", "top": (clockWidthHeight - $('#hourHand').height()) / 2 + "px" }); //set x and y pos
};startClock();});
jQuery.fn.rotate = function (angle, whence) {
var p = this.get(0);if (!whence) {p.angle = ((p.angle == undefined ? 0 : p.angle) + angle) % 360;} else { p.angle = angle;}
if (p.angle >= 0) {var rotation = Math.PI * p.angle / 180;} else {var rotation = Math.PI * (360 + p.angle) / 180;}
var costheta = Math.cos(rotation);var sintheta = Math.sin(rotation);
if (document.all && !window.opera) {
var canvas = document.createElement('img');canvas.src = p.src;canvas.height = p.height;canvas.width = p.width;canvas.style.filter = "progid:DXImageTransform.Microsoft.Matrix(M11=" + costheta + ",M12=" + (-sintheta) + ",M21=" + sintheta + ",M22=" + costheta + ",SizingMethod='auto expand')";} else {
        var canvas = document.createElement('canvas');
        if (!p.oImage) {
            canvas.oImage = new Image();
            canvas.oImage.src = p.src;
        } else {canvas.oImage = p.oImage;}
        canvas.style.width = canvas.width = Math.abs(costheta * canvas.oImage.width) + Math.abs(sintheta * canvas.oImage.height);
        canvas.style.height = canvas.height = Math.abs(costheta * canvas.oImage.height) + Math.abs(sintheta * canvas.oImage.width);
        var context = canvas.getContext('2d');
        context.save();
        if (rotation <= Math.PI / 2) {
            context.translate(sintheta * canvas.oImage.height, 0);
        } else if (rotation <= Math.PI) {
            context.translate(canvas.width, -costheta * canvas.oImage.height);
        } else if (rotation <= 1.5 * Math.PI) {context.translate(-costheta * canvas.oImage.width, canvas.height);} else {
            context.translate(0, -sintheta * canvas.oImage.width);
        }
        context.rotate(rotation);
        context.drawImage(canvas.oImage, 0, 0, canvas.oImage.width, canvas.oImage.height);
        context.restore();
    }
    canvas.id = p.id;
    canvas.angle = p.angle;
    p.parentNode.replaceChild(canvas, p);
}
jQuery.fn.rotateRight = function (angle) {this.rotate(angle == undefined ? 90 : angle);}
jQuery.fn.rotateLeft = function (angle) {this.rotate(angle == undefined ? -90 : -angle);}