function interactive_slider() {
	this.images = {
		"image_1": "/fusion/interactive/slides/slide-1.jpg",
		"image_2": "/fusion/interactive/slides/slide-2.jpg",
		"image_3": "/fusion/interactive/slides/slide-3.jpg",
		"image_4": "/fusion/interactive/slides/slide-4.jpg",
		"image_5": "/fusion/interactive/slides/slide-5.jpg",
		"image_6": "/fusion/interactive/slides/slide-6.jpg",
		"image_7": "/fusion/interactive/slides/slide-7.jpg",
		"image_8": "/fusion/interactive/slides/slide-8.jpg",
		"image_9": "/fusion/interactive/slides/slide-9.jpg"
	};
	this.imageLoaded = {
		"1": "false",
		"2": "false",
		"3": "false",
		"4": "false",
		"5": "false",
		"6": "false",
		"7": "false",
		"8": "false",
		"9": "false"
	};
	this.rotate_delay = 10000; // milliseconds in between auto-rotation
	this.slide_speed = 1000; // milliseconds to change slides
	this.slide_width = 994;
	this.slide_height = 414;
	this.slide_load_sections = 4;
	this.slide_load_section_width = this.slide_width/4;
	this.position = {"left": 0,"top": 0};
	this.colors = {
		"slide_1": "lblue",
		"slide_2": "red",
		"slide_3": "orange",
		"slide_4": "green",
		"slide_5": "purple",
		"slide_6": "yellow",
		"slide_7": "yellow",
		"slide_8": "orange",
		"slide_9": "lblue"
	};
	this.palette = {
		"dblue": {
			"light": "#66849d",
			"medium": "#00325b",
			"dark": "#00213b" },
		"silver": {
			"light": "#b4b8bc",
			"medium": "#82898f",
			"dark": "#55595d" },
		"red": {
			"light": "#e69393",
			"medium": "#d54b4b",
			"dark": "#8b3131" },
		"orange": {
			"light": "#f5bb96",
			"medium": "#ef8d50",
			"dark": "#9c5c34" },
		"yellow": {
			"light": "#f5e29e",
			"medium": "#efce5d",
			"dark": "#9c863d" },
		"green": {
			"light": "#acd7b1",
			"medium": "#75bd7d",
			"dark": "#4c7b51" },
		"lblue": {
			"light": "#afcbd9",
			"medium": "#79a9bf",
			"dark": "#4f6e7c" },
		"purple": {
			"light": "#c2bad0",
			"medium": "#9a8cb1",
			"dark": "#645b73" }
	};
	this.origin = {
		"slide_1": {"left": 0, "top": 0},
		"slide_2": {"left": -this.slide_width, "top": 0},
		"slide_3": {"left": -(this.slide_width*2), "top": 0},
		"slide_4": {"left": 0, "top": -this.slide_height},
		"slide_5": {"left": -this.slide_width, "top": -this.slide_height},
		"slide_6": {"left": -(this.slide_width*2), "top": -this.slide_height},
		"slide_7": {"left": 0, "top": -(this.slide_height*2)},
		"slide_8": {"left": -this.slide_width, "top": -(this.slide_height*2)},
		"slide_9": {"left": -(this.slide_width*2), "top": -(this.slide_height*2)}
	};
	this.map = {
		"slide_1": {"left": 9, "up": 9, "right": 2, "down": 4},
		"slide_2": {"left": 1, "up": 7, "right": 3, "down": 5},
		"slide_3": {"left": 2, "up": 8, "right": 4, "down": 6},
		"slide_4": {"left": 3, "up": 1, "right": 5, "down": 7},
		"slide_5": {"left": 4, "up": 2, "right": 6, "down": 8},
		"slide_6": {"left": 5, "up": 3, "right": 7, "down": 9},
		"slide_7": {"left": 6, "up": 4, "right": 8, "down": 2},
		"slide_8": {"left": 7, "up": 5, "right": 9, "down": 3},
		"slide_9": {"left": 8, "up": 6, "right": 1, "down": 1}
	};
	this.current = 1;
	this.current_slideshow_slide = 1;
	this.thumbs = "hidden";
	this.auto = true;
}

