//AJAX Scripts.
//Sends an HTTP get request to the supplied url for the supplied xmlHttp object.
function ajaxSend( xmlHttp, url ) 
{
	url = url + "&rid=" + Math.random() ; //Block from retrieving cached page

	xmlHttp.open( "GET", url, true ) ;
	xmlHttp.send( null ) ;
}

//Function is the pointer to the func which will be fired after the request. Returns the xmlHttp object.
function ajaxCon( func, type )
{
	//Make default value for Mime type HTTP
	if( arguments.length == 1 )
		type = 'HTTP' ;

	xmlHttp = GetXmlHttpObject( type ) ;

	if( xmlHttp == null )
	{
		//Do something that lets the user know the class will not be loaded
		return ;
	}

	if( 'XML' == type )
	{
		if( xmlHttp.overrideMimeType )
			xmlHttp.overrideMimeType( 'text/xml' ) ;
	}	

	xmlHttp.onreadystatechange = function() { func( xmlHttp ) ; } ;

	return xmlHttp ;
}

function ajaxReady( xmlHttp )
{
	if( xmlHttp.readyState == 4 || xmlHttp.readyState == "complete" )
		return true ;
	else
		return false ;
}

//Retrieves the XmlHttpObject used for querying the server.
function GetXmlHttpObject( type )
{
	var xmlHttp = null ;

	try {
		//Firefox, Safari, Opera 8.0+ supported call
		xmlHttp = new XMLHttpRequest() ;

	} catch(e) {
		//IE Supported
		try {
			xmlHttp = new ActiveXObject( "Msxm12.XMLHTTP" ) ;
		} catch(e) {
			try {
				xmlHttp = new ActiveXObject( "Microsoft.XMLHTTP" ) ;
			} catch(e) {
				alert( 'Your browser does not support AJAX!' ) ;
			}
		}
	}

	return xmlHttp ;
}
//-- Done with ajax setup functions

//Converts the response text to XML
function responseTextToXML( response )
{
	//var d = new ActiveXObject( "MSXML.DomDocument
}

function getResponseXML( xmlHttp )
{
	var xmlDoc = null ;

	if( window.ActiveXObject )
	{
		xmlDoc = xmlHttp.responseXML.documentElement ;
	}
	else if (document.implementation && document.implementation.createDocument)
	{
		xmlDoc = xmlHttp.responseXML ;	
	}

	return xmlDoc ;
}

function loadXML( doc )
{
	var xmlDoc;

	alert( "doc is: " + doc ) ;
	// code for IE
	if (window.ActiveXObject)
  	{
  		xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
  		xmlDoc.async=false;
  		xmlDoc.load( doc );
  		getmessage();
  	}
	// code for Mozilla, Firefox, Opera, etc.
	else if (document.implementation && document.implementation.createDocument)
  	{
		alert( 'Maybe?' ) ;
  		xmlDoc=document.implementation.createDocument("","",null);
  		xmlDoc.load( doc );
  		xmlDoc.onload=getmessage;
		alert( 'YAY' ) ;
  	}
	else
  	{
  		alert('Your browser cannot handle this script');
  	}

	alert( 'We have set out doc!' ) ;

	return xmlDoc ;
}


//------- Scripts for Image Gallery ------------

