// JavaScript Document
////////////////////////////////////////////////////////////////////////////////////
//  Need these 2 lines directly after the <body> tag
////////////////////////////////////////////////////////////////////////////////////
/*
<div id='mioForm' style='visibility:hidden;position:absolute;height:1px;width:100%;z-index:999'></div>
<div id='mioForm2' style='visibility:hidden;position:absolute;height:1px;width:100%;background-color:#CCCCCC;filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;z-index:998'></div>
*/
////////////////////////////////////////////////////////////////////////////////////
//  This is the "LOADING..." part
////////////////////////////////////////////////////////////////////////////////////
var mioIntId = 0;
function mio_loading(mioTxt){
	myform = "<div id='mio_span' style='margin:15%;padding-left:30%;background-color:#FFFFFF;font-size:12px;font-weight:bold;text-align:left;padding-bottom:10px;padding-top:10px;'>";
	myform = myform + mioTxt + "...</div>";
	showForm();	
	document.getElementById('mioForm').innerHTML = myform;
    mioIntId = setInterval("mio_show_load('" + mioTxt + "')", 500);
}
function mio_loading_off(){
    clearInterval(mioIntId);
    document.getElementById('mioForm2').style.visibility='hidden';
	document.getElementById('mioForm').style.visibility='hidden';
}
mio_periods = 0;
function mio_show_load(mioTxt){
    if(document.getElementById('mio_span')){
    str = "";
    for(i=0;i<mio_periods;i++){
        str = str + ".";
    }
    
    document.getElementById('mio_span').innerHTML = mioTxt + str;
    mio_periods++;
    if(mio_periods == 5){mio_periods=0;}
    return(mio_periods);
    }else{
    return("");
    }
} 
function hideForm(){ 
    document.getElementById('mioForm').style.visibility='hidden';
    document.getElementById('mioForm2').style.visibility='hidden';
	document.getElementById('mioForm').innerHTML = "";

}
function showForm(){
	//height = '100%';
	height = document.body.parentNode.clientHeight;
	
	if(window.innerHeight){
		height = window.innerHeight;
		myscroll = window.scrollY;
	}else if(document.body.clientHeight){
		height = document.body.clientHeight;
		myscroll = document.body.scrollTop;
	}else{
		myscroll = "0";
	}
	//height = height + height2;
	//document.getElementById('mioForm').style.paddingTop = myscroll;
	window.scrollTo(0,0);
	
	document.getElementById('mioForm2').style.height=height+'px';
    document.getElementById('mioForm2').style.width='100%';
	document.getElementById('mioForm').style.height=height;
    document.getElementById('mioForm').style.width='100%';
	
	//document.getElementById('mioForm').innerHTML = myform;
	document.getElementById('mioForm2').style.visibility='visible';
    document.getElementById('mioForm').style.visibility='visible';
}
//////////////////////////////////////////////////////////////////
////    FORM popUP portion
//////////////////////////////////////////////////////////////////
function newForm(content, b1_func, b1_name, b2_func, b2_name){
	//content = what the form will say
	//b1_func = what function to call when button is clicked
	//b1_name = name of the button
	//b2_func = what function to call when button2 is clicked
	//b2_name = name of the button
	
	myform = "<div class='mioPop' style='margin:7% 20% 20% 7%;background-color:#FFFFFF;boder:solid black 2px;text-align:center;padding-bottom:10px;padding-top:10px;text-align:center;'><p>";
	myform += content+"<br>";
	if(b1_func != ""){myform += "<input class='mioPopBtn' type='button' value='"+b1_name+"' onClick='"+b1_func+"' />";}
    myform += "&nbsp;&nbsp;";
	if(b2_func != ""){myform += "<input class='mioPopBtn' type='button' value='"+b2_name+"' onClick='"+b2_func+"' />";}
	myform += "</p></div>";
	
	showForm();
  
    document.getElementById('mioForm').innerHTML = myform;

}
function newFormImg(imgId){
	var maxWidth = 600;
	var maxHeight = 400;
	
	var width = aWidth = gallerInfo[imgId].xy[0];
	var height = aHeight = gallerInfo[imgId].xy[1];
	
	if(aWidth > maxWidth || aHeight > maxHeight){	
		var wRatio = aWidth/maxWidth;
		var hRatio = aHeight/maxHeight;
		
		var det = 1/Math.max(wRatio,hRatio);
		
		var width = Math.round((aWidth * det),0);
		var height = Math.round((aHeight * det),0);
		
	}
	
	
	myform = "<div class='mioPop' style='background-color:#FFFFFF;text-align:center;'>";
	myform += "<h2>"+gallerInfo[imgId].title+"</h2>";
	myform += "<p><img style='padding-left:20px;padding-right:20px;' src='"+gallerInfo[imgId].src+"' width='"+width+"' height='"+height+"' /></p>";
	myform += "<p><input class='mioPopBtn' type='button' value='Close' onclick='hideForm()' /></p>";
	myform += "</div>";
	
	showForm();
	
	//calc the page and location
	var x = YAHOO.util.Dom.getViewportWidth();
	var y = YAHOO.util.Dom.getViewportHeight();
	
	var xLoc = Math.floor((x - width - 40)/2)+10;
	var yLoc = Math.floor((y - height - 100)/2)+10;
	
	xLoc = Math.max(xLoc,10);
	yLoc = Math.max(yLoc,10);
	
	wrapper = document.getElementById('mioForm');
	wrapper.style.width="auto";
	YAHOO.util.Dom.setXY(wrapper,[xLoc,yLoc]);
	
	wrapper.innerHTML = myform;
}