var scrolling = false;
var direction = "forward";
var showP = null;
var galInitialized = false;

var global_appserver = document.location.protocol + '//' + document.location.host;

fullpath = document.location.pathname;
directories = fullpath.split("/");
language = directories[1];

function scrollRight(){
	maxOffset = parseInt($("#dragContain").width()) - parseInt($("#draggable").width());
	offset = parseInt($("#draggable").css("left"));
	if (offset < maxOffset) {
		$("#draggable").css("left", Math.min((offset + 10), maxOffset) + 'px');
		$.move("#draggable", "#dragContain", "#scrollerContent", parseInt($("#draggable").css("left")), "#scroller");
	}
}
function scrollToLeft(){
	offset = parseInt($("#draggable").css("left"));
	if (offset > 0) {
		$("#draggable").css("left", Math.max((offset - 10), 0) + 'px');
		$.move("#draggable", "#dragContain", "#scrollerContent", parseInt($("#draggable").css("left")), "#scroller");
	}
}

$(document).ready(
function(){
	$("#scrollerContent").data("page","1");
	
	// if safari || chrome, delay script execution till everything, including css, fully loaded
	// otherwise safari/chrome thinks #scrollerContent.width() == 350
	if (jQuery.browser.safari && document.readyState != "complete"){
		    setTimeout( arguments.callee, 200 );
		    return;
		  }
	// show scroller, if needed

	if (parseInt($("#scroller").width()) < parseInt($("#scrollerContent").width())) {
		dragLength = Math.round(640 / $("#scrollerContent a img").length * 5);
		$("div#scrollBar div#draggable").css('width', dragLength + 'px')
		$("div#scrollBar").css("display", "block");
	}

	// Attach scrolling to the buttons
	$("#rightArr").mousehold(function(){ scrollRight();}).mouseup(function(){
		var container = parseInt($("#dragContain").width());
		drag = parseInt($("#draggable").width());
		trueX = container - drag;
		if (parseInt($("#scrollerContent").data("pages")) != parseInt($("#scrollerContent").data("page"))) {
			if ($("#draggable").position().left == trueX) {
				getpage = parseInt($("#scrollerContent").data("page")) + 1;
				direction = "forward";
				showP = null;
				if (galInitialized == true) {
					$(document).jGallery({
						"page": getpage,
						"gallery_id": gallery.id
					});
				}
			}
		}
	});
	$("#leftArr").mousehold(function(){ scrollToLeft();}).mouseup(function(){
		var container = parseInt($("#dragContain").width());
		drag = parseInt($("#draggable").width());
		trueX = container - drag;
		if (parseInt($("#scrollerContent").data("page")) != "1") {
			if (parseInt($("#draggable").position().left) == 0) {
				getpage = parseInt($("#scrollerContent").data("page")) - 1;
				direction = "backward";
				showP = null;
				if (galInitialized == true) {
					$(document).jGallery({
						"page": getpage,
						"gallery_id": gallery.id
					});
				}
			}
		}
	});

	// Image display function

	$("#scrollerContent a").live("click",
		function(e){
			showPic(this);
			return false;
		});

	//add navigation
	$("#picContainerPositioner td").append('<span id="prevPic"></span><span id="nextPic"></span>');

});

function showPic(elem){

	var prevImg = $(elem).parent('td').prev('td').find('a');
	var nextImg = $(elem).parent('td').next('td').find('a');

	$("#scrollerContent a img").css('border', '4px solid #fff').removeClass("active-image");
	$(elem).find('img').css('border', '4px solid #fdb501').addClass("active-image");
	$("#galleryPic").show("slow")
	var img = $(elem).attr('href');
	var title = $(elem).attr('title');
	$("#galleryTop").text(title);
	if ($("#picContainer img").length > 0 ){
		$("#picContainer img").fadeOut("slow", function (){
			$("#picContainer img").remove();
			$("#picContainer td").image(img, function(){
				$(this).fadeIn("slow", function () {
					preparePrev(prevImg);
					prepareNext(nextImg);
				});
			});
		});
	} else {
		$("#picContainer td").image(img, function(){
			$(this).fadeIn("slow", function () {
				prepareNext(nextImg);
			});
		});
	}
}

function preparePrev(prevImg) {
	$("#prevPic").css('cursor', 'default').unbind();
	if (prevImg.length > 0) {
		$("#prevPic").css('cursor', 'pointer').bind("click",
		function(e){
			$(prevImg).click();
			return false;
		});
	} else if (parseInt($("#scrollerContent").data("page")) != "1") {
		$("#prevPic").css('cursor', 'pointer').bind("click",
		function(e){
			getpage = parseInt($("#scrollerContent").data("page")) - 1;
			direction = "backward";
			showP = null;
			if (galInitialized == true) {
				$(document).jGallery({
					"page": getpage,
					"gallery_id": gallery.id
				});
			}
			return false;
		});
	}
}

