$(function(){
	function a2r(gradi) {
		return gradi*2*Math.PI/360.0;
	}
	function p2c (gradi, cx, cy, raggio) {
		var angolo = a2r(gradi);
		return { x:cx-Math.sin(angolo)*raggio, y:cy-Math.cos(angolo)*raggio, r:raggio, a:angolo };
	}

	var logotipia = $("<img>")
		.attr({
			src: "../img/logotipia.png"
		})
		.css({
			position: "absolute",
			top: "50%",
			left: "50%",
				marginLeft: -168,
				marginTop: 39,
			display: "none"
		})
		.appendTo($("body"));

	var logo_statico = $("<img>")
		.attr({
			src: "../img/logo.png"
		})
		.css({
			position: "absolute",
			top: "50%",
			left: "50%",
				marginLeft: -168,
				marginTop: 39,
			display: "none"
		})
		.appendTo($("body"));

	function objectLayer(p) {
		this.canvas = $("<canvas>")
			.attr({
				width: 400,
				height: 400
			})
			.css({
				position: "absolute",
				top: "50%",
				left: "50%",
				marginLeft: -200,
				marginTop: -200,
				opacity: 0.0
			})
			.appendTo(p);

		if (this.canvas[0].getContext === undefined)
			return null;

		this.ctx = this.canvas[0].getContext("2d");
		this.angolo=0;
		this.zoom=1.0;

		this.fadeTo = function(t,v,f) { 
			return this.canvas.fadeTo(t,v,f) 
		};

		this.rotateTo = function(t,to_a, f) {
			var k=(to_a-this.angolo)/(t/100);
			var me=this;

			var h=setInterval(function(){
				me.angolo += k;
				var ultimo=false;
				if (
					((k>0)&&(me.angolo>=to_a)) ||
					((k<0)&&(me.angolo<=to_a))
				) {
					clearInterval(h);
					me.angolo = to_a;
					ultimo = true;
				}
				me.paint();
				if (ultimo && $.isFunction(f))
					f();
			},100);
		}

		this.zoomTo = function(t,to_s,f)  {
			var k=(to_s-this.zoom)/(t/100);
			var me=this;

			var h=setInterval(function(){
				me.zoom += k;
				var ultimo=false;
				if (
					((k>0)&&(me.zoom>=to_s)) ||
					((k<0)&&(me.zoom<=to_s))
				) {
					clearInterval(h);
					me.zoom = to_s;
					ultimo = true;
				}
				me.paint();
				if (ultimo && $.isFunction(f))
					f();
			},100);
		}

		this.paint = function() {
			var c=this.ctx;

			c.clearRect(-200,-200,400,400);
			c.save();

			c.scale(this.zoom,this.zoom);
			c.rotate(a2r(this.angolo));

			this.draw();

			c.restore();
		}

		this.draw = function() {};

		this.ctx.translate(200,200);

		return this;

	};

	function introAnimata(p) {
		var cerchio1 = new (function(p){
			var base = new objectLayer(p);

			$.extend(this, base);
			var c=this.ctx;

			this.draw = function() {
				c.fillStyle = "#FFFFFF";

				c.beginPath();
				c.arc(0, 0, 200, a2r(235), a2r( 85), false);
				c.arc(0, 0, 173, a2r( 85), a2r(235), true);
				c.closePath();
				c.fill();

				c.beginPath();
				c.arc(0, 0, 200, a2r( 95), a2r(225), false);
				c.arc(0, 0, 173, a2r(225), a2r( 95), true);
				c.closePath();
				c.fill();
			}

			return this;
		})(p);

		var cerchio2 = new (function(p){
			$.extend(this, new objectLayer(p));
			var c=this.ctx;

			this.draw = function() {
				c.fillStyle = "#000000";

				c.beginPath();
				c.arc(0, 0, 146, a2r( -5), a2r( 95), true);
				c.arc(0, 0, 119, a2r( 95), a2r( -5), false);
				c.closePath();
				c.fill();

				c.beginPath();
				c.arc(0, 0, 146, a2r( 85), a2r(  5), true);
				c.arc(0, 0, 119, a2r(  5), a2r( 85), false);
				c.closePath();
				c.fill();
			}
			return this;

		})(p);
		
		var cerchio3 = new (function(p){
			$.extend(this, new objectLayer(p));
			var c=this.ctx;

			this.draw = function(a) {
				c.fillStyle = "#FFFFFF";

				c.beginPath();
				c.arc(0, 0, 88, a2r(142), a2r(118), false);
				c.arc(0, 0, 61, a2r(113), a2r(147), true);
				c.closePath();

				c.fill();
			}

			return this;
		})(p);
		
		cerchio1.paint();
		cerchio2.paint();
		cerchio3.paint();

		cerchio1.fadeTo(1000,1.0,function(){
			cerchio2.fadeTo(1000,1.0,function(){
				cerchio3.fadeTo(1000,1.0,function(){
					cerchio1.rotateTo(1000,225);
					cerchio2.rotateTo(1000, -225);
					cerchio3.rotateTo(1000, 225, function() {
						cerchio1.zoomTo(1000,0.2);
						cerchio2.zoomTo(1000,0.2);
						cerchio3.zoomTo(1000,0.2, function() {
							logotipia.fadeIn(2000);
							setTimeout(function() {
								$("canvas").fadeOut(1500);
								logotipia.fadeOut(1500, mostraSito);
							},2000);
						});
					});
				});
			});
		});
	
	};

	function mostraSito() {
		$("div.sito,body>div.tratto.orizzontale.pagina").css({overflow: "visible"}).fadeIn(1500);
	};

	$("div.sito,body>div.tratto.orizzontale.pagina").css({display: "none", visibility: "visible"});

	if (!!document.createElement('canvas').getContext)
		introAnimata($("body"));
	else
		mostraSito();
});