﻿/*
'--------------------------------------------------------------------------------------------------
' Title			: Lost Camo Page JavaScript
' Description	: JavaScript functions and declarations for the Innovation > Technology > Lost Camo
'--------------------------------------------------------------------------------------------------
' History
' 02/13/2009	: DPE - Created Page
'--------------------------------------------------------------------------------------------------
*/

/* Slider code originally written by the incredible Dave Shea for http://brightcreative.com/portfolio/ */

	var animSpeed = 250;
	var panelWidth = 750;
	
	$(document).ready(function(){

		// initialize by adding our slidify class
		$("#lostLibrary").addClass("slidify");

		// set all the UI bits in one go
		function drawUI(position, direction) {
			setPosition(position, direction);
			setTitle(position);
			setNav(position);
		}
		
		// set the item title and counter status
		function setTitle(counter) {
			var currentPos = counter;
			$(".img-title").text("").prepend('<span class="counter">Image ' + currentPos + ' of ' + (items.length - 1) + '</span>');
			// let's make sure the title attribute is set first, if not show counter only
			if ($("#item-" + currentPos).attr("title")) {
				var title = $("#item-" + currentPos).attr("title");
				$(".img-title").prepend(title + " ");
			}
		}
		
		// set the nav links for the item pager
		function setNav(counter) {
			var next = counter + 1;
			if (counter < (items.length - 1)) {
				$("#pager a.next").attr("href", "#item-" + next);
			}
			var prev = counter - 1;
			if (counter > 1) {
				$("#pager a.prev").attr("href", "#item-" + prev);
			}
		}
		// set new position of items and slide them in place
		function setPosition(current, direction) {
		
			// current will be index 1
			// but our array is index 0

			var offsets = new Array();
			
			// first, set descending offsets for all items prior to current
			offsetValue = 0;
			// debug:
			//$("body").append(current + "/" + (items.length - 1)  + " | ");
			for (i = current; i > 0; i--) {
				offsetValue = offsetValue - panelWidth;
				offsets[i] = offsetValue;
				// debug:
				//$("body").append("a" + i + " " + offsets[i] + " | ");
			}
			// then, set ascending offsets for all items after current
			offsetValue = 0;
			for (i = current; i <= (items.length - 1); i++) {
				offsetValue = offsetValue + panelWidth;
				offsets[i] = offsetValue;
				// debug:
				//$("body").append("b" + i + " " + offsets[i] + " | ");
			}
			offsets[current] = 0;


			// the adjacent panel is the one we're animating along with the current panel
			// counter-intuitively, it's in the opposite direction that the panels are traveling
			var adjacent = false;
			if (direction == "left") {
				adjacent = current + 1;
			} else {
				adjacent = current - 1;
			}

			// debug:
			// $("body").append("p" + current + " " + adjacent + " | ");
			// $("body").append("<br />");

			for (i = 1; i <= (items.length - 1); i++) {
				// we only want to animate the visible ones
				// otherwise, rapid double-clicks lead to ugly stacking errors
				if ((i == current) || (i == adjacent)) {
					// slide portfolio pages, fade the rest
					//if (thisPage == "portfolio") {
						$("#lostLibBrowser #" + items[i]).animate({left:offsets[i]}, animSpeed);
					
					/*} else {
						// for fades, we need to fade in the current, as we fade out the adjacent
						if (i == current) {
							$("#showcase #" + items[i]).css({left:offsets[i], display:"none"}).fadeIn(animSpeed);
						} else {
							// we'll fade out the adjacent first, then set a callback to move it to its new position
							$("#showcase #" + items[adjacent]).fadeOut(animSpeed * 2, function(){
								$(this).css({left:offsets[adjacent]});
							});
						}
					}*/
				} else {
					// if we're not going to animate them though, let's just move the offsets
					$("#lostLibBrowser #" + items[i]).css({left:offsets[i]});
				}
			}
		}





		// start by getting a list of every "item" div on the page
		var items = new Array();
		var i = 1;
		$("#lostLibBrowser div").each(function(){
			// if we found that "item" class that we're looking for, then let's throw the element's id into our array
			if ($(this).hasClass("item")) {
				items[i] = $(this).attr("id");
				i++;
			};
		});


		// initialize starting position
		var currentPanel = 1;
		drawUI(currentPanel, "");

		
		// the meat of the slider. One set for prev, another for next
		$("#pager a.next").click(function() {
			// let's only do this if there's more to come
			if (currentPanel < (items.length - 1)) {
				currentPanel++;
				drawUI(currentPanel, "right");
			}
			return false;
		});
		$("#pager a.prev").click(function() {
			// let's only do this if there's more to come
			if (currentPanel > 1) {
				currentPanel--;
				drawUI(currentPanel, "left");
			}
			return false;
		});

	});