var slider = new interactive_slider;


function show_thumbs() {
	slider.auto = false;
	slider.thumbs = "visible";
	hide_arrows();
	$("#dark-out").show();
	$("#dark-out").animate({ opacity: '0.4'});
	$("#slide-thumbs-container").show();
	$("#slide-thumbs-container").animate({ left: '-=' + 432});
}

function hide_thumbs(moveTo) {
	slider.thumbs = "hidden";

	$("#dark-out").animate({ opacity: '0.0'}, function () {
		$("#dark-out").hide();
	});

	$("#slide-thumbs-container").animate({ left: '+=' + 432}, function () {
		$("#slide-thumbs-container").hide();
		if (moveTo) {
			slide_to(parseInt(moveTo.replace('slide-thumb-','')));
		} else {
			reset_slides();
		}
	});	
	
	show_arrows();
}

function show_video() {
	slider.auto = false;
	hide_arrows();
	$("#dark-out").show();
	$("#dark-out").animate({ opacity: '0.4'});
	$("#video-container").show();
	VideoJS.setup();
	$("#video-container").animate({ left: '-=' + 700});
}

function hide_video() {
	$("#dark-out").animate({ opacity: '0.0'}, function () {
		$("#dark-out").hide();
	});

	$("#video-container").animate({ left: '+=' + 700}, function () {
		$("#video-container").hide();
	});	
	
	show_arrows();
}

function show_slide_content() {
	slider.auto = false;
	hide_arrows();
	$("#dark-out").show();
	$("#dark-out").animate({ opacity: '0.6'});
	$("#slide-content-container").show();
	$("#slide-content-container").animate({ left: '-=' + 730});
}

function hide_slide_content() {
	try {
		document.getElementsByTagName("video")[0].pause();
	} catch (err) {
		// Probably IE
	}

	$("#dark-out").animate({ opacity: '0.0'}, function () {
		$("#dark-out").hide();
	});

	$("#slide-content-container").animate({ left: '+=' + 730}, function () {
		$("#slide-content-container").hide();
	});	
	
	show_arrows();
}

function init_slideshow_scroll(container) {
	position = container.find(".slideshow-thumbs").position();
	if (position.top < 0) {
		container.find(".slideshow-up").addClass("enabled");
	}
	if (position.top > -10 && position.top < 10) {
		container.find(".slideshow-up").removeClass("enabled");
	}
	
	thumbs_height = container.find(".slideshow-thumbs").height();
	
	thumb_count = container.find(".slideshow-thumbs div").length;
	
	offset = -(thumbs_height - ((thumb_count-4) * 87));
	
	//alert(offset + "  thumb_count: " + thumb_count + "  thumbs_height: " + thumbs_height + "  top: " + position.top);

	if (thumb_count > 4) {
		container.find(".slideshow-down").addClass("enabled");
	}
	
	if (position.top <= offset && thumbs_height > 0) {
		container.find(".slideshow-down").removeClass("enabled");
	}
}

function init_slideshow(container) {
	$(".slideshow-thumbs div").click(function () {
		section = $(this).parent().parent().parent().parent().find(".slideshow-slides");
		index = $(this).index();
		//alert(section.find("> div").eq(index).html());
		//section.find("> div:visible").hide();
		section.find("> div:visible").fadeOut(function() {
			section.find("> div").eq(index).fadeIn();
		});
		//section.find("> div:visible").fadeOut(function() {
		//	section.find("> div").eq(index).fadeIn();
		//});
		return false;
	});
	
	if (container.find(".slideshow-thumbs > div").length > 4) {
		container.find(".slideshow-down").addClass("enabled");
	}
	
	init_slideshow_scroll(container);
	
	$(".slideshow-down").click(function () {
		if ($(this).hasClass("enabled")) {
			$(this).prev().find(".slideshow-thumbs").animate({ top: '-=' + 261 }, function () {
				init_slideshow_scroll($(this).parent().parent());
			});
		}
		return false;
	});
	
	$(".slideshow-up").click(function () {
		if ($(this).hasClass("enabled")) {
			$(this).next().find(".slideshow-thumbs").animate({ top: '+=' + 261 }, function () {
				init_slideshow_scroll($(this).parent().parent());
			});
		}
		return false;
	});
	
}

