
/************************************************************************
 *																		*
 *		jbox.js															*
 *																		*
 *			Contains the JBOX class.									*
 *																		*
 *			JBOX Class displays flash movies in a popup that fades in.	*
 *																		*
 *																		*
 *		Copyright © 2009 by Josef Guenther								*
 *			All rights reserved.										*
 *																		*
 *			Contact me at:												*
 *			josefguenther@gmail.com										*
 *																		*
 *																		*
 ************************************************************************/



// -------------------------------------------------------------------------------- //
//																					//
//									JBOX Class										//
//																					//
// -------------------------------------------------------------------------------- //

//
// jbox Class
//
var jbox = ({
	
	//
	// Variables
	//
	
	flashWidth: 0,
	flashHeight: 0,
	flashMovie: 0,
	flashMovieName: 0,
	
	Showing: false,
	Ready: false,
	
	special: undefined,
	
	// adjusted to CSS padding
	borderSize: 10,
	
	// alpha of overlay
	overlayAlpha: 50,
	
	
	//
	// Functions
	//
	
	//
	// initialize() - Initializes the jbox.
	//
	initialize: function (width, height, swfName)
	{
		// Update variables
		this.flashWidth = width;
		this.flashHeight = height;
		this.flashMovie = swfName + ".swf";
		this.flashMovieName = swfName;
		
		element.id('jbFContainer').style.height = this.flashHeight + this.borderSize;
		element.id('jbFContainer').style.width = this.flashWidth + this.borderSize;
		element.id('jbOContainer').style.width = this.flashWidth + this.borderSize;
		
		// Change flash movie size
		if (isIE) {
			document.getElementsByTagName("object").item(0).width = this.flashWidth;
			document.getElementsByTagName("object").item(0).height = this.flashHeight;
		} else {
			document.getElementsByTagName("embed").item(0).width = this.flashWidth;
			document.getElementsByTagName("embed").item(0).height = this.flashHeight;
		}
	},
	
	//
	//	start() - Display overlay and jbox.
	//
	start: function ()
	{
		hideSelectBoxes();
		
		// variable setup
		var docSize = getPageSize();
		var docScroll = getPageScroll();
		var e_overlay = element.id('overlay');
		var e_jbox = element.id('jbox');
		
		///
		//			OVERLAY
		///
		
		e_overlay.style.height = docSize[3] + "px";
		e_overlay.style.top = docScroll + "px";
		
		// if the jbox is already being displayed, only transition - no fade
		if (this.Showing) {
			element.show('overlay');
		} else {
			element.fade('overlay', 0, this.overlayAlpha, 500);
		}
		
		this.Showing = true;
		
		
		///
		//			JBOX
		///
		var jboxTop = docScroll + ((docSize[3] - this.flashHeight) / 2) - 20;
		var jboxLeft = ((docSize[2] - (this.flashWidth + this.borderSize * 2)) / 2);
		
		e_jbox.style.top = jboxTop + "px";
		e_jbox.style.left = jboxLeft + "px";
		
		
		element.fade('jbox', 0, 100, 600);
		setTimeout("jbox.initialize(" + this.flashWidth + "," + this.flashHeight + ",'" + this.flashMovieName + "')", 610);
		setTimeout("jbox.Ready=true", 1500);
		setTimeout("setMovieFocus('jbox_loader')", 1500);
		setTimeout("element.show('jbox')", 10);
		
		setTimeout("element.id('overlay').style.height='" + docSize[1] + "px'", 2000);
		setTimeout("element.id('overlay').style.top='0px'", 2100);
	},
	
	//
	//	end() - Hides the jbox and fades the overlay.
	//
	end: function ()
	{
		if (!this.Ready) {
			return;
		}
		
		this.Ready = false;
		
		// Notice that these are all on setTimeout. This is because we have to wait for 'this.Ready' to kick in for the flashtalk class.
		
		// hide the movie
		setTimeout("jbox.initialize(" + this.flashWidth + ", " + (this.flashHeight + 1) + ", 'undefined')", 100);
		
		// fade the outer
		setTimeout ("element.fade('overlay', " + this.overlayAlpha + ", 0, 500)", 100);
		
		// fade and hide the inside
		setTimeout("element.fade('jbox', 100, 0, 500)", 110);
		setTimeout("element.hide('jbox')",620);
		
		// show any selection boxes again
		showSelectBoxes();
		
		this.Showing = false;
	}
});



// -------------------------------------------------------------------------------- //
//																					//
//									FUNCTIONS										//
//																					//
// -------------------------------------------------------------------------------- //

//
// getPageScroll() - Returns y page scroll value.
//
function getPageScroll()
{
	var yScroll;
	
	if (self.pageYOffset) {
		yScroll = self.pageYOffset;
	} else if (document.documentElement && document.documentElement.scrollTop) {		// Explorer 6 Strict
		yScroll = document.documentElement.scrollTop;
	} else if (document.body) {															// all other Explorers
		yScroll = document.body.scrollTop;
	}
	
	return yScroll;
}

//
// getPageSize() - Returns array with page width, height and window width, height
//
function getPageSize()
{
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight) {	// all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else {										// Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {															// all except Explorer
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) {	// Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) {														// other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}
	
	// for small pages with total height less then height of the viewport
	if (yScroll < windowHeight) {
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}

	// for small pages with total width less then width of the viewport
	if (xScroll < windowWidth) {	
		pageWidth = windowWidth;
	} else {
		pageWidth = xScroll;
	}

	arrayPageSize = [pageWidth, pageHeight, windowWidth, windowHeight];
	return arrayPageSize;
}
//
// showSelectBoxes() - Shows selection boxes
//
function showSelectBoxes()
{
	var selects = document.getElementsByTagName("select");
	for (i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "visible";
	}
}
//
// hideSelectBoxes() - Hides selection boxes
//
function hideSelectBoxes()
{
	var selects = document.getElementsByTagName("select");
	for (var i = 0; i != selects.length; i++) {
		selects[i].style.visibility = "hidden";
	}
}


//
// DISABLE MOUSE SCROLLING WHEN JBOX IS DISPLAYING
//

function wheel(e)
{
	// For IE
	if (!e) {
		e = window.event;
	}
	
	// If the jbox is showing, disable the event
	if (jbox.Showing) {
		e = (e ? e : window.event);
			if (e.stopPropagation) {
				e.stopPropagation();
			}
			if (e.preventDefault) {
				e.preventDefault();
			}
			e.cancelBubble = true;
			e.cancel = true;
			e.returnValue = false;
			return false;
	}
}

//
// Add event
//

if (window.addEventListener) {
	/** DOMMouseScroll is for mozilla. */
	window.addEventListener('DOMMouseScroll', wheel, false);
}
/** IE/Opera. */
window.onmousewheel = document.onmousewheel = wheel;
