/*
function rePositionShadows() {
	var boxes = $('.box');
	for(var i in boxes) {
		if(i == Number(i)) {
			var box = boxes[i];

			if(!$(box).hasClass("noshadow")) {
				if(box && box.shadow) box.shadow.rePositionShadow();
			}
		}
	}
}
*/


BoxShadowFrame = function(params) {
	this.boxShadow		= null;
	this.borderLevel	= 0;
	this.borderElements = [];

	if(params) {
		if(params.boxShadow)	{this.boxShadow		= params.boxShadow;}
		if(params.borderLevel)	{this.borderLevel	= params.borderLevel;}
	}

	this.borderElements.push(document.createElement('div'));
	this.borderElements.push(document.createElement('div'));
	this.borderElements.push(document.createElement('div'));
	this.borderElements.push(document.createElement('div'));

	var opacity = ((this.boxShadow.width-this.borderLevel)/20);
	for(var i=0;i<4;i++) {
		$(this.borderElements[i]).css({
			position	: 'absolute',
			display		: "none",
			background	: '#111111',
			opacity		: opacity,
			zIndex		: ((this.boxShadow.nestingLevel*(this.boxShadow.width+1))+500+(this.boxShadow.width-this.borderLevel-1))
		});

		document.body.appendChild(this.borderElements[i]);
	}
};

BoxShadowFrame.prototype = {
	rePosition: function(pos,width,height) {
		var x1 = Math.round(pos.left-this.borderLevel);
		var y1 = Math.round(pos.top-this.borderLevel);
		var x2 = Math.round(width+(this.borderLevel*2));
		var y2 = Math.round(height+(this.borderLevel*2));

		if( (y2 <= 0) || (x2 <= 0) ) return;

		$(this.borderElements[0]).css({
			display	: "block",
			left	: x1+'px',
			top		: y1+1+'px',
			width	:   '1px',
			height	: y2-1+'px'
		});
		$(this.borderElements[1]).css({
			display	: "block",
			left	: x1+'px',
			top		: y1+'px',
			width	: x2-1+'px',
			height	:   '1px'
		});
		$(this.borderElements[2]).css({
			display	: "block",
			left	: x1+1+'px',
			top		: y1+y2-1+'px',
			width	: x2-1+'px',
			height	:   '1px'
		});
		$(this.borderElements[3]).css({
			display	: "block",
			left	: x1+x2-1+'px',
			top		: y1+'px',
			width	:   '1px',
			height	: y2-1+'px'
		});
	},
	hide: function() {
		$(this.borderElements[0]).css({display	: "none"});
		$(this.borderElements[1]).css({display	: "none"});
		$(this.borderElements[2]).css({display	: "none"});
		$(this.borderElements[3]).css({display	: "none"});
	}
};

BoxShadow = function(params) {
	this.box			= null;
	this.borderElements = [];
	this.nestingLevel	= 1;
	this.zIndexOffset	= 0;
	this.width			= 4;

	if(params) {
		if(params.box)			{this.box	= params.box;}
		if(params.width)		{this.width	= params.width;}
	}

	this.calculateNestingLevel();

	$(this.box).css({
		position: 'relative',
		zIndex	: ((this.nestingLevel*(this.width+1))+500+this.width)
	});

	for(var i=0;i<this.width;i++) {
		this.borderElements.push(new BoxShadowFrame({boxShadow: this, borderLevel: i}));
	}

	this.rePositionShadow();
};

BoxShadow.prototype = {
	rePositionShadow: function() {
		var boxPos = $(this.box).offset();
		var boxWidth = $(this.box).width();
		var boxHeight = $(this.box).height();

		for(var i=0;i<this.width;i++) {
			this.borderElements[i].rePosition(boxPos,boxWidth,boxHeight);
		}
	},
	hideShadow: function() {
		for(var i=0;i<this.width;i++) {
			this.borderElements[i].hide();
		}
	},
	calculateNestingLevel: function() {
		this.nestingLevel = 1;

		var parents = $(this.box).parents();
		for(var j in parents) {
			if(j == Number(j)) {
				var parent = parents[j];

				if($(parent).hasClass('box') && !$(parent).hasClass('noshadow')) {this.nestingLevel++;}
			}
		}
	}
};

$(document).ready(function() {
	var useShadows = false;

	if(BrowserDetect.browser == 'Explorer') {
		if(BrowserDetect.version > 6) useShadows = true;
	} else if (BrowserDetect.browser == 'Opera'){
		if(BrowserDetect.version > 9.7) useShadows = true;
	} else {
		useShadows = true;
	}
	
	if(useShadows) {
		var boxes = $('.box');
		for(var i in boxes) {
			if(i == Number(i)) {
				var box = boxes[i];

				if(!$(box).hasClass("noshadow")) {
					box.shadow = new BoxShadow({box: box});
				}
			}
		}

/*
		if(BrowserDetect.browser == 'Explorer') {
			if(BrowserDetect.version > 7) {
				var boxAnchors = $('.box .content a');

				var boxAnchors = $('.box a').hover(
					function() {
						$(this).addClass('ie8Hover');
					},
					function() {
						$(this).removeClass('ie8Hover');
					}
				);
			}
		}
*/
	}
});

$(window).bind('resize', function() {
	rePositionShadows();
});



$(document).ready(function() {
	setTimeout("timedResize()",500);
});

function timedResize() {

	rePositionShadows();
	setTimeout("timedResize()",500);
}