/*  Photo Gallery for Stephen Ramsden
 *      Charlie Bates Solar Astronomy Project (charliebates.org)
 *      SolarAstrophotography.com
 *      StephenRamsden.com
 * 
 *  Date:   5 April 2010
 *  Author: Scott Curry (scotterton@gmail.com)
 */

//
// CUSTOMIZABLE SETTINGS - OK to Modify
//////////////////////////////////////////
var fadeTime = 500;					// how quickly an image fades out in milliseconds.
var timeout = 7000;					// time in milliseconds between each image.
var bigPhotoDivId = "#big_photo";	// id of the photo div.
var playToggleId = "#playtoggle";	// id of the play/pause toggle button.
var loadingCssClass = "loading";	// css class to use while loading a photo.


//
// Globals - Do Not Modify
//////////////////////////////////////
var isPaused = true;		
var isFirstLoad = true; 	
var loading = false;
var currentPhotoIndex = 0;	
var photoCount = 0;			
var stillPreloading = false;
var preloadingCounterMaxMS = timeout - 500;
// Timers - Do Not Modify
var timerMain;
var timerFadeOut;
var timerPreload;


function StartSlideshow() {
    photoCount = photos.length;
    isPaused = false;
    
    if (isFirstLoad) {
        currentPhotoIndex = GetRandomPhoto();
        isFirstLoad = false;
    }
    GoToNext();
    
    // main loop body
    ResetMainIntervalTimer();
}

function ResetMainIntervalTimer () {
	if (timerMain != null) 
		window.clearInterval(timerMain);
	
	timerMain = window.setInterval(function(){
        if (!isPaused) {
            GoToNext();
        }
        else
            window.clearInterval(timerMain);
    }, timeout);
}

function PauseSlideshow () {
    isPaused = true;
    window.clearInterval(timerMain);
    window.clearTimeout(timerFadeOut);
}

function TogglePlayPause () {
	if (isPaused) {
		$(playToggleId).html("Pause");
		StartSlideshow();
	}
	else {
		$(playToggleId).html("Play");
		PauseSlideshow();
	}
}

function GoToNext () {
	AdvanceCounter();
    changeBigPhoto(currentPhotoIndex);
}

function GoToPrevious () {
    BackCounter();
    changeBigPhoto(currentPhotoIndex);  
}

function PreloadNext () {
	stillPreloading = true;
	
	// we run this timer in the background and if it fires, the 
	// load is taking too long and we reset the timer
	timerPreload = window.setTimeout(function(){
		ResetMainIntervalTimer();
	}, preloadingCounterMaxMS);

	var nextImage = new Image(640,480);
	
	var nextPhotoIndex = currentPhotoIndex;
	
	if (nextPhotoIndex == photoCount - 1)
        nextPhotoIndex = 0;
    else
        nextPhotoIndex++;
    
    // load up the next image and clear the variables.
    $(nextImage)
    	.load(function(){
    		window.clearTimeout(timerPreload);
    		stillPreloading = false;
    	})
    	.attr("src", photos[nextPhotoIndex]);

}

function AdvanceCounter () {
    if (currentPhotoIndex == photoCount - 1)
        currentPhotoIndex = 0;
    else
        currentPhotoIndex++;
}

function BackCounter () {
    if (currentPhotoIndex == 0)
        currentPhotoIndex = photoCount - 1;
    else
        currentPhotoIndex--;
}

function GetRandomPhoto () {
    return Math.floor(Math.random()*photoCount);
}

function changeBigPhoto (photo_index) {
    // prevent multiple load attempts at the same time
    if (loading)
        return;
    
    loading = true;
    currentPhotoIndex = photo_index;
    
    $(bigPhotoDivId).html("");
    $(bigPhotoDivId).addClass(loadingCssClass);
    
    var img = new Image(640,480);
  
    // wrap our new image in jQuery, then:
    $(img)
        .load(function () {  // once the image has loaded, execute this code
            $(this).hide();
            $(bigPhotoDivId).removeClass(loadingCssClass); // remove the loading class (so no background spinner), 
            $(bigPhotoDivId).append(this);           // then insert our image
            
            $(this).fadeIn();                       // fade our image in to create a nice effect
            loading = false;
            
            // preload the next image
            PreloadNext();
        })  // end of load hook

        // if there was an error loading the image, react accordingly
        .error(function () {
          // notify the user that the image could not be loaded
        })

        // *finally*, set the src attribute of the new image to our image
        // this triggers the load event and our hook above
        .attr('src', photos[photo_index]);
    
        
    //setCounter();
}