/* Author: Kanwaljit Singh Nagra - http://ksnagra.com */
/* Global Vars */
var animationDuration = 600;
var animationEasing = 'easeOutQuint';
/* vars - general */
var pageTitle = 'James Stenson';
var i= 0;
var windowWrap = $(window);
var screenHeight = 0;
var screenWidth = 0;
/* URL */
var imgCurrent = 0;
var url = window.location.href;
var hash = window.location.hash;
var hashNo =  hash.substring(7);
var indexOfHash = url.indexOf(hash) || url.length;
var hashlessURL = url.substr(0, indexOfHash);
$(function(){
	/* vars site */
	var isHome = false;
	var hdrWrap = $('#header');
	var hdrHeight = hdrWrap.height();
	var hdrOffset = hdrWrap.offset();
	var h1 = $('h1');
	/* vars - images */
	var imgsTotal = 0;
	var imgsArray = new Array();
	var imgsWidth = 0;
	var imgTimer = 0;
	var imgsNav = $('#nav-images');
	var imgsWrapper = $('#wrap-images');
	var imgsWrapperHeight = imgsWrapper.height();
	var imgsWrapperPosition = imgsWrapper.offset();
	var imgScroller = $('#scroller');
	var imagesLinks = $('.image-item');
	var imgsWrapperOffset;
	var imgPrev = 0;
	var imgsViewer = $('#viewer-image');
	var imgsRandom = 0;
	var imgURL = '';
	var imgThumbURL = '';
	var imgLoading = false;
	var imgNew;
	var imgViewerHeight = 0;
	
	if(document.title == pageTitle){
		isHome = true;
	}
	
	/* resize */
	function resetSite(){
		screenWidth = windowWrap.width();
		screenHeight = windowWrap.height();
		if(isHome){
			hdrOffset = hdrWrap.offset();
			imgsViewer.height(hdrOffset.top - 60);
			imgsViewer.width(screenWidth - 40);
		}else{
			if(imgsViewer.length > 0){
				imgsWrapperPosition = imgsWrapper.offset();
				imgsViewer.height(imgsWrapperPosition.top - 40);
				imgsViewer.width(screenWidth - 40);
				if(imgsWrapper.length > 0){
					imgsWrapperOffset = imgsWrapper.offset();
					imgsWrapper.css('max-width',screenWidth - imgsWrapperOffset.left);
				}
			}
		}
		
		imgViewerHeight = imgsViewer.height();
		if($("#viewer-image img").length > 0){
			var imageHolder = $('#viewer-image img');
			var imageMarginTop = (imgViewerHeight - imageHolder.height())/2;
			if(imageMarginTop != 0){
				imageHolder.css('margin-top',imageMarginTop);
			}else{
				imageHolder.css('margin-top',20);
			}
		}
	}
	resetSite();
	windowWrap.resize(resetSite);
	
	function updateImage(imgCurrent){
		if(!($('#viewer-image img').length > 0)){
			imgsViewer.append('<img />');
		}
		$('#viewer-image img').fadeOut(animationDuration, animationEasing, function(){
 			$('<img/>').attr('src',imgsArray[imgCurrent]).load(function() {
				window.location.hash = "#image-"+imgCurrent;
				imgNew = $(this);
				imgNew.hide();
				imgsViewer.html(imgNew);
				imgNew.fadeIn(animationDuration, animationEasing);
				resetSite();
			});
		});
	}
	
	if(!isHome){ // GALLERY PAGES
		//load images
		$.getJSON(hashlessURL+'?json=1',function(data){
			//get total number of images
			imgsTotal = data.page.attachments.length;
			function loadImage(){
				if(i < imgsTotal){
					if(!imgLoading){
						imgLoading = true;
						imgThumbURL = data.page.attachments[i].images.thumbnail.url;
						imgsArray[i] = data.page.attachments[i].images.large.url;
						imgsWidth += data.page.attachments[i].images.thumbnail.width + 1;
						$('<img/>').attr('src', imgThumbURL).load(function() {
								$('<li class="image-item"><a class="image-link" id="image-'+i+'" href="#image-'+i+'"><img src="'+imgThumbURL+'" /></a></li>').hide().appendTo('#scroller').fadeIn(animationDuration, animationEasing);
								imgLoading = false;
								i++;
						});
						//update scroller width
						imgScroller.width(imgsWidth);
						//fade previous thumnail
						if(i != 0){
							imgPrev = i- 1;
						}
						$('.image-item:eq('+imgPrev+')').fadeTo(animationDuration,0.5,animationEasing);
					}
				}else{
					clearInterval(imgTimer);
					imagesLinks = $('.image-item');
					imagesLinks.fadeTo(animationDuration,0.5,animationEasing);
					imgsWrapper.jScrollPane();
					if(!isHome){
						if((hashNo) && (hashNo < imgsTotal)){
							imgCurrent = hashNo;
						}else{
							imgCurrent = 0;
						}
					}
					updateImage(imgCurrent);
					$('.image-item:eq('+imgCurrent+')').fadeTo(animationDuration,1,animationEasing).addClass('current');
					hideNav();
				}
			}
			imgTimer = setInterval(loadImage,25);
		});
		//assign links
		var thisImage;
		imagesLinks.live({
			mouseenter:function(){
				thisImage = $(this);
				if(!thisImage.hasClass('current')){
					$(this).stop().fadeTo(animationDuration,1,animationEasing);
				}
			},
			click:function(){
				if(!imgLoading){
					thisImage = $(this);
					$('.current').trigger('mouseleave');
					imagesLinks.removeClass('current');
					thisImage.addClass('current');
					imgCurrent = imagesLinks.index(thisImage);
					updateImage(imgCurrent);
					return false;
				}
			},
			mouseleave:function(){
				if(!thisImage.hasClass('current')){
					$(this).stop().fadeTo(animationDuration,0.5,animationEasing);
				}
			}
		});
	}else{ // HOMEPAGE INTRO
		$.getJSON(document.URL+'portraits/?json=1',function(data){
			imgsTotal = data.page.attachments.length;
			
			//quickly load images
			for(i=0;i<imgsTotal;i++){
				imgURL = data.page.attachments[i].images.large.url;
				$('<img/>').attr('src', imgURL);
				//$('head').append('<link rel="prefetch" href="'+imgURL+'"><link rel="prerender" href="'+imgURL+'">');
				
			}
			
			function loadImage(){
				clearInterval(imgTimer);
				imgsRandom = Math.floor(Math.random()*imgsTotal);
				if(imgsRandom == imgCurrent){
					if((imgCurrent+1) != imgsTotal){
						imgCurrent++;
					}else{
						imgCurrent--;
					}
				}else{
					imgCurrent = imgsRandom;
				}
				$('<img/>').attr('src', data.page.attachments[imgCurrent].images.medium.url).load(function() {
					imgNew = $(this);
					imgsViewer.fadeIn(animationDuration,animationEasing).html(imgNew).delay(2000).fadeOut(animationDuration, animationEasing, function(){
						imgTimer = setInterval(loadImage,250);
					});
					resetSite();
				});
		
			}
			imgTimer = setInterval(loadImage,250);
			
		});	
	}
	
	
	function hideNav(){
		h1.stop().fadeTo(animationDuration,0.3,animationEasing,function(){
			imgsNav.stop().animate({
				marginLeft:0
			});
		});
	}
	
	var navIndex = 0;
	var navLinks = $('#header a');
	navLinks.hover(function(){
		navIndex = navLinks.index(this);
		h1.stop().fadeTo(animationDuration,1,animationEasing);
		if((navIndex > 2) && (navIndex < 5)){
			imgsNav.stop().animate({
				marginLeft:120
			});
		}
	},function(){
		hideNav();
	});

});