function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
  var rv = -1; // Return value assumes failure.
  if (navigator.appName == 'Microsoft Internet Explorer')
  {
    var ua = navigator.userAgent;
    var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    if (re.exec(ua) != null)
      rv = parseFloat( RegExp.$1 );
  }
  return rv;
}
function checkCanvas()
{
	var canvas = true;
	var ver = getInternetExplorerVersion();
	if ( ver > -1 )
	{
		if ( ver >= 9.0 ) 
		canvas = true
		else
		canvas = false;
	}
	return canvas;
}

var Loading;
if(checkCanvas()){

Loading = function(containerName){

	this.isOpen = false;
	this.bollonzo = $('bollonzo').setStyle('display', 'block');
	this.elements = $$('#bollonzo-bordo, #bollonzo-badari, #bollonzo-alloro, #bollonzo-b, #bollonzo-lighting').fade('hide');
	this.spinnerEl = $('bollonzo-spinner');
	this.canvasContainer = $(containerName);
	this.initCanvas(this.canvasContainer);
	this.canvas.graphics.fillStyle = '#fff';
	this.radius = 0;
	this.onResize();

	this.canvasContainer.setStyle('background', 'none');
};

Loading.prototype.initCanvas = function(){

	var self = this;

	this.canvas = new Element('canvas').inject(this.canvasContainer);
	this.canvas.graphics = this.canvas.getContext('2d');
	this.canvas.graphics.fillStyle = '#000';

	window.addEvent('resize', function(){
		clearTimeout(self.resizeTimer);
		self.resizeTimer = self.onResize.delay(200, self);
	});
};

Loading.prototype.onResize = function(){

	this.winSize = window.getSize();
	this.canvas.width  = this.winSize.x;
	this.canvas.height = this.winSize.y;
	this.canvas.center = { x: parseInt(this.canvas.width * .5), y: parseInt(this.canvas.height * .5) };
	this.draw();

};

Loading.prototype.draw = function(){

	this.canvas.graphics.clearRect(0, 0, this.canvas.width, this.canvas.height);
	this.canvas.graphics.beginPath();
	this.canvas.graphics.arc(this.canvas.center.x, this.canvas.center.y, this.radius, 0, Math.PI * 2, true);
	this.canvas.graphics.fill();
};

Loading.prototype.initOpen = function(){

	var self = this;

	this.isOpen = true;
	this.bollonzo.fade('show');
	this.canvas.fade('show');
	this.canvasContainer.setStyle('display', '');

	$('bollonzo-alloro').fade('show');
	this.radius = Math.sqrt(this.winSize.x * this.winSize.x + this.winSize.y + this.winSize.y);
	this.spinnerRemover = this.createSpinner('bollonzo-spinner', 20, 20, 20, 4, '#f4e6d4');
	this.draw();
};

Loading.prototype.open = function(callback){

	if(this.isOpen) return callback();

	var self = this;

	this.bollonzo.fade('show');
	this.canvas.fade('show');
	this.canvasContainer.setStyle('display', '');

	JSTweener.addTween(self, {
		time: 1,
		transition: 'easeInOutExpo',
		onComplete: function() {

			$('bollonzo-alloro').fade(1);
			self.spinnerRemover = self.createSpinner('bollonzo-spinner', 20, 20, 20, 4, '#f4e6d4');

			JSTweener.addTween(self, {
				time: 1,
				transition: 'easeInExpo',
				onComplete: function() { callback && callback(); },
				onUpdate: self.draw.bind(self),
				radius: Math.sqrt(self.winSize.x * self.winSize.x + self.winSize.y + self.winSize.y)
			});
		},
		onUpdate: self.draw.bind(self),
		radius: 130
	});

	this.isOpen = true;
};

Loading.prototype.initClose = function(callback){

	var self = this;

	this.isOpen = false;

	JSTweener.addTween(this, {
		time: 1,
		transition: 'easeOutExpo',
		onComplete: function() {

			self.radius = 0.1;
			self.draw.delay(1000, self);

			self.elements.each(function(item, index){
				item.fade.delay(index * 200, item, 1);
			});

			self.spinnerRemover && self.spinnerRemover();
			self.spinnerRemover = undefined;

			callback();
		},
		onUpdate: this.draw.bind(this),
		radius: 130
	});
};

Loading.prototype.close = function(callback){

	if(!this.isOpen) return;

	var self = this;

	JSTweener.addTween(this, {
		time: 1,
		transition: 'easeOutExpo',
		onComplete: function() {
			self.canvasContainer.setStyle.delay(200, self.canvasContainer, ['display', 'none']);
			self.bollonzo.fade('hide');
			callback && callback();
		},
		onUpdate: this.draw.bind(this),
		radius: 0.1
	});

	(function(){
		$('bollonzo-alloro').fade(0);
		self.spinnerRemover && self.spinnerRemover();
		self.spinnerRemover = undefined;
	}).delay(200);

	this.isOpen = false;
};

Loading.prototype.createSpinner = function(holderid, R1, R2, count, stroke_width, colour) {

	this.spinnerEl.fade('hide');

	var sectorsCount = count || 12,
	color = colour || "#fff",
	width = stroke_width || 15,
	r1 = Math.min(R1, R2) || 35,
	r2 = Math.max(R1, R2) || 60,
	cx = r2 + width,
	cy = r2 + width,
	r = Raphael(holderid, r2 * 2 + width * 2, r2 * 2 + width * 2),

	sectors = [],
	opacity = [],
	beta = 2 * Math.PI / sectorsCount,

	pathParams = {stroke: color, "stroke-width": width, "stroke-linecap": "round"};

	Raphael.getColor.reset();

	for (var i = 0; i < sectorsCount; i++) {
		var alpha = beta * i - Math.PI / 2,
		cos = Math.cos(alpha),
		sin = Math.sin(alpha);
		opacity[i] = 1 / sectorsCount * i;
		sectors[i] = r.path([["M", cx + r1 * cos, cy + r1 * sin], ["L", cx + r2 * cos, cy + r2 * sin]]).attr(pathParams);
		if (color == "rainbow") {
			sectors[i].attr("stroke", Raphael.getColor());
		}
	}

	var tick;

	(function ticker() {
		opacity.unshift(opacity.pop());
		for (var i = 0; i < sectorsCount; i++) {
			sectors[i].attr("opacity", opacity[i]);
		}
		r.safari();
		tick = setTimeout(ticker, 1000 / sectorsCount);
	})();

	this.spinnerEl.fade(1);

	return function () {
		clearTimeout(tick);
		r.remove();
	};
};

} else {
	Loading = function(containerName){

		this.isOpen = false;
		this.bollonzo = $('bollonzo').setStyle('display', 'block');
		this.elements = $$('#bollonzo-bordo, #bollonzo-badari, #bollonzo-alloro, #bollonzo-b, #bollonzo-lighting').fade('hide');
		this.canvasContainer = $(containerName);
		this.canvasContainer.setStyle('background', 'none');
	};
	Loading.prototype.initOpen = function(){

		var self = this;

		this.isOpen = true;
		this.bollonzo.fade('show');
		this.canvasContainer.setStyle('display', '');

		$('bollonzo-alloro').fade('show');
	};
	Loading.prototype.open = function(callback){

		if(this.isOpen) return callback();

		this.bollonzo.fade('show');
		this.canvasContainer.setStyle('display', '');
		$('bollonzo-alloro').fade(1);

		callback && callback();

		this.isOpen = true;
	};
	Loading.prototype.initClose = function(callback){

		var self = this;

		this.isOpen = false;
		
		self.elements.each(function(item, index){
			item.fade.delay(index * 200, item, 1);
		});

		callback();
	};
	Loading.prototype.close = function(callback){

		if(!this.isOpen) return;

		var self = this;

		$('bollonzo-alloro').fade(0);
		self.canvasContainer.setStyle.delay(200, self.canvasContainer, ['display', 'none']);
		self.bollonzo.fade('hide');
		callback && callback();

		this.isOpen = false;
	};

}