/*
	SimpleBox
	version:1.1
	Author:Bulat Khromov
*/

var isDivIframe = false;
var myIframe, iframeContainer, progressBarLayer, fadingLayer, externalPage = false;
var simpleboxTitle = "";

var defaultIframeWidth = 800, defaultIframeHeight = 400;
var floatHeight;

function layerHTML () {
	var _iframeHTML = {
		code: '\
			<div id="fadingLayer"></div><div id="progressBarLayer"><br /><br /><img id="imgLoading" src="/images/design/loading_grey_de.gif" alt="Loading..." /></div> \
			<div id="iframeContainer"> \
				<table cellpadding="0" cellspacing="0" class="fbox" border="0" width="100"> \
				<tr> \
					<td class="c1 iePNG"><div class="spacer"></div></td> \
					<td class="c12 iePNG"><div class="spacer"></div></td> \
					<td class="c2 iePNG"><div class="spacer"></div></td> \
				</tr> \
				<tr> \
					<td class="c41 iePNG"><div class="spacer"></div></td> \
					<td id="iframeContainerContentTd" width="100%" > \
						<div id="iframeContainerHeader"> \
						<div id="simpleboxTitle"></div> \
						<a href="javascript:simpleboxClose()"><img src="/images/design/close.gif" alt="close" /></a></div> \
						<div id="iframeContainerContent"> \
							<div id="iframeHTML"><iframe id="myIframe" name="myIframeName" frameborder="0" style="padding:0px;margin:0px;" src="" width="500" height="100%"></iframe></div>\
							<div id="iframeImg"></div>\
						</div> \
					</td> \
					<td class="c23 iePNG"><div class="spacer"></div></td> \
				</tr> \
				<tr> \
					<td class="c4 iePNG"><div class="spacer"></div></td> \
					<td class="c34 iePNG"><div class="spacer"></div></td> \
					<td class="c3 iePNG"><div class="spacer"></div></td> \
				</tr> \
				</table> \
			</div> \
			'
	}
	return _iframeHTML.code;
}
function setIframeURL(thisurl) {
	myIframe.src = thisurl;
}
function setIframeHeight () {
	if(floatHeight) {
		myIframe.style.height = 0 + "px";
		myIframe.style.height = getDocHeight(window.frames["myIframeName"].document) + 17 + "px";
		//+ 17 fix for Opera
	}
}
var setInMiddle = function() {
	jQuery("#iframeContainer").css('left', jQuery(window).width()/2-jQuery("#iframeContainer").width()/2 + jQuery(window).scrollLeft());
	jQuery("#iframeContainer").css('top', jQuery(window).scrollTop() + 80);
}
var fixFading = function() {
	fadingLayer.style.height = 0 + "px";
	fadingLayer.style.height = getDocHeight(document) + "px";
}

var attachOnWindowResize = function() {
	if(window.addEventListener){ // Mozilla, Netscape, Firefox
		window.addEventListener("resize",setInMiddle, false);
		window.addEventListener("resize",fixFading, false);
	} else { // IE
		window.attachEvent("onresize", setInMiddle);
		window.attachEvent("onresize", fixFading);
	}
}
var detachOnWindowResize = function() {
	if(window.removeEventListener){ // Mozilla, Netscape, Firefox
		window.removeEventListener("resize",setInMiddle, false);
		window.removeEventListener("resize",fixFading, false);
	} else { // IE
		window.detachEvent("onresize", setInMiddle);
		window.detachEvent("onresize", fixFading);
	}
}

var showIframe = function() {
	jQuery("#progressBarLayer").hide();
	jQuery("#fadingLayer").show();
	setIframeHeight();
	setInMiddle();
	fixFading();
	attachOnWindowResize();
}
function getVarValueFromURL(url, varName) {
	var query = url.substring(url.indexOf('?') + 1);
	var vars = query.split("&");
	for (var i=0;i<vars.length;i++) {
		var pair = vars[i].split("=");
		if (pair[0] == varName) {
			return pair[1];
		}
	}
	return null;
}

