// JavaScript Document
function Box(height,width){
	this.boxHeight = height;
	this.boxWidth = width;
}

Box.prototype.openBox = function(contentURL,el){
		
	var boxBG = new Element('div',{'id':'boxBackground'});
	boxBG.setStyles({'opacity':'0.0'});
	var boxBGFade = boxBG.effects({duration: 1000, transition: Fx.Transitions.Quart.easeOut});
	boxBGFade.start({'opacity':'0.75'});
	$$('body').adopt(boxBG);
	var box = new Element('div',{'id':'boxWrapper'});
	box.setHTML(''+
		'<div id="boxContainer">'+
			'<div id="boxClose_btn"></div>'+
			'<div id="boxUpperLeft"></div>'+
			'<div id="boxTop"></div>'+
			'<div id="boxUpperRight"></div>'+
			
			'<div id="boxLeft"></div>'+
			'<div id="boxMiddle"><img src="assets/images/ajax-loader(3).gif" alt="Loading..."> <span class="loadingText">Loading...</span></div>'+
			'<div id="boxRight"></div>'+
			
			'<div id="boxLowerLeft"></div>'+
			'<div id="boxBottom"></div>'+
			'<div id="boxLowerRight"></div>'+
		'</div>');
	box.setStyles({'left':'-1000px'});
	$$('body').adopt(box);
	$('boxContainer').setStyles({'width':this.boxWidth+30+'px'});
	$('boxTop').setStyles({'width':this.boxWidth+'px'});
	$('boxLeft').setStyles({'height':this.boxHeight+'px'})
	$('boxMiddle').setStyles({'width':this.boxWidth+'px','height':this.boxHeight+'px'});
	$('boxRight').setStyles({'height':this.boxHeight+'px'});
	$('boxBottom').setStyles({'width':this.boxWidth+'px'});
	$('boxClose_btn').setStyles({'left':this.boxWidth+10+'px'});
	
	var boxSlide = box.effects({duration: 1000, transition: Fx.Transitions.Quart.easeOut});
	boxSlide.start({'left':-(this.boxWidth/2)+'px'}).chain(function(){
		var contentRequest = new Ajax(contentURL,{method:'get',update:$('boxMiddle')}).request();
		contentRequest.addEvent('onComplete',function(){
			eval($('script').innerHTML);
		});
	});
	
	$('boxClose_btn').addEvent('click',this.closeBox);
}

Box.prototype.closeBox = function(){
	var boxBG = $('boxBackground');	
	var box = $('boxWrapper');
	
	var boxBGFade = boxBG.effects({duration: 1000, transition: Fx.Transitions.Quart.easeOut});
	boxBGFade.start({'opacity':'0.0'}).chain(function(){
		boxBG.remove();
	});
	var boxSlide = box.effects({duration: 1000, transition: Fx.Transitions.Quart.easeOut});
	boxSlide.start({'left':'-2000px'}).chain(function(){
		box.remove();											
	});
}