//example usage....

/*
mooAlert({
	title:'Title',   	//the title of the box
	content:'Moo!',  	//the content of the box in plain text
	type:'okCancel',	//the type of box leace blank for a simple box or set to okCancel for a box with 2 buttons.
	url:'',				//the url to be fetched for the contents of the box (if it ends in .jpg etc then the image is loaded) 
	onOk: function() {alert('OK');},			//the function that is called when the close or OK button is pressed
	onCancel: function() {alert('CANCEL');} ,	//the function that is called when the esc key or cancel button is pressed
				
});



You can also automatically assign a modal box to any link but including rel="modalbox" in the A tag. You will need to set the titlke tag of the link also.

e.g.

<a href="simple-content.php" rel="modalbox" title="Some info...">Click HERE</a>

You can also link to an image for a lightbox effect.
*/



// **************  TO DO

// allow swf's to be displayed
// remove slect boxes and embedded objects befor showing modal div









		
function mooAlert(opts) {
	
	var optsHash  = new Hash(opts);
	
	//remove flash & slect boxes
	$$('select','object').each(function(item) {
										
	//	item.setStyle('display','none');									
	});
	
	
	//show shading div
	if ($("modal")) $("modal").dispose();
	modalDiv = new Element("div", {
		id: "modal",
		styles: {
			position: "absolute",
			top: 0,
			left: 0,
			width: window.getScrollWidth(),
			height: window.getScrollHeight(),
			"z-index": 100
		},
		opacity: 0.5,
		events: $empty()
	}).inject(document.body);
	
	
	//reset dialog
	
	$('pop_content').setStyle('background-image','url(/images/overlays/'+optsHash.image+')');
	$('fb-modal-content').innerHTML =  '<p align="center"><br /><img src="images/loading.gif" alt="Loading..." /></p>';
	$('fb-modal-title').set('text', optsHash.title);
	$('fb-modal').setStyle('top',(window.getHeight() - $('pop_dialog_table').getHeight()) / 3);
	if(optsHash.width > 0) {
		$('pop_dialog_table').setStyle('width',optsHash.width);
	} else {
		$('pop_dialog_table').setStyle('width',532);
	}
	
	//if not okCancel then duplicate event functions
	if(optsHash.type != 'okCancel' && optsHash.has('onOk')) optsHash.onCancel = optsHash.onOk;
	
	
	
	
	$('fb-modal').setStyles({
		opacity:0,
		display:'block'
		
	});
	
	
	//functions
	//this bit adds the default behaviours
	var funcOk = function(e) {
		mooClose();
		if(optsHash.has('onOk')) optsHash.onOk();
		$('fb-close').removeEvent('click',funcOk);
		window.removeEvent('keypress',funcEsc);
		$(document.body).removeEvent('click',funcBodyClick);
	};
	$('fb-close').addEvent('click', funcOk);
	
	
	var funcEsc = function(e) {
		if(e.key == 'esc') { 
			mooClose();
			if(optsHash.has('onCancel')) optsHash.onCancel();
			$('fb-close').removeEvent('click',funcOk);
			
			window.removeEvent('keypress',funcEsc);
			$(document.body).removeEvent('click',funcBodyClick);
		} 
	}
	window.addEvent('keypress',funcEsc );
	
	
	if(optsHash.type == 'okCancel') {
		
		$('fb-close').setProperty('title','OK');
		$('fb-close').set('text','OK');
		
		var funcCancel = function(e) {
			mooClose();
			if(optsHash.has('onCancel')) optsHash.onCancel();
			$('fb-close').removeEvent('click',funcOk);
			
			window.removeEvent('keypress',funcEsc);
			$(document.body).removeEvent('click',funcBodyClick);
		};
		$('fb-cancel').addEvent('click', funcCancel);
		
		
	} else {
		$('fb-close').setProperty('title','Close');
		//$('fb-close').set('text','Close');
		
		var funcBodyClick = function(e) {
			if($('fb-modal').get('opacity') == 1 && !e.target.getParent('.generic_dialog')) { 
				mooClose();
				if(optsHash.has('onCancel')) optsHash.onCancel();
				$('fb-close').removeEvent('click',funcOk);
				
				window.removeEvent('keypress',funcEsc);
				$(document.body).removeEvent('click',funcBodyClick);
			} 
		}
		$(document.body).addEvent('click',funcBodyClick);
	}
	
	
	
	

	
	
	
	if(optsHash.url) {  //if it's a url
		$('fb-modal').fade('in');
		
		var ext = optsHash.url.split('.').pop();
		if(ext == 'png' || ext == 'jpg'|| ext == 'jpeg' || ext == 'gif') {
			
			//load the image
			
    		var loader = new Asset.images(optsHash.url, {
        		
        		onComplete: function() {
            		$('fb-modal-content').set('text', '');
					
					$('fb-modal-content').innerHTML = '<img id="pop_image" src="'+optsHash.url+'" />';
					
					//repostion window
					$('fb-modal').setStyle('top',(window.getHeight() - $('pop_dialog_table').getHeight()) / 3);
					//resize window
					$('pop_dialog_table').setStyle('width',$('pop_image').getWidth() + $('fb-modal-content').getStyle('padding-left').toInt() + $('fb-modal-content').getStyle('padding-right').toInt() + 20 );
					
					
        		}
    		});
			
			
		} else {
			var req = new Request.HTML({url:optsHash.url, 
				onSuccess: function(html) {
					//Clear the text currently inside the results div.
					$('fb-modal-content').set('text', '');
					//Inject the new DOM elements into the results div.
					$('fb-modal-content').adopt(html);
					//reposition window
					$('fb-modal').setStyle('top',(window.getHeight() - $('pop_dialog_table').getHeight()) / 3);
								
				},
				//Our request will most likely succeed, but just in case, we'll add an
				//onFailure method which will let the user know what happened.
				onFailure: function() {
					$('fb-modal-content').set('text', 'Ooops, there was a problem loading the content. Please try again.');
								
				}
			});
			req.send();	
		}
		
		
		
		
	} else {
		$('fb-modal-content').innerHTML = optsHash.content;
		$('fb-modal').setStyle('top',(window.getHeight() - $('pop_dialog_table').getHeight()) / 3);
		$('fb-modal').fade('in');
		
		
	}
		
}

function mooClose() {
	if ($("modal")) $("modal").dispose();	
	$('fb-modal').fade('out');
}
		
window.addEvent('domready', function() {
		

			
			
			//this bit crates modal boxes from links
			var elements = $$('a[rel="modalbox"]');
			
			/* click to show */
			elements.addEvent('click',function(e) {
				
				e = new Event(e);
            	e.stop();
				
				mooAlert({title: this.getProperty('title'), url: this.getProperty('href')});
				
			});
			
			//this bit handles windows resizing...
			

			window.addEvent('resize', function(e) { 
				if($('fb-modal')) $('fb-modal').setStyle('top',(window.getHeight() - $('pop_dialog_table').getHeight()) / 3);
				if($('modal')) {
					$('modal').setStyle('width',0);
					$('modal').setStyle('width',window.getScrollWidth());
					$('modal').setStyle('height',0);
					$('modal').setStyle('height',window.getScrollHeight());
				}
			});
			
			

	
			
});