//---------- Image gallery event handlers --------
	var preload_imgs = new Array() ;

	var num_thumbs = 5 ;
	var cur_start = 0 ;
	var selected_thumb = 1 ;
	var images = new Array() ;

	//Preloads the images in the img_list from index start to index end
	function preloadImages( img_list, start, end )
	{
		for( i = start ; i < img_list.length && i <= end ; i++ )
		{
			preload_imgs[ i ] = new Image() ;
			preload_imgs[ i ].src = img_list[ i ].getElementsByTagName( 'main_url' )[0].firstChild.nodeValue ;
		}
	}

	//Called automatically as a result of updateNameImage()
	function receiveGalleryXML( xmlHttp )
	{
		var xmlDoc = null ;

		if( ajaxReady( xmlHttp ) )
		{
			xmlDoc = getResponseXML( xmlHttp ) ;
	
			//Modify the gallery elements	

			tmpList = xmlDoc.getElementsByTagName( 'image' ) ;

			//Convert nodelist of images to array
			for( i = 0 ; i < tmpList.length ; i++ )
				images[ i ] = tmpList[ i ] ;

			images.reverse() ;

			preloadImages( images, 0, num_thumbs ) ;
			
			cur_start = updateThumbs( images, 0 ) ;
			setSelectedThumb( 1 );

			//Initialize the scrollers
			document.getElementById( 'l_hand' ).innerHTML = "<a href='javascript: thumbsLeft() ;' ><img src='images/l_hand.jpg' /></a>" ;
			document.getElementById( 'r_hand' ).innerHTML = "<a href='javascript: thumbsRight() ;' ><img src='images/r_hand.jpg' /></a>" ;
		}
	}
	
	function getGalleryXML( name, parent_dir )
	{
		xmlHttp = ajaxCon( receiveGalleryXML, 'XML' ) ;

		if( 1 == arguments.length )
			ajaxSend( xmlHttp, "image_scroller.php?page=" + name ) ;
		else
			ajaxSend( xmlHttp, "image_scroller.php?page=" + name + "&dir=" + parent_dir ) ;
	}

	//Updates the set of thumbnail images displayed. Images is an array of image XML elements. stindex is
	//start index used in referencing the images array for the thumbnails and main url.
	function updateThumbs( images, stindex )
	{
		var count = 1 ;
		
		if( stindex < 0 )
			stindex = 0 ;

		//Preload the main_url images for the next 6 thumbs who's thumbs are being loaded
		preloadImages( images, stindex, stindex + num_thumbs ) ;

		if( stindex < images.length )
		{
			for( i = stindex ; ( i < images.length ) && ( i < stindex + num_thumbs ) ; i++ )
			{
				thumb_div = document.getElementById( "thumb_" + count ) ;
				mainHtml = "<a name='image_" + i + "' href='javascript: setSelectedThumb( " + count + " ) ;' />" ;
				thumbHtml = "<img src='" + images[i].getElementsByTagName( 'thumb_url' )[0].firstChild.nodeValue + "' /> " ;
				newHtml = mainHtml + thumbHtml ;

				thumb_div.innerHTML =  newHtml ;

				count++ ;
	
				//If we are at the image maximum but dont have 5 for the page then make the remaining images blank.
				if( i == images.length-1 && count <= num_thumbs )
				{
					for( j = count ; j <= num_thumbs; j++ )
					{
						thumb_div = document.getElementById( "thumb_" + j ) ;
						thumb_div.innerHTML = '' ;
					}
				}
			}
		}

		return( stindex ) ;
	}


	//Sets the thumbnail image to selected.  This function controls the thumb display, main image display and selected thumb	
	function setSelectedThumb( thumb_id )
	{

		if( thumb_id < 1 )
		{
			if( cur_start != 0 )
			{
				cur_start = updateThumbs( images, cur_start - num_thumbs ) ;
				thumb_id = num_thumbs ;
			}
			else
			{
				thumb_id = 1 ;
			}
		}
		else if( thumb_id > 5 )
		{
			//Make sure that there are images past the current thumb set
			if( cur_start + num_thumbs < images.length )
			{
				cur_start = updateThumbs( images, cur_start + num_thumbs ) ;
				thumb_id = 1 ;
			}
			else
				thumb_id = 5 ;
		}
		
		thumb_id_str = 'thumb_' + thumb_id ;
		var a = document.getElementById( thumb_id_str ).getElementsByTagName( 'a' )[0] ;
		
		//Make sure that we are not trying to display past the amount of images we have.
		if( !a )
		{
			thumb_id = selected_thumb ;
			thumb_id_str = 'thumb_' + thumb_id ;
			a = document.getElementById( thumb_id_str ).getElementsByTagName( 'a' )[0] ;
		}

		image_name =  a.name ;
		image_id = image_name.slice( image_name.indexOf( '_' ) + 1 ) ;

		//Load the main image based on the selected thumb
		displayImg( image_id, thumb_id_str ) ;	

		selected_thumb = thumb_id ;
	}


	function thumbsLeft( )
	{
		setSelectedThumb( selected_thumb - 1 ) ;
	}


	function thumbsRight( )
	{
		setSelectedThumb( selected_thumb + 1 ) ;
	}


	//Clears all thumb borders
	function resetThumbBorder()
	{
		for( i = 0 ; i < num_thumbs ; i++ )
		{
			var style = document.getElementById( 'thumb_' + (i+1) ).style ;
			style.borderWidth = '1px' ;
			style.borderStyle = 'none' ;
		}
	}


	//Thumb is a string representing the id of the thumbnail to set the border for.
	function setThumbBorder( thumb )
	{
		var style = document.getElementById( thumb ).style ;
		style.borderWidth = '1px' ;
		style.borderColor = '#96BD3A' ;
		style.borderStyle = 'solid' ;
	}


	//Displays the main image and sets the corresponding thumbnail border to show the thumb is 'selected'
	function displayImg( index, thumb )
	{
		var target = document.getElementById( 'lg_image' ) ;	

		//Reset all thumb border styles to none
		resetThumbBorder() ;

		setThumbBorder( thumb ) ;

		//Setup our fading in/out images
		var in_url = images[ index ].getElementsByTagName( 'main_url' )[0].firstChild.nodeValue ;
		var out_url = document.getElementsByName( 'in_img' )[ 0 ] ;
		out_url = out_url ? out_url.src : "" ;

		var posX = target.style.left ;
		var posY = target.style.top ;

		target.innerHTML = "<img name='out_img' src='" + out_url + "' style='opacity: 1 ; left: " + posX + "; top: " + (out_url == "" ? -500 : posY) + "; position: absolute ; z-index:50 ; ' />" ;
		target.innerHTML += "<img name='in_img' src='" + in_url + "' style='opacity: 0 ; left: " + posX + "; top: " + posY + "; position: absolute;  z-index:25 ;' />" ;

		for( i = 0 ; i <= 100 ; i++ )
		{
			setTimeout( 'fadeOutImg(' + (10-i/10) + ', \"out_img\" )', 8*i ) ;
			setTimeout( 'fadeInImg(' + (i/10) + ', \"in_img\" )', 8*i ) ;
		}
		
	}

	function fadeInImg( value, name )
	{
		var target = document.getElementsByName( name )[0] ;
		target.style.opacity = value / 10;
		target.style.filter = 'alpha(opacity=' + value * 10 + ')';
	}


	function fadeOutImg( value, name ) 
	{
		var target = document.getElementsByName( name )[0] ;
		target.style.opacity = value / 10;
		target.style.filter = 'alpha(opacity=' + value * 10 + ')';
	}