// jQuery selectors
var $window;
var $container;
var $objects;
var $clickerContainer;
var $previous;
var $next;
var $navigationArea;
var $navigation;
var $menu;
var $handle;
var $label;
var $counter;
var $branding;
var $link;
var $desc;
var $tags;

// Variables
var windowWidth;
var containerWidth;
var objectCount;
var widths; // Image widths
var cumulativeWidths = [ 0 ]; // Cumulative image widths
var leftOffsets; // Position offsets for clicker and anchor
var position = 0; // Container position
var previousSliderIndex;
var sliderFlipPosition;
var menuWidth;
var category;
var labelMarginLeft;
var picIndex = 0; // current pic
var dir = 0; // click direction (-1 = previous, 0 = init, 1 = next)

// Constants
var objectVisibleClassName = "visible";
var navigationDisallowHideClassName = "disallow";
var menuFlippedClassName = "flipped";
var labelFlippedClassName = "labelFlipped";
var containerBuffer = 512; // Buffer to avoid image wrap. Don't worry won't be visible since the slider won't allow it. :-)
var infoWidth = 432;
var navigationOffset = 61; // Value for the correct location of the slider position.

// define resize handler
$.fn.resizeHandler = function() {
	windowWidth = $window.width();
	sliderFlipPosition = windowWidth - infoWidth;
	containerWidth = cumulativeWidths[objectCount] + containerBuffer;
	
	//$container.css("width", containerWidth);
	
	$.each(widths, function(i, width) {
		$objects.eq(i).css("width", width).css("left", cumulativeWidths[i]);
	});

	//$.fn.showPic();
	
	//$.fn.bindNavigationMouseHandler();

	$link.mousedown(function() {
		window.location.href = $(this).attr("href");
	});

	return $container;
};

$.fn.showHandler = function() {
	$branding.css("visibility", "visible");
	return $container;
}

$.fn.calculate = function(callback) {
	$.getJSON("index.php", {
		rq : "calculate",
		width : $(window).width(),
		height : $(window).height(),
		category : category
	}, function(data) {
		widths = data.widths;
		cumulativeWidths = data.cumulativeWidths;
		leftOffsets = data.leftOffsets;
		menuWidth = $navigation.width();
		$.fn.resizeHandler();
		if (callback != null) {
			callback();
		}
	});
}

//set mouse cursor
$.fn.setMouseCursor = function() {
	if (picIndex >= $objects.length - 1) {
		$previous.css("cursor", "url(fx/back.gif), w-resize");
		$next.css("cursor", "auto");
	} else if (picIndex == 0) {
		$previous.css("cursor", "auto");
		$next.css("cursor", "url(gfx/forward.gif), e-resize");
	} else {
		$previous.css("cursor", "url(gfx/back.gif), w-resize");
		$next.css("cursor", "url(gfx/forward.gif), e-resize");
	}
}

//set pic index
$.fn.setPicIndex = function(index) {
	picIndex = index;
	$counter.empty().append(index + 1 + "/" + objectCount);
	if (!$.browser.msie) {
		window.location.hash = "#" + (index + 1);
	}
	//$branding.append($objects.eq(index).attr("alt"));
}

//show pic
$.fn.showPic = function() {
     position = -cumulativeWidths[picIndex];
     if (position > 0) {
		position = 0;
	 }
	 
	 if (dir < 0) {
	 	$objects.eq(picIndex + 1).fadeTo(200, 0, function() {
	 		//$container.css("left", position);
	 		$objects.eq(picIndex + 1).hide();
	 		$objects.eq(picIndex).show();
	 		$objects.eq(picIndex).fadeTo(200, 1);
	 		$desc.empty().append($objects.eq(picIndex).attr("alt"));
	 		$tags.empty().append($objects.eq(picIndex).attr("title"));
	 	});
	 } else if (dir > 0) {
	 	$objects.eq(picIndex - 1).fadeTo(200, 0, function() {
	 		//$container.css("left", position);
	 		$objects.eq(picIndex - 1).hide();
	 		$objects.eq(picIndex).show();
	 		$objects.eq(picIndex).fadeTo(200, 1);
	 		$desc.empty().append($objects.eq(picIndex).attr("alt"));
	 		$tags.empty().append($objects.eq(picIndex).attr("title"));
	 	});	
	 } else {
	 	$objects.eq(picIndex).css('opacity', 1);
	 	$objects.eq(picIndex).show();
	 	$desc.empty().append($objects.eq(picIndex).attr("alt"));
	 	$tags.empty().append($objects.eq(picIndex).attr("title"));
	 }
	 
}

//init
$(window).ready(function() {
	// jQuery Selectors
	$window = $(window);
	$container = $("div#imageContainer");
	$objects = $container.children();
	$clickerContainer = $("div#clickerContainer");
	$previous = $clickerContainer.children("div#previous");
	$next = $clickerContainer.children("div#next");
	$desc = $("p#description");
	$tags = $("p#tags");
	$navigationArea = $("div#navArea");
	$navigation = $("div#navigation");
	$label = $("div#label");
	$counter = $("p#counter");
	$branding = $("div#branding");
	$link = $("a.link");
    
	// Event handlers
	$("a.mail").click(function(event) {
		event.preventDefault();
		var s = $(this).attr("href");
		var n = 0;
		var r = "";
		for ( var i = 0; i < s.length; i++) {
			n = s.charCodeAt(i);
			if (n >= 8364) {
				n = 128;
			}
			r += String.fromCharCode(n - 1);
		}
		window.location.href = r;
	});

	$link.mousedown(function() {
		window.location.href = $(this).attr("href");
	});

	// Let's go
	objectCount = $objects.length;
	labelMarginLeft = $label.css("margin-left");

	// Clicker handlers
	$clickerContainer.click(function() {
		$.fn.setMouseCursor();
	});

	$previous.click(function() {
		if (picIndex > 0) {
			$.fn.setPicIndex(--picIndex);
			dir = -1;
			$.fn.showPic();
			if ($.browser.msie) {
				window.location.hash = "#" + picIndex;
			}
		}
	});

	$next.click(function() {
		if (picIndex < (objectCount - 1)) {
			$.fn.setPicIndex(++picIndex);
			dir = 1;
			$.fn.showPic();
			if ($.browser.msie) {
				window.location.hash = "#" + picIndex;
			}
		}
	});

	$navigationArea.mouseenter(function() {
		$navigation.show(0);
	});

	$navigationArea.mouseleave(function(event) {
		$navigation.hide();
	});

	category = $(document).getUrlParam("category");
	if (category == null) {
		category = startcategory;
	}
	
	// Anchor
	if (window.location.hash != "") {
		picIndex = parseInt(window.location.hash.substr(1,
				window.location.hash.length - 1)) - 1;             
	}
	
	// initial calls
	$.fn.calculate();
	$.fn.setMouseCursor();	
    $.fn.setPicIndex(picIndex);
    $.fn.showPic();
    $navigation.show(0);
}).resize(function() {
	$.fn.calculate();
}).load(function() {
	//$loader.fadeOut("slow");
});