/*Overlay Styles*/
var OS = { 
			position: 'absolute',
			top: '0',
			left: '0',
			zIndex: '9998',
			width: '100%',
			height: '900px',
			backgroundColor: '#2a3e55',
			opacity: '0.6',
			filter: 'alpha(opacity=60)'
		};
/*Box Styles*/
var BS = {
			position: 'absolute',
			top:'75px',
			left:'50%',
			backgroundColor:'#fff',
			zIndex: '9999',
			width: '442px',
			textAlign : 'left',
			marginLeft: '-200px'
		};
/*Header Styles*/
var HS = {
			position: 'relative',
			padding: '10px 100px 10px 10px',
			height:'20px',
			background : 'url(\'/static/imgs/overlays/bck_header.png\') repeat-x top left',
			color: '#fff',
			fontSize : '1.3em'
		};
/*Close Styles*/
var CS ={
			position:'absolute',
			top:'8px',
			right:'10px',
			padding: '4px 22px 4px 0',
			textDecoration : 'none',
			color: '#fff',
			background : 'url(\'/static/imgs/overlays/close_button.png\') no-repeat center right'
		};
/*Loading Styles*/
var LS={
		margin:'10px',
		color: '#888',
		verticalAlign: 'middle'
		};
		
var Box = Class.create({
	initialize : function(id, message,params){
	
		this.hideFS();
		if(params && params.onClose){
			this.onClose = params.onClose;			
		}
		this.id/*string*/ = id;
		this.message/*string*/ =  (typeof(message) == 'string') ? message: '11870.com';
				
		var body_tag = document.getElementsByTagName('body').item(0);
		
		/*draw overlay*/
		var overlay = new Element('div',{id:'overlay'});
		OS.height = $(body_tag).getHeight() + "px";
		overlay.setStyle(OS);
		
		/*draw box*/
		var box	= new Element('div',{id:'container_' + this.id});
		BS.top = document.viewport.getScrollOffsets()[1] > 0 ? (75 + document.viewport.getScrollOffsets()[1]) + "px" : "75px";
		box.setStyle(BS);
		
		/*draw box content*/
		var header = new Element('h2',{id:'header_' + this.id, className: 'modal-title'});
		header.setStyle(HS);	
		header.innerHTML = this.message;
		
		/*draw closer*/
		var closer = new Element('a',{id:'closer_'+ this.id, href:'#'});
		closer.innerHTML = _("cerrar");
		closer.setStyle(CS);	
	
		closer.observe('click', this.close.bind(this));
		overlay.observe('click',this.close.bind(this));
		
		/*draw loading thing*/
		var loading = new Element('p',{id:'loading_' + this.id});
		var loadingImage = new Element('img',{src:'/static/imgs/ajax_activity_indicator.gif'});
		loadingImage.style.marginRight = "10px"; //:P
		var loadingText = document.createTextNode(_("un momento por favor..."));
		loading.appendChild(loadingImage);
		loading.appendChild(loadingText);
		loading.setStyle(LS);
		
		var content = new Element('div',{id:this.id});
		content.appendChild(loading);
		
		body_tag.appendChild(overlay);
		
		header.appendChild(closer);
		box.appendChild(header);
		box.appendChild(content);
		body_tag.appendChild(box);
		
		//FIX opacity /pro/xxx/map + street view
		$('overlay').setOpacity('0.6');
		
	},
	setContents: function(contents){
		if(typeof(contents) == 'string'){
			$(this.id).innerHTML = contents;
		}else{
			$(this.id).appendChild(contents);
		}
	},
	contentLoaded: function(){
		var loading = $('loading_' + this.id);
		if(loading){
			loading.remove();
		}
	},
	close : function(e){
		e.stop();
		this.reset();
		if(this.onClose){
			this.onClose();
		}
	}, 
	reset: function(){
		
		$('container_' + this.id).remove();
		$('overlay').remove();

		this.showFS();
			
	},
	hideFS: function(){
		$$('.flash', 'select', 'embed', 'object').each(function(node){
			node.setStyle({position:'absolute', top:'0', left:'-5000em'});
		});
	},
	showFS: function(){
		$$('.flash', 'select', 'embed', 'object').each(function(node){
			node.setStyle({position:'static', top:'0', left:'0'});
		});
	},
	getForm: function(){
		return $(this.id).select('form').first();
	},
	getCancelItem: function(){
		return $(this.id).select('a.cancel-form').first();
	},
	getSubmit: function(){
		return $(this.id).select('form').first().getInputs('submit').first();
	},
	submitGui: function(flag){
		var cancel = this.getCancelItem(), wheel = $('submitting');
		(flag)?this.getSubmit().disable():this.getSubmit().enable();
		if(cancel !== undefined){
			(flag)?cancel.hide():cancel.show();
		}
		if(wheel !== null){
			(wheel.visible())?wheel.hide():wheel.show();
		}
	}
	
});

var ResizableBox = Class.create(Box, {
	resize: function(param){
		if(param.length == 1){
			$('container_' + this.id).setStyle({width: param[0] + "px", marginLeft: "-" + param[0]/2 +"px"});
		}else if (param.length == 2){
			$('container_' + this.id).setStyle({width: param[0] + "px", height: param[1] + "px", marginLeft: "-" + param[0]/2 +"px"});			
		} else {
			return false;
		}
	}
});

var WholikesitBox = Class.create(Box,{
	close : function($super,e){
		OOS.WhoLikesIt.dialog = null;
		return $super(e);
	}
});

var ReloadOnCloseBox = Class.create(Box,{
	close : function(e){
		e.stop();
		window.location.reload();
	}
});

var RemoveParameterLiveOpinionBox = Class.create(Box,{
	close : function($super, e){
		var liveOpinion_req = new Ajax.Request('/services/removeparameter',{
			method:'get',
			onSuccess: function(transport){
				return;
			}	
		});
		return $super(e);
	}
});

var OfferMatildeSignupBox = Class.create(Box,{
	contentLoaded: function($super){
		alert($super);
		$super.contentLoaded();
		OOS.OfferConfirm.initialize();
	},
	resize: function(param){
		if(param.length == 1){
			$('container_' + this.id).setStyle({width: param[0] + "px", marginLeft: "-" + param[0]/2 +"px"});
		}else if (param.length == 2){
			$('container_' + this.id).setStyle({width: param[0] + "px", height: param[1] + "px", marginLeft: "-" + param[0]/2 +"px"});			
		} else {
			return false;
		}
	}

});