(function($){

	numImages = 0;
	filenameArray = [];
	captionArray = [];
	index1 = 0;				// index into array
	index2 = 0; 			// index into array
	flag = 1;				// for tracking the opcaity of img2 (0 or 1)
	
	$.fn.fadeInOut = function() {
	
		
		function fade() {
        	timer = setInterval(function() {
        
				if(flag == 1) {
	            	flag = 0;
	                       
		        } else {
		        	flag = 1;
		        }
				
				// fade the top image in and out then swap the image that is hidden 
	            $('#main_image_2').animate(
	            { opacity: flag },
	            {
	                duration: 3000, 
	                easing: 'swing', 
	                complete: function() { // swap the images
	                    
						
	                    if (flag == 1) {	// flag is 1 so img2 has an opacity of 1. Swap out img1 .
	                        
							$('#img1').attr('src', filenameArray[index1]);
			
							if (index1 == (numImages/2)-1) {// catch situation when index1 has restarted and index2 has not
								$('#theCaption').html(captionArray[numImages]);
							} else {
								$('#theCaption').html(captionArray[index2]);
							}
							
							// return the index to the begining
							if (index1 == (numImages/2)-1) {
								index1 = 0;
							} else {
								index1++;
							}
							
							
	                    } else {	// flag is 0 so img2 has an opacity of 0. Swap out img2.
	                         
							$('#img2').attr('src', filenameArray[index2]);
			
							if (index2 == (numImages/2)) { // catch situation when index2 has restarted and index1 has not
								$('#theCaption').html(captionArray[(numImages/2)]);
							} else {
								$('#theCaption').html(captionArray[index1]);
							}
							
							// return the index to the begining
							if (index2 == numImages-1) {
								index2 = numImages/2;
							} else {
								index2++;
							}  
	                    }  
	                 }
	            });
  
			},7000);
    	}               
    
    	fade();		// start the fading
	};
	
})(jQuery);


// Load the images and caption from the XML file
(function($){
	
	$.fn.getImages = function() {
	
		// get the XML from the server, parse it, and save info in arrays
		$.get('_images/flash_intro/images.xml', function(data) {
			
			indexArray = 0;
			$(data).find("image").each(function()
			{
				filenameArray[indexArray] = '_images/flash_intro/' + $(this).find("filename").text();
				captionArray[indexArray+1] = $(this).find("caption").text();
				indexArray++;
				
			});
			
			numImages = indexArray;
			startIndex = Math.floor(Math.random()*((numImages/2)-1)); // generate random starting point (subtract one so we don't start at the end of the array)
			
			index1 = startIndex;
			index2 = startIndex + (numImages/2); // start the index at the mid point on the array
			
			// load the first image and caption
			$('#main_image_2').html("<img id='img2' src='" + filenameArray[index2] + "' width='750' height='231' alt='' border='0'>");
			$('#theCaption').html(captionArray[index2+1]);
			
			// load the secon image. One seconde delay to prevent flicker
			$('#main_image_1').delay(1000).html("<img id='img1' src='" + filenameArray[index1] + "' width='750' height='231' alt='' border='0'>");
			
			index1++;
			index2++;
			
		});
	};
	
})(jQuery);


	
