// init vars
var imageTotal;
var imageNo;
var aniRunning = false;
var slideRunning = true;

var imageDir = "images/";

var imageArray = new Array();

var imageWidth;

var slideInterval;

$(document).ready(function() {

	getTotal();
	
	// image resize
	$(window).bind("resize", resizeWindow);
	function resizeWindow( e ) {
		imageResize();
		
		
	}
});


// FUNCTIONS BELOW
// resize image
function imageResize(){
	
		
	var maxWidth = $(window).width();
	var maxHeight = $(window).height();
	
	var centerX = maxWidth/2;
	var centerY = maxHeight/2;
	
	var imageWidth = $("#imageHolder").width();
	var newImageLeft = centerX - imageWidth/2;
	var newThumbLeft = centerX - 30;
	
	$("#imageHolder").css("left", newImageLeft );
	$("#imageHolder").css("width", imageWidth );
	
	$("#thumbHolder").css("left", newImageLeft );
	$("#thumbHolder").css("width", imageWidth );
	
	$("#thumbs").css("left", newThumbLeft );
	$("#thumbs").css("width", "60px" );
	
	$("#imageHolder").css("top", "0px" );
}

// get image total
function getTotal(){
	$.get(imageDir + imageGallery + "/thumbs/files.php", function(data){
		
		imageArray = data.split("|");
		imageArray.pop();
		imageTotal = imageArray.length;
		imageNo = 1;
		loadNavi();
		// load thumbnails
		loadThumbs();
	});
}

function loadNavi(){
	
	$('#thumbs-li').prepend('<li><a class="prev-btn" href="#" onclick="prevClick();return false;"></a></li>');
	
	$('#thumbs-li').append('<li><a class="thumbs-btn" href="#" onclick="thumbsClick();return false;"></a></li>');
	
	$('#thumbs-li').append('<li><a class="next-btn" href="#" onclick="nextClick();return false;"></a></li>');
	loadImage();
}

function thumbsClick(){
	if($("#imageHolder").is(":visible") == true){
		// fadeout image
		$('#imageHolder').fadeOut('slow', function() {
			// fade in thumbs
			$('#thumbHolder').fadeIn('slow', function() {
				// Animation complete
			});
		});
	} else {
		// fadeout thumbs
		$('#thumbHolder').fadeOut('slow', function() {
			// fade in image
			$('#imageHolder').fadeIn('slow', function() {
				// Animation complete
			});
		});
	}
}

function loadThumbs(){
	for(var i = 1; i <= imageTotal; i++){
		thumbPath = '<a id="' + i + '" href="#" onclick="thumbClick(this.id);return false;"><img src="' + imageDir + imageGallery + '/thumbs/' + i + '.jpg" alt="Laura Edwards Photography" /></a>';
		
		$('#thumbnails').append(thumbPath);
	}
}

function thumbClick(imageID){
	imageNo = imageID;
	fadeOutImage();
}

function prevClick(){
	if(imageNo > 1){
		imageNo--;
	} else {
		imageNo = imageTotal;
	}
		
	fadeOutImage();
}

function nextClick(){
	if(imageNo < imageTotal){
		imageNo++;
	} else {
		imageNo = 1;
	}
		
	fadeOutImage();
}

// fade out image
function fadeOutImage(){
	// check if image is showing
	if($("#imageHolder").is(":visible") == true){
		// fadeout previous image
		$('#imageHolder').fadeOut('slow', function() {
			$("#imageHolder img").remove();
			loadImage();
		});
	} else {
		// fadeout thumbs
		$('#thumbHolder').fadeOut('slow', function() {
			$("#imageHolder img").remove();
			loadImage();
		});
	}
}

// load image
function loadImage(){
	$("#imageHolder img").remove();
	
	imagePath = '<img src="' + imageDir + imageGallery + '/full/' + imageNo + '.jpg" id="image" />';
	
	$('#imageHolder').prepend(imagePath);
	
	$("#imageHolder img").load(function(){
		
		var imageHeight = "100%";
		$("#imageHolder img").css("height", imageHeight );
		imageResize();
		
		// fade in div
		fadeInImage();
	});
	
}

// fade in image
function fadeInImage(){
	$('#imageHolder').fadeIn('slow', function() {
		// Animation complete
	});
}

function wipeInImage(){
	var pic = $("#fullImage");
	imageWidth = $("#fullImage img").width();
	var imageX = 0 - imageWidth;
	pic.css("left", imageX );
	pic.stop().animate({"left": "+=" + imageWidth + "px"},  "medium", function(){
		// Animation complete
		aniRunning = false;
		
		if(slideRunning == true){
			// slideshow
			slideInterval = setInterval("slideShow()", 5000);
		}
	});
}

function prevNext(shID){
	// pause slideshow
   	$('.pauseBtn').css("display", "none" );
   	$('.playBtn').css("display", "inline" );
   		
   	slideRunning = false;
	clearInterval(slideInterval);
	
	if(shID == "prev") {
		if(aniRunning == false){
			aniRunning = true;
			if(imageNo > 1){
				imageNo--;
			} else {
				imageNo = imageTotal;
			}	
			wipeOutImage();
		}
	} else {
		if(aniRunning == false){
			aniRunning = true;
			if(imageNo < imageTotal){
				imageNo++;
			} else {
				imageNo = 1;
			}
			wipeOutImage();
		}
	}
}


// slideshow
function slideShow(){
	clearInterval(slideInterval);
	if(aniRunning == false){
		aniRunning = true;
		if(imageNo < imageTotal){
			imageNo++;
		} else {
			imageNo = 1;
		}
		
		wipeOutImage();
	}
}

function playPause(shID) {
	if(shID == "pause"){
		// pause slideshow
   		$('.pauseBtn').css("display", "none" );
   		$('.playBtn').css("display", "inline" );
   		
   		slideRunning = false;
   		clearInterval(slideInterval);
   	} else {
   		// play slideshow
   		$('.pauseBtn').css("display", "inline" );
   		$('.playBtn').css("display", "none" );
   		
   		slideRunning = true;
   		slideInterval = setInterval("slideShow()", 5000);
   	}
}
