// Modal dialog box
// Many thanks to JohnnyCache user at the Mootools forum. 
// (See thread: http://forum.mootools.net/viewtopic.php?id=7768&p=2)
// This is converted to work on v1.11
var Modal = new Class({
	options: {
		speed: 500,
		maskOpacity: 0.3,
		maskColor: '#000000',
		width: 400,
		height: 'auto',
		classPrefix: 'Modal',
		onHide: Class.empty,
		onShow: Class.empty,
		onStart: Class.empty
	},
	initialize: function(options) {
		this.setOptions(options);
		this.isShowing = false;
		this.mask = new Element('div', {
			'class':this.options.classPrefix+'Mask',
			'styles':{
				'position':'absolute',
				'top': 0,
				'left': 0,
				'opacity': 0,
				'z-index': 9999,
				'background-color':this.options.maskColor
			},
			'events': {
				'click':this.hide.bindWithEvent(this)
			}
		});
		this.message = new Element('div',{
			'class':this.options.classPrefix+'Message',
			'styles':{
				'height':this.options.height
			}
		});
		this.title = new Element('div',{
			'class':this.options.classPrefix+'Title'
		});
		this.closeLink = new Element('a', {
				'href':'#',
				'events':{
					'click':this.hide.bindWithEvent(this)
				}
		}).setHTML("Close");
		this.closeButton = new Element('div',{
			'class':this.options.classPrefix+'Close'
		}).adopt(this.closeLink);
		this.pop = new Element('div', {
			'class':this.options.classPrefix+'Pop',
			'styles':{
				'position': 'absolute',
				'visibility': 'hidden',
				'opacity':'0',
				'width': this.options.width,
				'left':'50%',
				'z-index': 10000
			}
		}).adopt(this.title, this.closeButton, this.message);
 
		this.fx = {
			mask: this.mask.effect('opacity', {duration: this.options.speed}),
			slide: this.pop.effect('opacity',{duration:this.options.speed})
		};
//		window.addEvent('keydown', this.hide.bindWithEvent(this));
		window.addEvent('resize', this.update.bindWithEvent(this));
		window.addEvent('scroll', this.update.bindWithEvent(this));
		this.fireEvent('onStart');
	},
 
	show: function(el, options) {
		this.message.empty();
		switch($type(el)) {
			case 'element':
				this.message.adopt(el.clone().cloneEvents(el));
				break;
			case 'string':
				this.message.setHTML(el);
				break;
			default:
				return false;
				break;
		}
		if(options && options.title){
			this.title.setHTML(options.title);
		}else{
			this.title.empty();
		} 
		if(options && options.width){
			this.pop.setStyle('width',options.width);
		}
		if(options && options.height){
			this.message.setStyle('height',options.height);
		}
		if(!this.isShowing){
			$$('object', 'select').setStyle('visibility', 'hidden');
			$$('body').adopt(this.mask, this.pop);
			this.pop.setStyles({
				'top': ((window.getSize().size.y/2)+window.getScrollTop()),
				'left': (window.getSize().size.x/2),
				'visibility':'visible',
				'marginTop': -(this.pop.getSize().size.y/2),
				'marginLeft': -(this.pop.getSize().size.x/2)
			});
			this.mask.setStyles({
				'top': window.getScrollTop(),
				'height': window.getSize().size.y,
				'width': window.getSize().size.x
			});	
			this.fx.mask.start(this.options.maskOpacity);
			this.fx.slide.start(1.0);
			this.isShowing = true;
			this.fireEvent('onShow');
		}
	},
 
	hide: function(e) {
		var event = new Event(e).stop();
		if((event.key && event.key != 'esc')||!this.isShowing) return false;
		$$('object', 'select').setStyle('visibility', 'visible');
//		this.fx.slide.cancel();
		this.fx.slide.start(0).chain(function() {
			this.pop.setStyle('visibility','hidden').remove();
			this.fx.mask.start(0).chain(function() {
				this.mask.remove();
				this.isShowing = false;
				this.fireEvent('onHide');
			}.bind(this));
		}.bind(this));
	},
 
	update: function(e) {
		if(e) e = new Event(e).stop();
		if(this.isShowing) {
//			this.fx.slide.cancel();
			var size = window.getSize().size;
			var scrollSize = {y: window.getScrollTop(), x: window.getScrollLeft};
			this.mask.setStyles({
				'top': scrollSize.y,
				'height': (size.y > scrollSize.y)?size.y:scrollSize.y,
				'width': size.x
			});
			this.fx.slide.start(scrollSize.y + (window.getSize().size.y/2 - this.pop.getSize().size.y/2))
		}
	},
	submitForm: function(e) {
		if(e) e = new Event(e).stop();
	}
});
Modal.implement(new Events);
Modal.implement(new Options);

function displayIFrameModalBox(srcFile,parameters,title) {
//	$('waitBox').setStyle('display','block');
//	$('waitBox').setStyle('display','none');
	if(!$('containerDiv')) {
		timeStamp = new Date().getTime();
		containerIFrame = new Element('iframe', {
								'styles': {
									'visibility': 'visible',
									'display': 'block',
									'float':'none',
									'width':'775px',
									'height':'500px'
								},
								'src': srcFile + "?" + parameters + "&" + timeStamp,
								'width':'775px',
								'height':'500px',
								'id':'containerIFrame',
								'divType': 'iframe'
							   });
	} else {
		containerIFrame = $('containerIFrame');
	}
	var dlgWidth = 800;
	var dlgHeight = 500;
	var dlg = new Modal({'width': dlgWidth,'height': dlgHeight});
	dlg.show(containerIFrame, {'title': title});
/*	ajaxCall = new Ajax(srcFile + "?" + parameters + "&" + new Date().getTime(), {
									update: $(containerDiv),evalResponse: true,
									onComplete: function() {
										var dlgWidth = $(containerDiv).getStyle('width');
										var dlgHeight = $(containerDiv).getStyle('height');
										var dlg = new Modal({'width': dlgWidth,'height': dlgHeight});
										$('waitBox').setStyle('display','none');
										dlg.show($(containerDiv), {'title': title});
									}
									}).request();*/
	
	return false;
}
