var animSpeed = 300;
	var panelWidth = 653;
	
	jQuery(document).ready(function(){


		// get the page's body class
		var thisPage = jQuery("body").attr("class");

		// initialize by adding our magic slider classes
		jQuery("#showcase").addClass("showcase-slider");
		jQuery("#showcase div.item").addClass("item-slider");


		// and, let's also do something about those previews
		jQuery("ol.previews").addClass("previews-large");

		// however, if there's an .external-link class, load a new window
		jQuery("ol.previews a.external-link").click(function(){
			var urlPath = jQuery(this).attr("href");
			window.open(urlPath, "bcExternal");
			return false;
		});


		// 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;
			jQuery("h3.work-title").text("").prepend('<span class="sectiontitle">Photography Portfolios</span> ' + '- Viewing ' + currentPos + ' of ' + (items.length - 1));
		}
		// set the nav links for the item pager
		function setNav(counter) {
			var next = counter + 1;
			if (counter < (items.length - 1)) {
				jQuery("#pager .next a").attr("href", "#item-" + next);
			}
			var prev = counter - 1;
			if (counter > 1) {
				jQuery("#pager .previous a").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") {
						jQuery("#showcase #" + 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) {
							jQuery("#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
							jQuery("#showcase #" + items[adjacent]).fadeOut(animSpeed * 2, function(){
								jQuery(this).css({left:offsets[adjacent]});
							});
						}
					}
				} else {
					// if we're not going to animate them though, let's just move the offsets
					jQuery("#showcase #" + 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;
		jQuery("div.wrap2a 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 (jQuery(this).hasClass("item")) {
				items[i] = jQuery(this).attr("id");
				i++;
			};
		});


		// initialize starting position
		var currentPanel = 1;
		drawUI(currentPanel, "");

		
		// the meat of the slider. One set for prev, another for next
		jQuery("#pager li.next a").click(function() {
			// let's only do this if there's more to come
			if (currentPanel < (items.length - 1)) {
				currentPanel++;
				drawUI(currentPanel, "right");
			}
			return false;
		});
		jQuery("#pager li.previous a").click(function() {
			// let's only do this if there's more to come
			if (currentPanel > 1) {
				currentPanel--;
				drawUI(currentPanel, "left");
			}
			return false;
		});


	});