function simplebox() {
	floatHeight = true;
	if (!isDivIframe) {
		document.getElementById('simplebox').innerHTML += layerHTML();
		isDivIframe = true;
		initIframeVars();
	}

	var url = simplebox.arguments[0];
	simpleboxTitle = "";
	if(simplebox.arguments[1] && simplebox.arguments[1] != "") {
		simpleboxTitle = simplebox.arguments[1];
	}
	document.getElementById("simpleboxTitle").innerHTML = simpleboxTitle;
	
	
	myIframe.style.width = defaultIframeWidth + "px";
	myIframe.style.height = defaultIframeHeight + "px";


	if(getVarValueFromURL(url, "width")!=null) {
		myIframe.style.width = parseInt(getVarValueFromURL(url, "width")) + "px";
	}
	if(getVarValueFromURL(url, "height")!=null) {
		myIframe.style.height = parseInt(getVarValueFromURL(url, "height")) + "px";
		floatHeight = false; 
		// if true the height of the iframe depends on the its content (in case inner page)
	}

	jQuery("#progressBarLayer").height(getDocHeight(document));
	jQuery("#progressBarLayer").show();

	jQuery("#imgLoading").css('left', jQuery(window).width()/2-jQuery("#imgLoading").width()/2 + jQuery(window).scrollLeft());
	jQuery("#imgLoading").css('top', 200 + jQuery(window).scrollTop());	
	
	if(url.toLowerCase().indexOf(".jpg")!=-1 || url.toLowerCase().indexOf(".gif")!=-1 || url.toLowerCase().indexOf(".png")!=-1) {// if image		
		floatHeight = false;
		jQuery("#iframeImg").show();
		jQuery("#iframeHTML").hide();
		document.getElementById('iframeImg').innerHTML = "<img id='iframeImage' style='display:block' src='" + url + "' alt='' />";
		jQuery("#iframeImage").load(function () {
			showIframe();
		});
		return;
	}
	if(url.indexOf("http://")!=-1) {// if inner URL
		floatHeight = false;
	}

	myIframe.src = url;
	
	if(myIframe.addEventListener) { // Mozilla, Netscape, Firefox
		myIframe.addEventListener("load",showIframe, false);
	} else { // IE
		myIframe.attachEvent("onload", showIframe);
	}
}
function simpleboxClose() {
	
	jQuery("#fadingLayer").height(0);
	jQuery("#fadingLayer").hide();
	jQuery("#progressBarLayer").height(0);
	jQuery("#iframeContainer").css('left',-3000);
	jQuery("#iframeContainer").css('top',-3000);

	jQuery("#iframeImg").hide();
	jQuery("#iframeHTML").show();
	
	if(myIframe.removeEventListener){ // Mozilla, Netscape, Firefox
		myIframe.removeEventListener("load",showIframe, false);
	} else { // IE
		myIframe.detachEvent("onload", showIframe);
	}
	detachOnWindowResize();
}
function getDocHeight(doc) {
	var height1=0, height2=0, height3=0, height4=0, maxheight=0;
	if (doc.height) maxheight = doc.height;
	if (doc.body) {
		if (doc.body.scrollHeight) height1 = doc.body.scrollHeight;
		if (doc.body.offsetHeight) height2 = doc.body.offsetHeight;
	}
	if (doc.documentElement) {
		height3 = doc.documentElement.scrollHeight;
		height4 = doc.documentElement.clientHeight;
	}
	maxheight = Math.max(Math.max(Math.max(height1, height2), Math.max(height3, height4)),maxheight);
	return maxheight;
}

function initIframeVars () {
	myIframe = document.getElementById("myIframe");
	iframeContainer = document.getElementById("iframeContainer");
	progressBarLayer = document.getElementById('progressBarLayer');
	fadingLayer = document.getElementById('fadingLayer');
	jQuery('#iframeContainer').css({
		'position':'absolute',
		'z-index':1000,
		'left':-30000,
		'top':-30000,
		'border':'0px red solid'
	});
	jQuery('#iframeContainerHeader').css({
		'background-color':'#fff',
		'margin':0,
		'padding':20,
		'text-align':'right'
	});
	jQuery('#iframeContainerContent').css({
		'background-color':'#fff'
	});	
	jQuery('#myIframe').css({
		'background-color':'#fff',
		'margin':0,
		'padding':0,
		'display':'block'
	});
	jQuery('#fadingLayer').css({
		'position':'absolute',
		'z-index':100,
		'left':0,
		'top':0,
		'width':'100%',
		'height':100,
		'display':'none',
		'text-align':'center',
		'background-color':'#000',
		'-moz-opacity':'.70',
		'opacity':'.70',
		'filter':'alpha(opacity=70)'
	});
	jQuery('#simpleboxTitle').css({
		'float':'left',
		'font-size':'16px',
		'font-weight':'bold',
		'color':'#666'
	});
	jQuery('#progressBarLayer').css({
		'position':'absolute',
		'z-index':100,
		'left':0,
		'top':0,
		'width':'100%',
		'height':100,
		'display':'none',
		'text-align':'center',
		'background-color':'#000',
		'-moz-opacity':'.70',
		'opacity':'.70',
		'filter':'alpha(opacity=70)'
	});
	jQuery('#imgLoading').css({
		'position':'absolute'
	});
	jQuery('.fbox .c1').css({
		'background':'URL(/images/design/c1.png)',
		'width':'24px',
		'height':'24px'
	});
	jQuery('.fbox .c2').css({
		'background':'URL(/images/design/c2.png)',
		'width':'24px',
		'height':'24px'
	});
	jQuery('.fbox .c3').css({
		'background':'URL(/images/design/c3.png)',
		'width':'24px',
		'height':'24px'
	});
	jQuery('.fbox .c4').css({
		'background':'URL(/images/design/c4.png)',
		'width':'24px',
		'height':'24px'
	});
	jQuery('.fbox .spacer').css({
		'width':'24px',
		'height':'24px'
	});
	jQuery('.fbox .c12').css({
		'background':'URL(/images/design/c12.png)'
	});
	jQuery('.fbox .c23').css({
		'background':'URL(/images/design/c23.png)'
	});
	jQuery('.fbox .c34').css({
		'background':'URL(/images/design/c34.png)'
	});
	jQuery('.fbox .c41').css({
		'background':'URL(/images/design/c41.png)'
	});
}
jQuery(document).ready(function() {
	jQuery("a.simplebox").bind("click", function(){
		simplebox(jQuery(this).attr("href") + "content.1/", jQuery(this).attr("title")); return false;
	});
	jQuery(".simplebox a").bind("click", function(){
		simplebox(jQuery(this).attr("href") + "content.1/", jQuery(this).attr("title")); return false;
	});
});

/*
	installation:	
		<script src="files/js/simplebox.js" type="text/javascript"></script>
		<div id="simplebox"></div>

	usage:
		<a href="http://xiag.ch" class="simplebox">Our vision</a>
		<a href="http://xiag.ch?width=800&height=500" title="This site title" class="simplebox">Our vision</a>
		
		<a href="images/pics/home_pilot.jpg" title="Granini pilot image" class="simplebox">Upload a Template</a>	
		<a href="test.htm" class="simplebox last">Report a Problem</a>
*/