var Clock = new Class({
	Implements: [Options,Events],

	options: {
		hour: {
			show: true,
			color: 'green',
			width: 3,
			length: 20,
			factor: 0.5
		},
		minute: {
			show: true,
			color: 'red',
			width: 2,
			length: 40,
			factor: 0.8
		},
		second: {
			show: true,
			color: 'blue',
			width: 1,
			length: 40,
			factor: 0.8
		},
		offset: 1
	},

	initialize: function(el,options) {
		this.setOptions(options);
		this.el = $(el);

		if(this.el) {
		this.width  = this.el.getSize().x;
		this.height = this.el.getSize().x;
		this.start  = {
			x: Math.round(this.width/2),
			y: Math.round(this.height/2)
		};
		this.options.hour.length    = Math.round(this.width/2 * this.options.hour.factor);
		this.options.minute.length  = Math.round(this.width/2 * this.options.minute.factor);
		this.options.second.length  = Math.round(this.width/2 * this.options.second.factor);

		this.render();
		}
	},

	render: function() {
		this.el.empty();
		var dte         = new Date();
		var thisHour    = dte.getHours() / 12;
		var thisMinute  = dte.getMinutes() / 60;
		var thisSecond  = dte.getSeconds() / 60;

		if(this.options.hour.show) this.showHand(this.options.hour,thisHour);
		if(this.options.minute.show) this.showHand(this.options.minute,thisMinute);
		if(this.options.second.show) this.showHand(this.options.second,thisSecond);

		var delay = this.render.bind(this).delay(1000);
	},

	showHand: function(obj,val) {
		//alert(obj.length);
		var radians = (0.5 - val) * 2 * Math.PI;
		var sine    = Math.sin(radians);
		var cosine  = Math.cos(radians);

		for(var x = 0; x < obj.length; x += this.options.offset) {
			var div = new Element('div',{styles:{position:'absolute',background:obj.color,width:obj.width,height:obj.width}});
			//alert(x/Math.cos(val/360));
			div.setStyle('left',this.start.x  + (x * sine));
			div.setStyle('top',this.start.y   + (x * cosine));

			div.inject(this.el);
		}
	}
});