// Set up and start the slideshow.
		$.fn.cycle.defaults.speed   = 500;
		$.fn.cycle.defaults.timeout = 4000;
		$(document).ready(function(){
			$('#slideshow').cycle({
			fx:			'fade',
			next:	    	'#next2',
			prev:	    	'#prev2',
			//before:	function(){ PreprocessSlide(this); },
			after:   	function(){ UpdateMetadata(this); },
			speed:		$.fn.cycle.defaults.speed,
		   timeout:    $.fn.cycle.defaults.timeout,
			pause:		0,
			pager:		'#slideshowNavPagination'

			});	
			MouseOutSlideshow();
			
			// Only one image? The slideshow won't run, we'll need to manually get the first image and update
			// the metadata ourselves.
            var ssdiv = document.getElementById('slideshow');
			if(slideshowimgcount==1){
			    if (ssdiv){
			        var firstimg = ssdiv.childNodes[0];
			        if (firstimg){
			            UpdateMetadata(firstimg);
			        }
			    } else {
			        //alert("ssdiv failure");
			    }
			}
		});
		
		// Global variables
		var $currentlypaused = false;												// As far as the control's concerned, am I paused?
		var $ie6 = $.browser.msie && /MSIE 6.0/.test(navigator.userAgent);

		
		// Toggles the pause state of the slideshow.
		function docpause()
		{
		//$('#slideshow').cycle('togglepause');
		//$currentlypaused = $('#slideshow').cyclePaused() == 1;			// Work out whether I've just paused or not.
		$currentlypaused = !$currentlypaused;
		if ($currentlypaused){														// I'll need to update my UI.
			document.pausebuttonimg.src='resources/button_play.png';
			document.pausebuttonimg.alt='Start slideshow';
		} else {
			document.pausebuttonimg.src='resources/button_pause.png';
			document.pausebuttonimg.alt='Pause slideshow';
		}
		//alert(document['pausebuttonimg'].src);
		return false;
		} 
		

		// Transport button prelight control

		// Setup
		var $partialbtnopacity = 1.0;												// The opacity of the buttons when the slideshow is rolled over.
		var $btnfadetime = 180;														// The speed of the buttons' fade.
		
		
		function PreprocessSlide(sselement){
		var imgelement = sselement.firstChild;
		PositionImage(imgelement, -1);
		}
		
		// Metadata update function
		// Updates the metadata text to reflect the currently shown image.
        function UpdateMetadata(slideshowelement){
        
            var slideshowimage = slideshowelement.childNodes[0];

            // Prepare the string for use - strip the file extension, and split the string.
            var metadata_source = unescape(slideshowimage.src);
            var i=0;
            var lastpoint = metadata_source.lastIndexOf(".");
            if (lastpoint > 0){
                metadata_source = metadata_source.substring(0, lastpoint);
            }
            var metadata_tokens = metadata_source.split('_');
            
            // Get the image name as the title.
            if (metadata_tokens.length > 0){
                var metadata_name = metadata_tokens[1];
                if (metadata_name){
                    var lastslash = metadata_name.lastIndexOf("/");
                    if (lastslash > 0){
                        metadata_name = metadata_name.substring(lastslash + 1, metadata_name.length);
                    }
                }
            } else {
                metadata_name = "Gordon Huether's Art";
            }
            
            // Populate the metadata text.
            SetMetaInfo(document.getElementById('ss_meta_title'), metadata_name);
            SetMetaInfo(document.getElementById('ss_meta_line1'), (metadata_tokens.length>2)?metadata_tokens[2]:"");
            SetMetaInfo(document.getElementById('ss_meta_line2'), (metadata_tokens.length>3)?metadata_tokens[3]:"");
            SetMetaInfo(document.getElementById('ss_meta_line3'), (metadata_tokens.length>4)?metadata_tokens[4]:"");
           
		}
		
		function SetMetaInfo(metaDataElement, metadatatext){
            if (metaDataElement) metaDataElement.innerHTML = metadatatext;
		}
		
		
		function PositionImage(imgelement, nIndex){
				var ssdiv = document.getElementById('slideshow');
				var marginstring = "";
				var thediv = imgelement.parentNode;
				var imgHeight = imgheightarray[nIndex];
				var imgWidth = imgwidtharray[nIndex];
				
				/*
				var tempstr = "";
				tempstr = imgelement.src;
				tempstr = tempstr  + ": ";
				tempstr = tempstr  + imgWidth;
				tempstr = tempstr  + ", ";
				tempstr = tempstr  + imgHeight;
				tempstr = tempstr  + ", index is ";
				tempstr = tempstr  + nIndex;
				*/
				/*
				tempstr = tempstr  + imgelement.width;
				tempstr = tempstr  + ": ";debug
				tempstr = tempstr  + imgWidth;
				tempstr = tempstr  + ", ";
				tempstr = tempstr  + imgelement.height;
				tempstr = tempstr  + ": ";
				tempstr = tempstr  + imgHeight;
				alert(tempstr);
				*/
				
				var imgaspectratio = imgWidth / imgHeight;
				var ssaspectratio = ssdiv.clientWidth / ssdiv.clientHeight;
				if (imgaspectratio > ssaspectratio){
					imgelement.width=ssdiv.clientWidth;
					imgelement.height=imgWidth / imgaspectratio;
					marginstring = (ssdiv.clientHeight - imgHeight) / 2;
					marginstring = marginstring + "px";
					thediv.style.marginTop = marginstring;
					thediv.style.marginLeft = "0px";
				} else {
				  thediv.style.textAlign = "center";
					 thediv.style.marginTop = "0px";
				
				  imgelement.height=ssdiv.clientHeight;
				  imgelement.width=imgHeight * imgaspectratio;
				}
		}
		
		// Event functions
		function MouseOverSlideshow(){									// The mouse is over the slideshow.
			if ($ie6){		
				$("#transportcontrols").stop();
				$("#transportcontrols").animate({ 
					opacity: 1.0
				}, $btnfadetime );
			}
			
			$("#prev2img").stop();
			$("#prev2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#pausebuttonimg").stop();
			$("#pausebuttonimg").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#next2img").stop();
			$("#next2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$('#slideshow').cycle('pause');
//			alert('mouseoverss');
			return true;
		}

		function MouseOutSlideshow(){									// The mouse has left the slideshow (all buttons fade out entirely).
			if ($ie6){		
				$("#transportcontrols").stop();
				$("#transportcontrols").animate({ 
					opacity: 0.0
				}, $btnfadetime );
			}
			
			$("#prev2img").stop();
			$("#prev2img").animate({ 
				opacity: 0.0
			}, $btnfadetime );
			$("#pausebuttonimg").stop();
			$("#pausebuttonimg").animate({ 
				opacity: 0.0
			}, $btnfadetime );
			$("#next2img").stop();
			$("#next2img").animate({ 
				opacity: 0.0
			}, $btnfadetime );
			if (!$currentlypaused) $('#slideshow').cycle('resume');
//			alert('mouseoutss');
			return true;
		}
		
		function MouseOverPrevBtn(){									// The mouse is over the Previous button.
			if ($ie6){		
				$("#transportcontrols").stop();
				$("#transportcontrols").animate({ 
					opacity: 1.0
				}, $btnfadetime );
			}
			
			$("#prev2img").stop();
			$("#prev2img").animate({ 
				opacity: 1.0
			}, $btnfadetime );
			$("#pausebuttonimg").stop();
			$("#pausebuttonimg").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#next2img").stop();
			$("#next2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$('#slideshow').cycle('pause');
//			alert('mouseoverprev');
			return true;
		}

		function MouseOutPrevBtn(){										// The mouse has left the Previous button.
			if ($ie6){		
				$("#transportcontrols").stop();
				$("#transportcontrols").animate({ 
					opacity: 0.0
				}, $btnfadetime );
			}
			
			$("#prev2img").stop();
			$("#prev2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#pausebuttonimg").stop();
			$("#pausebuttonimg").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#next2img").stop();
			$("#next2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			if (!$currentlypaused) $('#slideshow').cycle('resume');
//			alert('mouseoutprev');
			return true;
		}
		
		function MouseOverPauseBtn(){									// The mouse is over the Pause button.
			if ($ie6){		
				$("#transportcontrols").stop();
				$("#transportcontrols").animate({ 
					opacity: 1.0
				}, $btnfadetime );
			}
			
			$("#pausebuttonimg").stop();
			$("#pausebuttonimg").animate({ 
				opacity: 1.0
			}, $btnfadetime );
			$("#prev2img").stop();
			$("#prev2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#next2img").stop();
			$("#next2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$('#slideshow').cycle('pause');
			return true;
		}

		function MouseOutPauseBtn(){									// The mouse has left the Pause button.
			if ($ie6){		
				$("#transportcontrols").stop();
				$("#transportcontrols").animate({ 
					opacity: 0.0
				}, $btnfadetime );
			}
			
			$("#pausebuttonimg").stop();
			$("#pausebuttonimg").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#prev2img").stop();
			$("#prev2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#next2img").stop();
			$("#next2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			if (!$currentlypaused) $('#slideshow').cycle('resume');
			return true;
		}
		
		function MouseOverNextBtn(){									// The mouse is over the Next button.
			if ($ie6){		
				$("#transportcontrols").stop();
				$("#transportcontrols").animate({ 
					opacity: 1.0
				}, $btnfadetime );
			}
			
			$("#next2img").stop();
			$("#next2img").animate({ 
				opacity: 1.0
			}, $btnfadetime );
			$("#prev2img").stop();
			$("#prev2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#pausebuttonimg").stop();
			$("#pausebuttonimg").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$('#slideshow').cycle('pause');
			return true;
		}

		function MouseOutNextBtn(){										// The mouse has left the Next button.
			if ($ie6){		
				$("#transportcontrols").stop();
				$("#transportcontrols").animate({ 
					opacity: 0.0
				}, $btnfadetime );
			}
			
			$("#next2img").stop();
			$("#next2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#prev2img").stop();
			$("#prev2img").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			$("#pausebuttonimg").stop();
			$("#pausebuttonimg").animate({ 
				opacity: $partialbtnopacity
			}, $btnfadetime );
			if (!$currentlypaused) $('#slideshow').cycle('resume');
			return true;
		}