/*
Background
    modal_box.js will display the contents of any div within the page, within a CSS based modal box.
Requirements:
    prototype.js is required for this for function properly
Usage:
    To show:
        modal_sm(NodeID,WidthInPixals,HeightInPixals);
        modal_sm('ModalBox',750,450);
    To hide:
        modal_hm(NodeID);
        modal_hm('ModalBox');

Example:
<script language='JavaScript' src='/js/prototype.js'  type='text/javascript'></ script>
<script language='JavaScript' src='/js/modal_box.js'  type='text/javascript'></ Zscript>
<style type="text/css">
#mbox{}
#mbm{font-family:sans-serif;font-weight:bold;float:right;padding-bottom:5px;}
#ol{ background-color: black; filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; z-index: 998; }
.dialog {display:none}
* html #ol{}
</style>
<a href="" onClick="modal_sm('ModalBox',750,450);return false;">Show Modal</a>
<a href="" onClick="modal_hm('ModalBox');return false;">Hide Modal</a>

<div id="ModalBox" style="display:none;">
	This is the content within the modal box
</div>

*/

function modal_pageWidth() {return window.innerWidth != null? window.innerWidth: document.documentElement && document.documentElement.clientWidth ? document.documentElement.clientWidth:document.body != null? document.body.clientWidth:null;}
function modal_pageHeight() {return window.innerHeight != null? window.innerHeight: document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientHeight:document.body != null? document.body.clientHeight:null;}
function modal_posLeft() {return typeof window.pageXOffset != 'undefined' ? window.pageXOffset:document.documentElement && document.documentElement.scrollLeft? document.documentElement.scrollLeft:document.body.scrollLeft? document.body.scrollLeft:0;}
function modal_posTop() {return typeof window.pageYOffset != 'undefined' ? window.pageYOffset:document.documentElement && document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop?document.body.scrollTop:0;}
function modal_scrollFix(){var obol=$('ol');obol.style.top=modal_posTop()+'px';obol.style.left=modal_posLeft()+'px'}
function modal_sizeFix(){var obol=$('ol');obol.style.height=modal_pageHeight()+'px';obol.style.width=modal_pageWidth()+'px';}
function modal_kp(e){ky=e?e.which:event.keyCode;if(ky==88||ky==120)modal_hm();return false}
function modal_inf(h){
	var display = 'none'; if (h != 'hidden') display = 'inline';
	tag=document.getElementsByTagName('select');for(i=tag.length-1;i>=0;i--) {	tag[i].style.visibility=h;	tag[i].style.display=display;	}
	tag=document.getElementsByTagName('iframe');for(i=tag.length-1;i>=0;i--) {	tag[i].style.visibility=h;	tag[i].style.display=display;	}
	tag=document.getElementsByTagName('object');for(i=tag.length-1;i>=0;i--) {	tag[i].style.visibility=h;	tag[i].style.display=display;	}
	}
function modal_sm(obl, wd, ht){var h='hidden';var b='block';var p='px';var obol=$('ol'); var obbxd = $('mbd');obbxd.innerHTML = $(obl).innerHTML;obol.style.height=modal_pageHeight()+p;obol.style.width=modal_pageWidth()+p;obol.style.top=modal_posTop()+p;obol.style.left=modal_posLeft()+p;obol.style.display=b;var tp=modal_posTop()+((modal_pageHeight()-ht)/2)-12;var lt=modal_posLeft()+((modal_pageWidth()-wd)/2)-12;var obbx=$('mbox');obbx.style.top=(tp<0?0:tp)+p;obbx.style.left=(lt<0?0:lt)+p;obbx.style.width=wd+p;obbx.style.height=ht+p;modal_inf(h);obbx.style.display=b;return false;}
function modal_hm(){var v='visible';var n='none';$('ol').style.display=n;$('mbox').style.display=n;modal_inf(v);document.onkeypress=''}
function modal_initmb(){
	var ab='absolute';
	var n='none';
	var obody=document.getElementsByTagName('body')[0];
	var frag=document.createDocumentFragment();
	var obol=document.createElement('div');
		obol.setAttribute('id','ol');	obol.style.display=n;
		obol.style.position=ab;			obol.style.top=0;
		obol.style.left=0;				obol.style.zIndex=998;
		obol.style.width='100%';
	frag.appendChild(obol);
	var obbx=document.createElement('div');
		obbx.setAttribute('id','mbox');	obbx.style.display=n;
		obbx.style.position=ab;obbx.style.zIndex=999;
	var obl=document.createElement('span');	obbx.appendChild(obl);
	var obbxd=document.createElement('div');
		obbxd.setAttribute('id','mbd');	obl.appendChild(obbxd);
	frag.insertBefore(obbx,obol.nextSibling);
	obody.insertBefore(frag,obody.firstChild);
	window.onscroll = modal_scrollFix;
	window.onresize = modal_sizeFix;
	}

// On page load, initialize the modal functionality

Event.observe(window, 'load', modal_initmb);