function prepareNext(nextImg) {
	$("#nextPic").css('cursor', 'default').unbind();
	if (nextImg.length > 0) {
		$("#nextPic").css('cursor', 'pointer').bind("click",
		function(e){
			$(nextImg).click();
			return false;
		});
	} else if (parseInt($("#scrollerContent").data("pages")) != parseInt($("#scrollerContent").data("page"))) {
		$("#nextPic").css('cursor', 'pointer').bind("click",
		function(e){
			getpage = parseInt($("#scrollerContent").data("page")) + 1;
			direction = "forward";
			showP = null;
			if (galInitialized == true) {
				$(document).jGallery({
					"page": getpage,
					"gallery_id": gallery.id
				});
			}
			return false;
		});
	}
}
// extend jQuery to add our mover plugin
$.move = function(moverSelector, moverContainerSelector, targetSelector, offset, targetContainerSelector) {
	//get targets
	target = $(targetSelector);
	targetContainer = $(targetContainerSelector);
	mover = $(moverSelector);
	moverContainer = $(moverContainerSelector);

	//get all widths
	tw = target.width();
	tcw = targetContainer.width();
	mcw = moverContainer.width();
	mw = mover.width();

	//Determine maximum possible offset for the scroller
	maxOffset = mcw - mw;

	//calculate the difference ratio between containers
	// (tw - tcw) because we don't want to be able to scroll
	// target out of the view
	q = (tw - tcw) / maxOffset;


	targetOffset = Math.round(offset * q);
	//move
	target.css('left', -targetOffset + 'px');
}

$.fn.image = function(src, f){
	return this.each(function(){
	var i = new Image();
	i.src = src + '?' + Math.random(0, 999999);
	i.style.display = 'none';
	this.appendChild(i);
	i.onload = f;
	});
}

function reapply() {
	$('#draggable').DraggableDestroy();
	$('#draggable').height(17).Draggable(
		{
			zIndex: 	99,
			ghosting:	false,
			containment : 'parent',
			axis: 'horizontally',
			onStop: function() {
				var container = parseInt($("#dragContain").width());
				drag = parseInt($("#draggable").width());
				trueX = container - drag;
				if (galInitialized == true) {
					if (parseInt($("#scrollerContent").data("pages")) != parseInt($("#scrollerContent").data("page"))) {
						if ($("#draggable").position().left == trueX) {
							getpage = parseInt($("#scrollerContent").data("page")) + 1;
							direction = "forward";
							showP = null;
							$(document).jGallery({
								"page": getpage,
								"gallery_id": gallery.id
							});
						}
					}
					if (parseInt($("#scrollerContent").data("page")) != "1") {
						if ($("#draggable").position().left == 0) {
							getpage = parseInt($("#scrollerContent").data("page")) - 1;
							direction = "backward";
							showP = null;
							$(document).jGallery({
								"page": getpage,
								"gallery_id": gallery.id
							});
						}
					}
				}
			}
		}
	);
}

/*
 * JSON data request
 */

(function($)
{
    $.fn.jGallery = function(settings)
    {
        var config =
        {
            'server':		global_appserver,
            'page':			'1',
            'gallery_id': 	'0',
			'language': 	language
        };
        var request =
        {
            'page':			'?page=',
            'gallery_id':	'&gallery_id=',
			'language':		'&language='
        };
        var settings = $.extend({}, config, settings);
        var request = $.extend({}, request, request);
		
        $.getJSON(settings.server + "/lv/gallery/scroll" + request.page + settings.page + request.gallery_id + settings.gallery_id + request.language + settings.language + "&jsonpcallback=?", function (){});
        return false;
    };
}
)(jQuery);


/*
 * JSON data handling
 */

function jsonp_callback(data)
{
	$("#scrollerContent tr").empty();
	$("#scrollerContent").data("page", data.page);
	$("#scrollerContent").data("pages", data.pages);
	for (i = 0; i < data.media.length; i++)
	{
		if (data.media[i].title != null) {
			title = data.media[i].title;
		} else {
			title = "";
		}
		$("#scrollerContent tr").append('<td><a href="'+global_appserver+data.media[i].basic+'" title="'+title+'"><img src="'+global_appserver+data.media[i].thumbnail+'" alt="'+title+'" border="0" /></a></td>');
	}

	if ( $("#scroller").width() < $("#scrollerContent").width()) {
		dragLength = Math.round(640 / $("#scrollerContent a img").length * 5);
		$("div#scrollBar div#draggable").css('width', dragLength + 'px')
		$("div#scrollBar").css("display", "block");
	}
	if (direction == "forward") {
		$("#scrollerContent").animate({left: "0"}, 100, function(){
			$("#draggable").animate({left: "5px"}, 200, function(){
				if (showP == null) {
					if($("#scrollerContent").data("page") == "1") {
						$("#galleryThumbnails a:first").click(); // load first image
					} else {
						$("#galleryThumbnails a:eq(1)").click(); // load next image
					}					
				} else {
					$("#galleryThumbnails a[title="+showP+"]").click();
				}
			});
		});	
	} else if (direction == "backward") {
		st = $("#scrollerContent").width() - 647;
		$("#scrollerContent").animate({left: "-" + st}, 100, function(){
			$("#draggable").animate({left: "503px"}, 200, function(){
				if (showP == null) {
						$("#galleryThumbnails a:eq(24)").click(); // load 25th image
				} else {
					$("#galleryThumbnails a[title="+showP+"]").click();
				}
			});
		});	
	}
}
$(document).ready(function(){
	reapply();
	$(document).jGallery({"gallery_id": gallery.id});
	galInitialized = true;
});