function slide_reset(current_slide) {
	$("#slide-" + current_slide + " .foreground img").animate({ opacity: '0' }, function () {
		$("#slide-" + current_slide + " .hider").css('left', '0');
		$("#slide-" + current_slide + " .hider").css('top', '0');
	});
	
	if (!$.browser.msie) {
		$("#slide-" + current_slide + "-content").animate({ opacity: '0' });
	} else {
		if ($("#slide-" + slider.current + "-content").hasClass('slide-content-tr')) {
			$("#slide-" + slider.current + "-content").animate({ top: '-300' });
		} else {
			$("#slide-" + slider.current + "-content").animate({ bottom: '-300' });
		}
	}
	
	//$("#slide-" + current_slide + " .foreground").animate({ opacity: 'toggle' }, function() {
	//	$("#slide-" + current_slide + " .hider").animate({ opacity: 'toggle' });
	//});
	//$(".slide .hider").css('display', 'block');
	//$(".slide .foreground").css('display', 'none');
}

function hide_arrows() {
	$("#arrow-l").hide();
	$("#arrow-r").hide();
	$("#arrow-t").hide();
	$("#arrow-b").hide();
}

function show_arrows() {
	$("#arrow-l").show();
	$("#arrow-r").show();
	$("#arrow-t").show();
	$("#arrow-b").show();
}

function reset_slides() {
	position = $("#slides").position();
}

function isLoaded(slidenumber){
	if( slider.imageLoaded[slidenumber] == "false"){
		return false;
	} else {
		return true;
	}
}

function itemImagesLoaded(domObject){
	slider.imageLoaded[slider.current] = "true";
}

function checkLoaded(slidenumber, attempt){
	if (isLoaded(slidenumber) || (attempt>=slider.slide_load_sections)){
		move_progress_to_end();
	} else {
		move_progress(slidenumber, attempt);
	}
}
function move_progress(slidenumber, attempt){
	var nextTry = attempt+1;
	delay = 500 * attempt;
	$("#slide-" + slider.current + " .hider").animate({ left: '+='+slider.slide_load_section_width }, delay, 'linear', function() {
		checkLoaded(slidenumber, nextTry);
	});
}

function move_progress_to_end(){		
	$("#slide-" + slider.current + " .hider").animate({ left: slider.slide_width }, slider.slide_speed, 'easeInOutQuad', function(){
		$("#slide-" + slider.current + " .foreground img").css('opacity', '0');
		$("#slide-" + slider.current + " .foreground img").css('display', 'block');
		$("#slide-" + slider.current + " .foreground img").animate({ opacity: '1' }, slider.slide_speed);
		if (!$.browser.msie) {
			$("#slide-" + slider.current + "-content").animate({ opacity: '1' }, slider.slide_speed);
		} else {
			if ($("#slide-" + slider.current + "-content").hasClass('slide-content-tr')) {
				$("#slide-" + slider.current + "-content").animate({ top: '35' });
			} else {
				$("#slide-" + slider.current + "-content").animate({ bottom: '35' });
			}
		}
	});
}

