// JavaScript Document
<!--
/* //<![CDATA[ */

var Moo3DCircle = new Class({

	Implements: [Events, Options],
	
	options: {
		onStart: Class.empty,
		onComplete: Class.empty,
		onCancel: Class.empty,
		container: 'nav3d',
		useWindowResize: false
	},
	initialize: function(options){
		this.setOptions(options);
		this.checker = null;
		this.objects = $$(this.options.objects);
		this.iL = this.objects.length;
		this.tarX = 0.001;
		this.tarY = 0.001;
		this.RX = 250;
		this.RY = 250;
		this.RZ = 50;
		this.CX = $(this.options.container).offsetWidth*0.5;
		this.CY = $(this.options.container).offsetHeight*0.5;
		this.CZ = 100;
		this.init();
	},
	init: function(){
		$$(this.options.objects).each(function(obj, i){
			obj.addEvent('click', this.clickTo.bind(this, obj));
			obj.addEvent('mouseover', this.over.bind(this, obj));
			obj.x = (2*Math.PI)*(i/this.iL);
			obj.n = 0;
			obj.set('html', '#'+i);
		}, this);
		$(this.options.container).addEvent('mouseenter', this.start.bind(this));
		$(this.options.container).addEvent('mouseleave', this.end.bind(this));
		$(this.options.container).addEvent('mousemove', this.update.bind(this));
		this.process();
	},
	update: function(el){
		this.tarX = (el.client.x-this.CX-$(this.options.container).getPosition().x)/2000;
		this.tarY = (el.client.y-this.CY-$(this.options.container).getPosition().y)/2000;
	},
	start: function(){
		this.checker = this.process.periodical(80, this);
	},
	end: function(){
		$clear(this.checker);
	},
	clickTo: function(o){
		console.info(o.get('html'));
	},
	over: function(o){
		//o.setStyle('margin-left','-50px');
		//o.setStyle('margin-top','-50px');
		//o.setStyle('padding','50px');
	},
	process: function(){
		var s, c, j, m, newL, newT, scale;
		this.objects.each(function(img){
			img.x += this.tarX;
			s = Math.sin(img.x);
			c = Math.cos(img.x);
			img.n += this.tarY;
			j = Math.sin(img.n);
			m = Math.cos(img.n);
			scale = j*s*this.RZ+this.CZ;
			newL = c*this.RX+this.CX-scale*0.5;
			newT = m*s*this.RY+this.CY-scale*0.5;
			img.setStyle('left', newL);
			img.setStyle('height', scale);
			img.setStyle('width', scale);
			img.setStyle('top', newT);
			img.setStyle('zIndex', Math.round((j*s+1)*10));
			img.setStyle('opacity', (j*s+1));
		}, this);
	}
});

/* Init MooFlow3DCircle */
var mf;
window.addEvent('load', function(){
	mf = new Moo3DCircle({
		objects: '#nav3d li'
	});
});
/* //]]> */

