var letterDays = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ];
var letterMonths = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];

function pad(input, setLength, padding) {
	padding = padding.toString();
	var output = input.toString();
	while(output.length < setLength ) output = padding + output;
	return output;
}

$(document).ready(function() {
	setInterval(function() {
	$("#clock").css("display", "block");
		var d = new Date();

		// Fix for 24h time
		if(d.getHours() > 12) { 
			var hours = d.getHours() - 12;
			var suffix = " PM";
		} else {
			var hours = d.getHours();
			var suffix = " AM";
		}

		$("#date").html("" + letterMonths[d.getMonth()] + " " + d.getDate() + ", " + d.getFullYear() + "");
		$("#time").html("" + letterDays[d.getDay()] + ", " + pad(hours, 2, 0) + ":" + pad(d.getMinutes(), 2, 0) + suffix);

		var srotate = "rotate(" + (d.getSeconds() * 6) + "deg)";
		var mrotate = "rotate(" + (d.getMinutes() * 6) + "deg)";
		var hrotate = "rotate(" + (hours * 30 + (d.getMinutes() / 2)) + "deg)";

		$("#secondHand").css("-webkit-transform", srotate );
		$("#secondHand").css("-moz-transform", srotate );
		$("#secondHand").css("transform", srotate );

		$("#minuteHand").css("-webkit-transform", mrotate );
		$("#minuteHand").css("-moz-transform", mrotate );
		$("#minuteHand").css("transform", mrotate );

		$("#hourHand").css("-webkit-transform", hrotate );
		$("#hourHand").css("-moz-transform", hrotate );
		$("#hourHand").css("transform", hrotate );
      }, 1000);
});