function slide_callback() {
	reset_slides();
	
	$("#dump").html("<p><strong>Top: " + position.top + "</strong></p><p><strong>Left: " + position.left + "</strong></p><p><strong>Current: " + slider.current + "</strong></p>");

	$("#slide-thumb-preview div").css('background-color', 'white');
	$("#slide-thumb-preview div").css('border', '1px solid #666666');
	$("#slide-thumb-preview-" + slider.current).css('background-color', slider.palette[slider.colors['slide_' + slider.current]].light);
	$("#slide-thumb-preview-" + slider.current).css('border', '1px solid ' + slider.palette[slider.colors['slide_' + slider.current]].dark);
	$("#slide-thumb-preview").css('opacity', '0.6');
	
	//slider.palette[slider.current].medium
	
	$("#slide-" + slider.current + " .foreground").html('<img style="display: none;" src="'+slider.images["image_"+slider.current]+'" />');
	$("#slide-" + slider.current + " .foreground").onImagesLoad({ 
		itemCallback: itemImagesLoaded
    });
	
	checkLoaded(slider.current, 1);
	
	reset_slides();
}

function slide_to(dest) {
	slide_reset(slider.current);
	slider.position.left = slider.origin['slide_' + dest].left;
	slider.position.top = slider.origin['slide_' + dest].top;
	$("#slides").animate({
		left: slider.origin['slide_' + dest].left,
		top: slider.origin['slide_' + dest].top
	}, slider.slide_speed, 'easeInOutQuad', function() {
		slide_callback();
	});
	slider.current = dest;
}

function slide(dir) {
	slider.auto = false;
	slide_reset(slider.current);
	slide_to(slider.map["slide_" + slider.current][dir]);
}

function initialize_slides() {
	for (i=1; i<=9; i++) {
		$("#slide-" + i).css("background-color", slider.palette[slider.colors['slide_' + i]].light);
		$("#slide-" + i + " .hider").css("background-color", slider.palette[slider.colors['slide_' + i]].medium);
	}
}

function random_slide() {
	var rand_no = Math.floor((9-1)*Math.random()) + 1;
	return rand_no;
}

function auto_slide() {
	if (slider.auto == true) {
	
		slide_to(slider.map["slide_" + slider.current].right);
/*		rand = random_slide();
		if (rand == slider.current) {
			slide_to(slider.map["slide_" + rand].right);
		} else {
			slide_to(rand);
		} */
	
		setTimeout('auto_slide()', slider.rotate_delay);
	}
}

function insert_slide_content() {
	$("#interactive").prepend('<div id="arrow-l"><div></div></div>' +
'<div id="arrow-t"><div></div></div>' +
'<div id="arrow-r"><div></div></div>' +
'<div id="arrow-b"><div></div></div>' +
'<div id="dark-out"></div>' +
'<div id="slide-thumbs-container">' +
'	<div id="slide-thumbs-close"></div>' +
'	<div id="slide-thumbs-bg"></div>' +
'	<div id="slide-thumbs">' +
'		<div id="slide-thumb-1"></div>' +
'		<div id="slide-thumb-2"></div>' +
'		<div id="slide-thumb-3"></div>' +
'		<div id="slide-thumb-4"></div>' +
'		<div id="slide-thumb-5"></div>' +
'		<div id="slide-thumb-6"></div>' +
'		<div id="slide-thumb-7"></div>' +
'		<div id="slide-thumb-8"></div>' +
'		<div id="slide-thumb-9"></div>' +
'	</div>' +
'</div>' +
'<div id="slide-content-container">' +
'	<div id="slide-content-close"></div>' +
'	<div id="slide-content-bg"></div>' +
'	<div id="slide-content-wrap">' +
'		<div class="slide-content-not-loaded"></div>' +
'		<div class="slide-content-not-loaded"></div>' +
'		<div class="slide-content-not-loaded"></div>' +
'		<div class="slide-content-not-loaded"></div>' +
'		<div class="slide-content-not-loaded"></div>' +
'		<div class="slide-content-not-loaded"></div>' +
'		<div class="slide-content-not-loaded"></div>' +
'		<div class="slide-content-not-loaded"></div>' +
'		<div class="slide-content-not-loaded"></div>' +
'	</div>' +
'</div>' +
'<div id="slide-thumb-preview">' +
'	<div id="slide-thumb-preview-1"></div>' +
'	<div id="slide-thumb-preview-2"></div>' +
'	<div id="slide-thumb-preview-3"></div>' +
'	<div id="slide-thumb-preview-4"></div>' +
'	<div id="slide-thumb-preview-5"></div>' +
'	<div id="slide-thumb-preview-6"></div>' +
'	<div id="slide-thumb-preview-7"></div>' +
'	<div id="slide-thumb-preview-8"></div>' +
'	<div id="slide-thumb-preview-9"></div>' +
'</div>');
	
	$("#interactive .slide").append('<div class="foreground"></div><div class="image"></div><div class="hider"></div>');
							  
}

