/**
 * @name		-	ModalDialog
 * @desc		-	will be used to create and handle all modal dialog boxes and overlays
 * @version		-	1.0.0 - created on 08-19-2010
 * @replaces	-	Will replace the use of mylightbox, in favor of this more flexible class
 * @author		-	John Wamer
 */

function ModalDialog(){

	this.dialog			=	null;					//main modal element (div) id
	this.overlay		=	null;					//id of overlay element (div)
	this.overlay_class	=	'modal-overlay';		//class of overlay							(added 11-15-2010)
	this.dialog_h		=	250;					//height of modal dialog
	this.dialog_w		=	450;					//width of modal dialog
	this.dialog_top		=	null;					//distance from top
	this.dialog_left	=	null;					//distance from left
	this.overlay_h		=	null;					//height of overlay
	this.overlay_w		=	null;					//width of overlay
	
	this.button_id		=	null;
	this.button_value	=	null;
	this.button_id		=	null;
	this.button_action	=	null;
	
	this.dialog_msg		=	'Processing Request, Please Wait';
	
	this.overlay_zindex	=	25;
	

	
	
	this.buildOverlay	=	function(){
	
		this.height		=	null;	//will hold viewport height
		this.width		=	null;	//will hold viewport width
		
		 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
	 
	 		if (typeof window.innerWidth != 'undefined'){
	 		
	      		this.width	=	viewportwidth = window.innerWidth;
	      		this.height	=	viewportheight = window.innerHeight;
	      		
			}
			
		// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
	
			else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth !='undefined' && document.documentElement.clientWidth != 0){
	       		
	       		this.width = document.documentElement.clientWidth;
	       		this.height = document.documentElement.clientHeight;
	       		
			}
	
	 	// older versions of IE
	 
			else{
			
				this.width = document.getElementsByTagName('body')[0].clientWidth;
				this.height = document.getElementsByTagName('body')[0].clientHeight;
			
			}
		
		//set actual height/width for overlay	
		this.overlay_h		=	this.height;
		this.overlay_w		=	this.width;
		
		//now its time to build html and append to body for overlay
		var body			=	document.getElementsByTagName('body')[0];
		var overlay_div		=	document.createElement('div');
		
		overlay_div.id		=	this.overlay;
		overlay_div.setAttribute('id',this.overlay);
		overlay_div.setAttribute('class',this.overlay_class);
		
		body.appendChild(overlay_div);
		
		overlay_div.style.zIndex	=	this.overlay_zindex;	
		
		
		var object				=	document.getElementById(this.overlay);
		object.style.width		=	this.overlay_w+'px';
		object.style.height		=	this.overlay_h+'px';


	
	}//end function
	
	
	this.buildDialog			=	function(){

		if(this.dialog_top == null){
			this.dialog_top				=	((this.overlay_h - this.dialog_h) / 2);	//pixels from top edge
		}
		if(this.dialog_left == null){
			this.dialog_left				=	((this.overlay_w - this.dialog_w) / 2);	//pixels from left edge
		}
		
		//now its time to build html and append to body for dialog
		var body			=	document.getElementsByTagName('body')[0];
		var dialog_div		=	document.createElement('div');
		var dialog_buttons	=	document.createElement('div');
		var dialog_msg		=	document.createElement('div');
		
		dialog_div.setAttribute('id',this.dialog);
		dialog_div.setAttribute('class','modal-dialog');
		
		dialog_buttons.setAttribute('class','modal-button-wrapper');
		dialog_buttons.setAttribute('id','modal-button-wrapper');
		
		dialog_msg.setAttribute('class','modal-msg-wrapper');
		dialog_msg.setAttribute('id','modal-msg-wrapper');

		
		dialog_div.appendChild(dialog_buttons);
		dialog_div.appendChild(dialog_msg);
		
		body.appendChild(dialog_div);

		var object				=	document.getElementById(this.dialog);
		object.style.width		=	this.dialog_w+"px";
		object.style.height		=	this.dialog_h+"px";
		object.style.top		=	this.dialog_top+'px';
		object.style.left		=	this.dialog_left+'px';

	}//end function
	
	this.buildLoadingDialog		=	function(){
	
		if(this.dialog_top == null){
			this.dialog_top				=	((this.overlay_h - this.dialog_h) / 2);	//pixels from top edge
		}
		if(this.dialog_left == null){
			this.dialog_left				=	((this.overlay_w - this.dialog_w) / 2);	//pixels from left edge
		}
		
		//now its time to build html and append to body for dialog
		var body			=	document.getElementsByTagName('body')[0];
		var dialog_div		=	document.createElement('div');
		
		var	dialog_h6		=	document.createElement('h6');
		var dialog_img		=	document.createElement('img');
		
		dialog_div.setAttribute('id',this.dialog);
		dialog_div.setAttribute('class','loading-dialog');
		
		dialog_h6.innerHTML	=	this.dialog_msg;
		dialog_img.src		=	"/templates/coachyouths_template/images/circle_processing_image_50x50.gif";
		
		dialog_div.appendChild(dialog_img);
		dialog_div.appendChild(dialog_h6);
		
		body.appendChild(dialog_div);

		var object				=	document.getElementById(this.dialog);
		object.style.width		=	this.dialog_w+"px";
		object.style.height		=	this.dialog_h+"px";
		object.style.top		=	this.dialog_top+'px';
		object.style.left		=	this.dialog_left+'px';
		
	}//end function
	
	this.showDialog				=	function(){
	
		//build overlay
		this.buildOverlay();
		
		//build dialog
		this.buildDialog();
		
			if(window.$){
				
				$('#'+this.dialog).show('blind',null,500,null);
				$('#'+this.overlay).show('blind',null,500,null);
				
			}
			else{
		
				var object				=	document.getElementById(this.overlay);
				object.style.display	=	'block';
		
				var object				=	document.getElementById(this.dialog);
				object.style.display	=	'block';
				
			}//end else

		
	}//end function
	
	this.showOverlay			=	function(){
		
		//build overlay
		this.buildOverlay();
		
		if(window.$){
				
			$('#'+this.overlay).show('blind',null,500,null);
				
		}
		else{
		
			var object				=	document.getElementById(this.overlay);
			object.style.display	=	'block';
				
		}//end else


	
	}//end function
	
	this.showLoadingDialog		=	function(){
	
		//build overlay
		this.buildOverlay();
		
		//build dialog
		this.buildLoadingDialog();
		
		
			var object				=	document.getElementById(this.overlay);
			object.style.display	=	'block';
			
			var object				=	document.getElementById(this.dialog);
			object.style.display	=	'block';
	
	
	}//end function
	
	this.hideDialog				=	function(){
		
			var object				=	document.getElementById(this.overlay);
			object.style.display	=	'none';
		
			var object				=	document.getElementById(this.dialog);
			object.style.display	=	'none';
			
			this.destroyDialog();		
	
	}//end function
	
	this.hideOverlay				=	function(){
		
			var object				=	document.getElementById(this.overlay);
			//object.style.display	=	'none';
			$('#'+this.overlay).hide();
		
			this.destroyOverlay();
	
	}//end function
	
	this.destroyOverlay				=	function(){
	
		$('#'+this.overlay).remove();
		
	}//end function

	
	this.destroyDialog	=	function(){
		
		
		$('#'+this.overlay).remove();
		$('#'+this.dialog).remove();
		

	}//end function
	
	this.addDialogButton	=	function(){
	
		var button_div		=	document.getElementById('modal-button-wrapper');
		var dialog_button	=	document.createElement('input');
		dialog_button.type	=	'button';
		dialog_button.value	=	this.button_value;
		
		dialog_button.setAttribute('id',this.button_id);
		dialog_button.setAttribute('class','submit-button');
		dialog_button.onclick	=	this.button_action;
		
		button_div.appendChild(dialog_button);

	
	}//end function
	
	this.clearDialogButtons		=	function(){
	
		var button_div		=	document.getElementById('modal-button-wrapper');
		button_div.innerHTML	=	"";
	
	}//end function
	
	this.addDialogMsg			=	function(){
	
		var msg_div				=	document.getElementById('modal-msg-wrapper');
		var dialog_msg			=	document.createElement('p');
		dialog_msg.innerHTML	=	this.dialog_msg;
		
		msg_div.appendChild(dialog_msg);
	
	}//end function


}//end class-function