// requires prototype.js
// requires effects.js

// -----------------------------------------------------------------------------
// Lightbox toplevel functions

function createHtmlElements()
{
	if( !document.createElement )
		return;
	
	var body = document.body || document.getElementsByTagName('body')[0];
	
	var addLightboxNode = function( elem ) {
		body.appendChild( elem );
		elem.style.display = 'none'; //IE 7 needs this for some reason
		elem.onclick = hideLightbox;
	};
	
	addLightboxNode( 
		node( 'div', { id:'lightbox-screen', style:'display:none;' } ) );
	
	addLightboxNode(
		node( 'div', { id:'lightbox-box' }, [
				node( 'div', { id:'lightbox-head' } ),
				node( 'div', { id:'lightbox-body' }, [
					node( 'div', { style:'text-align:center;' }, [
							node( 'img', { id:'lightbox-image', alt:'' } ) ] ) ] ),
				node( 'div', { id:'lightbox-footer' } ) ] ) );
	
	addLightboxNode(
		node ( 'div', { id:'lightbox-close-notice' }, [
			text( 'Click anywhere to close the image') ] ) );
}

function initLightbox() 
{	
	if( !document.getElementsByTagName )
		return;
	
	createHtmlElements();
}

loadingUrl = "/images/core/spinner.gif";
spinnerPreloader = new Image();
spinnerPreloader.src = loadingUrl;

function showLightbox( imageUrl )
{
	if( !document.getElementsByTagName )
		return;
		
	hideSelects();
	
	$('lightbox-image').src = loadingUrl;
	positionLightbox( true );
	window.setTimeout( function(){
		$('lightbox-box').style.display = 'block';
		$('lightbox-close-notice').style.display = 'block';
		new Effect.Appear( 'lightbox-screen', { duration: 0.2, from: 0.0, to: 0.6 } );
			
		imgPreloader = new Image();
		imgPreloader.onload =  function() {
			positionLightbox( true, imgPreloader );
		   $('lightbox-image').src = imgPreloader.src; // Image will now be in the cache so this is instant
		};
		imgPreloader.src = imageUrl;
	}, 10);
};

function hideLightbox()
{
	showSelects();
	
	$('lightbox-box').style.display = 'none';
	$('lightbox-close-notice').style.display = 'none';
	
	new Effect.Fade( 'lightbox-screen', { duration: 0.2 } );
}

function positionLightbox( showInitial, customImage )
{
	var img = customImage || $('lightbox-image');
	
	if( img == null )
		return;

	var imageWidth = img.width;
	var windowWidth = document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth;
	var windowHeight = document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight;
		
	if( windowWidth < ( imageWidth ) ) {
		$('lightbox-box').setStyle({
			padding:  '20px 0px 20px 0px',
			overflow: 'auto',
			left:     '0px',
			width:    windowWidth + 'px'	});
	}
	else {
		$('lightbox-box').setStyle({
			padding:  '20px 20px 20px 20px',
			overflow: 'hidden',
			left:     ( ( windowWidth - imageWidth - 40 ) / 2 )+'px',
			width:    imageWidth + 'px' });
	}
	
	if( navigator.userAgent.match(/MSIE ?6/) && showInitial ) {
		$('lightbox-box').style.top = (
			document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )
			 + 35 + 'px';
		};
}

Event.observe( window, 'load', initLightbox );
var lightboxPositioner = new PeriodicalExecuter( positionLightbox, 0.5 );

// -----------------------------------------------------------------------------
// Scriptaculous builder seems to be bugged in IE, so use these instead

function node( elem, attrs, children ) 
{
	if( !document.createElement )
		return;
		
	var obj = document.createElement( elem );
	for( var key in attrs ) {
		if( typeof(key) != "string" )
				continue;
		
		obj.setAttribute( key, attrs[key] );		
	}
	
	if( children ) {
		for( var i=0; i<children.length;i++ )
			obj.appendChild( children[i] );		
	}	
	
	return obj;
}

function text( val )
{
	if( !document.createTextNode )
		return;
		
	return document.createTextNode( val );
}

// -----------------------------------------------------------------------------
// Utility functions

function hideSelects()
{
	selects = document.getElementsByTagName( "select" );
	for (i = 0; i != selects.length; i++)
		selects[i].style.visibility = "hidden";
}

function showSelects() 
{
	selects = document.getElementsByTagName( "select" );
	for (i = 0; i != selects.length; i++)
		selects[i].style.visibility = "visible";
}