$(document).ready(function() {
						   
	insert_slide_content();

	jQuery.fn.fadeToggle = function(speed, easing, callback) { 
	   return this.animate({opacity: 'toggle'}, speed, easing, callback); 
	};

	rand = random_slide();
	
	slider.position.left = slider.origin['slide_' + rand].left;
	slider.position.top = slider.origin['slide_' + rand].top;
	$("#slides").css({
		left: slider.origin['slide_' + rand].left,
		top: slider.origin['slide_' + rand].top
	});	
	slider.current = rand;
		
	initialize_slides();
	
	if (!$.browser.msie) {
		$("#arrow-b").approach({opacity: 1},300);
		$("#arrow-t").approach({opacity: 1},300);
		$("#arrow-l").approach({opacity: 1},600);
		$("#arrow-r").approach({opacity: 1},600);
		$("#slide-thumb-preview").approach({opacity: 1},600);
	} else {
		$(".slide-content").each(function() {
			if ($(this).hasClass('slide-content-tr')) {
				$(this).css({ top: '-300' });
			} else {
				$(this).css({ bottom: '-300' });
			}
		});
	}
	
	$("#arrow-b").click(function() {
		slide("down");
		return false;
	});
   
	$("#arrow-t").click(function() {
		slide("up");
		return false;
	});
   
	$("#arrow-l").click(function() {
		slide("left");
		return false;
	});
   
	$("#arrow-r").click(function() {
		slide("right");
		return false;
	});
	
	/*$("#interactive").touchwipe({
		wipeLeft: function() { slide("right"); },
		wipeRight: function() { slide("left"); },
		min_move_x: 20,
		preventDefaultEvents: true
	});*/
   
	$("#slide-thumb-preview").click(function() {
		if (slider.thumbs == "hidden") {
			slider.thumbs = "visible";
			show_thumbs();
		}
	});
	
	$("#slide-thumb-preview").mouseenter(function() {
		if (slider.thumbs == "hidden") {
			slider.thumbs = "visible";
			show_thumbs();
		}
	});	

	$("#slide-thumbs-container").mouseleave(function() {
		if (slider.thumbs == "visible") {
			slider.thumbs = "hidden";
			hide_thumbs();
		}
	});
	
	$("#slide-thumbs-close").click(function() {
		if (slider.thumbs == "visible") {
			slider.thumbs = "hidden";
			hide_thumbs();
		}
	});

	$("#slide-thumbs div").click(function() {
		hide_thumbs($(this).attr('id'));
		return false;
	});
	
	$("#slideshow-thumbs div").click(function() {
		show_slideshow_slide($(this).attr('id'));
		return false;
	});	
	
	$("#slide-content-close").click(function() {
		hide_slide_content();
		return false;
	});
	
	/*$("#slide-content-container").touchwipe({
		wipeLeft: function() { hide_slide_content(); },
		wipeRight: function() { hide_slide_content(); },
		min_move_x: 20,
		preventDefaultEvents: true
	});	*/

	$("#video-close").click(function() {
		hide_video();
		return false;
	});
	
	/* Activate Slide Content */
	
	$(".slide-content").click(function () {
		container = $("#slide-content-container");
		anchor = $(this).find("a");
		href = anchor.attr('href');
		index = $(this).parent().index();
		//$("#audience-tab-content").addClass("loading");

		new_content = container.find("#slide-content-wrap > div").eq(index);

		if (new_content.hasClass("slide-content-not-loaded")) {
			if (anchor.hasClass("direct")) {
				document.location = href;
				return true;
			}
			$.get(href, function(data) {
				new_content.html(data);
				//alert(data);
				$("#slide-content-wrap > div").hide();
				new_content.removeClass("slide-content-not-loaded");

				if (anchor.hasClass("video")) {
					VideoJS.setup();
				} else if (anchor.hasClass("slideshow")) {
					init_slideshow(new_content);
				}
				
				new_content.show();
			});

		} else {
		
			$("#slide-content-wrap > div").hide();
			/*if (anchor.hasClass("video")) {
				VideoJS.setup();
			} else if (anchor.hasClass("slideshow")) {
				init_slideshow(new_content);
			}*/
			new_content.show();

		}
		
		show_slide_content();
			
		return false;
	});	
	
	slide_callback();
	
	setTimeout('auto_slide()', slider.rotate_delay);
});

