/*
* Mootools Modal
* Version 0.62 2009/5/30
/****
< class="modal-link" rel="someid" href="otherlink.html"> External link </ > 								// makes a exteral link ! needs same id in modal-box (this hides modal-title) (if rel does not exist, uses href)
< class="modal-box" >
	< class="modal-title" title="Other Title" > Original Title </ >  					// title replaces "Original Title" in modal-title
	< class="modal-content" title="Alternate Title" style="width:300px"> Content </ > 	// title replaces "Original Title" inside modal box's title
</ >
/****
*/

var modal_image = 'images/modal-dialog-sprite.png';

window.addEvent('domready',function() {
	var modals = $$('.modal-box');
	modals.active = false;
	modals.boxborderstyles = {'height':'10px', 'overflow':'hidden', 'padding':'0','margin':'0' , 'background':'transparent url('+modal_image+') no-repeat scroll 0 0'};
	
	//overlay
	modals.overlay = new Element('div', {'styles': {'background-color': '#333333','position': 'fixed','top': '0px','opacity':'0','left': '0px','width': '100%','height': '100%','visibility':'hidden'}});
	modals.overlay.addEvent('click',function(e) { if(modals.active) { modals.active._hide(); } });
	$(document.body).adopt(modals.overlay);
	//
	
	modals.each(function(_this){
		var title = _this.getElements('.modal-title').getLast();
		if(_this.id)_this.style.display='none';
	
		var closelink = new Element('input',{
			'type':'button','value':'Close',
			'styles': {'padding':'5px','border':'1px solid #ccc','font-family':'tahoma,arial,helvetica,sans-serif','font-size':'12px'}
		})		
		
		var modalcontent = _this.getElements('.modal-content').getLast().setStyles({
			'background':'#fff','padding':'10px','display':'block','margin':'0','border':'1px solid #555','border-width':'0px 1px'
		})
			
		var content = new Element('table', {
			'cellspacing':'0',
			'styles': {	'opacity':'0','position':'absolute' }
		}).adopt(
			// damn ie
			new Element("tbody").adopt(
				new Element('tr').adopt(
					new Element('td',{'styles': modals.boxborderstyles}),
					new Element('td',{'styles': modals.boxborderstyles}).setStyles({'background-position':'0 -40px','background-repeat':'repeat-x'}),
					new Element('td',{'styles': modals.boxborderstyles}).setStyles({'background-position':'0 -10px','width':'10px'})
				),
				new Element('tr').adopt(
					new Element('td',{'styles': modals.boxborderstyles}).setStyles({'background-position':'-10px 0','background-repeat':'repeat-y'}),
					new Element('td',{'class':'modal-content-body','styles':{'padding':'0','margin':'0','width':modalcontent.style.width}}).adopt(
						new Element('div',{
							'html':((modalcontent.title)?modalcontent.title:title.innerHTML),
							'styles': {'font-weight':'bold','color':'#fff','background':'#6D84B4','padding':'10px','border':'1px solid #3B5998','width':modalcontent.style.width}
						}),
						modalcontent,
						new Element('div',{
							'styles': {'background':'#F2F2F2','padding':'10px','text-align':'right','border':'1px solid #3B5998','border-top':'1px solid #CCC','width':modalcontent.style.width}
						}).adopt(closelink)
					),
					new Element('td',{'styles': modals.boxborderstyles}).setStyles({'background-position':'-10px 0','background-repeat':'repeat-y'})
				),
				new Element('tr').adopt(
					new Element('td',{'styles': modals.boxborderstyles}).setStyles({'background-position':'0 -20px','width':'10px'}),
					new Element('td',{'styles': modals.boxborderstyles}).setStyles({'background-position':'0 -40px','background-repeat':'repeat-x'}),
					new Element('td',{'styles': modals.boxborderstyles}).setStyles({'background-position':'0 -30px','width':'10px'})
				)
			)
		);
		$(document.body).adopt(content);
		content.position({
			relativeTo: document.body,
			position: 'center'
		});
		_this._show = function () {
			if (modals.active==_this) return;
			else if (modals.active) modals.active.fade('out');
			_this.doposition();
			modals.active = _this;
			modals.overlay.fade(0.7);

			content.fade('in');
			location.hash = '#'+_this.id;
			return false;
		}
		
		_this.doposition = function () {
			content.position({
				relativeTo: document.body,
				position: 'center'
			});
		}
		
		_this._hide = function () {
			content.fade('out');
			modals.overlay.fade('out');
			modals.active = false;
		}
		title.innerHTML = '<a href="#" onClick="return false;">'+((title.title)?title.title:title.innerHTML)+'</a>';
		closelink.addEvent('click', _this._hide);
		title.addEvent('click', _this._show);

	});
	
	// external links *shrug*
	$$('.modal-link').each(function(_this) {
		//_this.style.display='';
		_this.style.display='inline';
		_this.style.visibility='visible';

		var target = $(_this.rel);
		if (target) { _this.href = '#'; _this.addEvent('click', target._show); }
		else {
			var target = $(_this.hash.substring(1));
			if (target) { _this.addEvent('click', target._show); }
		}

	})
	
	window.addEvent('keypress',function(e) { 
		if(e.key == 'esc') { if ( modals.active ) { modals.active._hide(); } }
	});
	
	//autoload
	if (location.hash){
		var target = $(location.hash.substring(1));
		if (target) { target._show(); }
	}

});