﻿
// Slide show with Ken Burns effect...

var $SiteRoot = "";
var delay = 5;
var $slideshow;
var $slides = [
			{
				src: SiteRoot + "images/slideshow/" + 'HH-1.jpg',
				href: SiteRoot + "page.aspx/The-Eagle",
				from: '100% 80% 0.85x',
				to: '100% 0% 0.701x',
				time: delay
			}, {
				src: SiteRoot + "images/slideshow/" + 'HH-2.jpg',
				href: SiteRoot + "page.aspx/History-$-Heritage",
				from: 'bottom left 1x',
				to: 'top right 0.701x',
				time: delay
			}, {
				src: SiteRoot + "images/slideshow/" + 'NL-1.jpg',
				href: SiteRoot + "page.aspx/Nature-$-Landscape",
				from: '60% 40% 1.3x',
				to: '100% 0% 0.876x',
				time: delay
			}, {
				src: SiteRoot + "images/slideshow/" + 'NL-2.jpg',
				href: SiteRoot + "page.aspx/Nature-$-Landscape",
				from: '0% 70% 1.4x',
				to: '100% 0% 0.876x',
				time: delay
			}, {
				src: SiteRoot + "images/slideshow/" + 'OA-1.jpg',
				href: SiteRoot + "page.aspx/The-Eagle",
				from: '80% 20% 1.2x',
				to: '100% 0% 0.701x',
				time: delay
			}, {
				src: SiteRoot + "images/slideshow/" + 'OA-2.jpg',
				href: SiteRoot + "page.aspx/Outdoor-$-Active",
				from: '50% 50% 1.2x',
				to: '100% 0% 0.701x',
				time: delay
			}
		];

var $slidesMain = $slides;

$.fn.KenBurnsShow = function(SiteRoot) {
	$SiteRoot = SiteRoot;
	$slideshow = $(this);

	$slideshow.crossSlide({
			fade: 1,
			variant: true,
			easing: 'easeInOutQuad'
		}, $slidesMain, function(idx, img, idxOut, imgOut) {
			if (idxOut == undefined) {
				// starting single image phase, put up caption
				//$('div.caption').text(captions[idx]).fadeIn()
			}
			else {
				// starting cross-fade phase, take out caption
				//$('div.caption').fadeOut()
			}
		});
}


$(document).ready(function() {
	$('.slider .thumbnail').mouseover(function() {
		$('.slider .thumbnail').removeClass('hover');
		$(this).addClass('hover');
	});

	$('.slider .thumbnail').mouseout(function() {
		$('.slider .thumbnail').removeClass('hover');
	});

	$('.slider .thumbnail').click(function() {
		reArrange(parseInt($(this).children('img').attr("alt")));
		$slideshow.KenBurnsShow($SiteRoot);
	});
});


function reArrange(index) {
	var size = $slides.length;
	$slidesMain = [];

	for (var i = index; i < size; i++) {
		$slidesMain.push($slides[i]);
		if ((i == (size - 1)) && size != index) {
			i = -1;
			size = index;
		}
	}
}