/* Images Load Code */

var eventNumber = 1; //so we can track the ordering of the events in the example 
    $(function(){ 
        $('.foreground').onImagesLoad({ 
            itemCallback: itemImagesLoaded, 
            selectorCallback: selectorImagesLoaded 
        }); 
        //itemImagesLoaded (the itemCallback) is invoked once for each item that $('.foreground') encapsulates 
        //i.e. $('.foreground').length == 2 here, so the itemCallback will be invoked twice 
        function itemImagesLoaded(domObject){ 
            //note: this == domObject. domObject will be the <div class="imageSection" /> that has just finished loading all of its images 
            $(domObject).prepend('<div class="loaded">Event #'+(eventNumber++)+': All images have loaded within item ' + displayTxt(domObject) + '</div>'); 
        } 
        //selectorImagesLoaded (the selectorCallback) is invoked only once: when all images that 
        //$('.foreground') encapsulates have loaded 
        function selectorImagesLoaded($selector){ 
            //note: this == $selector. $selector is $('.foreground') here and $selector.length == 2 (since we have 2 imageSection classes on the page) 
            var allLoaded = ""; //build a string of all items within the selector 
            $selector.each(function(){ 
                allLoaded = displayTxt(this) + ', '; 
            }) 
            $('body').prepend('<div class="loaded">Event #'+(eventNumber++)+': All images have loaded within selector $(&quot;' + $selector.selector + '&quot;), which contains the following ' + $selector.length + ' items: ' + allLoaded + '</div>'); 
        } 
        function displayTxt(domObject){ //helper function for displaying results 
            return '&lt;' + domObject.tagName + (domObject.id ? ' id=&quot;' + domObject.id + '&quot;' : '') + '&gt;'; 
        } 
    });
	
/*
 * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
 *
 * Uses the built in easing capabilities added In jQuery 1.1
 * to offer multiple easing options
 *
 * TERMS OF USE - jQuery Easing
 * 
 * Open source under the BSD License. 
 * 
 * Copyright © 2008 George McGinley Smith
 * All rights reserved.
 * 
*/

// t: current time, b: begInnIng value, c: change In value, d: duration
jQuery.extend( jQuery.easing,
{
	def: 'easeOutQuad',
	swing: function (x, t, b, c, d) {
		//alert(jQuery.easing.default);
		return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
	},
	easeInQuad: function (x, t, b, c, d) {
		return c*(t/=d)*t + b;
	},
	easeOutQuad: function (x, t, b, c, d) {
		return -c *(t/=d)*(t-2) + b;
	},
	easeInOutQuad: function (x, t, b, c, d) {
		if ((t/=d/2) < 1) return c/2*t*t + b;
		return -c/2 * ((--t)*(t-2) - 1) + b;
	}
});