/// <reference path="/Scripts/jquery.intellisense.js"/>

var picHolderWidth;
var picGap;
var leftPos;
var centrePos;
var rightPos;
var offPos
var peekWidth = 20;
var picWidth = 664;
var isSliding = false;
var picCount;
var mouseX;
var mouseY;

$(document).ready(function() {
	picHolderWidth = $('.PicHolder').width();
	picGap = (picHolderWidth / 2) + (picWidth / 2) - peekWidth;
	centrePos = (picHolderWidth / 2) - (picWidth / 2);
	picCount = $('.Pic').length;
	SetPositions();
	SetNavigation();

	$(window).resize(function() {
		picHolderWidth = $('.PicHolder').width();
		picGap = (picHolderWidth / 2) + (picWidth / 2) - peekWidth;
		centrePos = (picHolderWidth / 2) - (picWidth / 2);
		SetPositions();
	});

	$(document).mousemove(function(e) {
		mouseX = e.pageX;
		mouseY = e.pageY;
	});

	$('.Pic').mouseenter(function() {
		Peek(this);
	});

	$('.Pic').mouseleave(function() {
		$(this).css('cursor', 'default');
		if (!isSliding) {
			var pos = parseInt($(this).attr('pos'));
			switch (pos) {
				case -1:
					$(this).find('.PicSliderArrow').hide();
					$(this).animate({ left: GetLeftOffset(pos) + 'px' }, 100);
					break;
				case 1:
					$(this).find('.PicSliderArrow').hide();
					$(this).animate({ left: GetLeftOffset(pos) + 'px' }, 100);
					break;
			}
		}
	});

	$('.Pic').click(function() {
		if (!isSliding) {
			var clickPos = parseInt($(this).attr('pos'));
			Slide(clickPos);

			if (window.homeSliderTimer) {
				clearTimeout(homeSliderTimer);
				homeSliderTimer = setTimeout(SlideHomePics, 7000);
			}
		}
	});
});

function Slide(clickPos) {
	isSliding = true;
	var newCenterPic;

	$('.Pic').each(function() {

		// Determine the new position for each pic
		var newPos = parseInt($(this).attr('pos')) - clickPos;
		var newOffset = GetLeftOffset(newPos);
		$(this).animate({ left: newOffset + 'px' }, 800, 'easeInOutCubic', function() {
			if (newPos < -1) {
				newPos = newPos + picCount;
				$(this).attr('pos', (newPos));
				$(this).css('left', GetLeftOffset(newPos) + 'px');
			}
			else if (newPos >= (picCount - 1)) {
				newPos = newPos - picCount;
				$(this).attr('pos', newPos);
				$(this).css('left', GetLeftOffset(newPos) + 'px');
			}
			else {
				$(this).attr('pos', newPos);
			}
			isSliding = false;

			// If this is the end of the animation for the -1 or 1 pic, check if the mouse is still over and peek
			if (newPos == -1 || newPos == 1) {
				if (mouseX > $(this).offset().left && mouseX < ($(this).offset().left + $(this).width()) && mouseY > $(this).offset().top && mouseY < ($(this).offset().top + $(this).width())) {
					Peek(this);
				}
			}

		});
		$(this).find('.PicSliderArrow').hide();

		if (newPos == 0) {
			newCenterPic = this;
		}
	});

	var id = $(newCenterPic).attr('id').substring(3);
	ClearNavigation();
	SetSelectedNavigation(id);

}

function Peek(thisPic) {
	if (!isSliding) {
		var pos = parseInt($(thisPic).attr('pos'));
		switch (pos) {
			case -1:
				$(thisPic).animate({ left: (GetLeftOffset(pos) + peekWidth) + 'px' }, 100);
				$(thisPic).css('cursor', 'pointer');
				$(thisPic).find('.PicSliderArrow').css('left', ($(thisPic).width() - $(thisPic).find('.PicSliderArrow').width()) + 'px');
				$(thisPic).find('.PicSliderArrow').css('background-image', 'url(/Images/SliderArrowRight.gif)');
				$(thisPic).find('.PicSliderArrow').show();
				break;
			case 1:
				$(thisPic).animate({ left: (GetLeftOffset(pos) - peekWidth) + 'px' }, 100);
				$(thisPic).css('cursor', 'pointer');
				$(thisPic).find('.PicSliderArrow').css('left', '0px');
				$(thisPic).find('.PicSliderArrow').css('background-image', 'url(/Images/SliderArrowLeft.gif)');
				$(thisPic).find('.PicSliderArrow').show();
				break;
			case 0:
				$(thisPic).css('cursor', 'default');
				$(thisPic).find('.PicSliderArrow').hide();
				break;
		}
	}
}


function ClearNavigation() {
	$(".SliderNavSelected").fadeOut(700);
}

function SetNavigation() {
	$('.SliderNavItem').click(function() {
		var id = $(this).attr('id').substring(3, $(this).attr('id').indexOf("Nav"));
		$('#Pic' + id).click();
		SetSelectedNavigation(id);
	});
}

function SetSelectedNavigation(id) {
	setTimeout("ShowSelectNavigation(" + id +")", 700);
}

function ShowSelectNavigation(id) {
	var navWidth = 14;
	var navMargin = 6;
	if (id == -1) id = $(".SliderNavItem").length - 1;
	$(".SliderNavSelected").css('left', ((id * navWidth) + (id * navMargin)) + 'px');
	$(".SliderNavSelected").fadeIn(700);
}

function SetPositions() {
	$('.Pic').each(function(i) {
		var pos = parseInt($(this).attr('pos'));
		$(this).css('left', GetLeftOffset(pos) + 'px');
		$(this).fadeIn(20);
	});
}

function GetLeftOffset(pos) {
	return centrePos + (picGap * pos);
}