/**
 *	Script to preload thumbnail and picture locations
 */
var clickObject = new Array();
var popupObject = new Array();
var pictureSettings = new Array();
var imageSet = false;
var currentThumbList = "";
var currentGalleryWidth = 0;
var standardThumbWidth = 112;
var standardThumbPadding = 4;
var standardThumbListBuffer = 24;
var currentScrollEnd = 0;
var currentScrollBeginning = 0;
var currentScrollPosition = 0;
var windowWidth = 0;
var windowHeight = 0;
var viewMode = "";
var viewModeSmall = "small";
var viewModeNormal = "normal";
var viewModeWidescreen = "widescreen";
var viewModeFormer = "";
var upperBorder = 1.8;
var lowerBorder = 1.54;
var bigScreen = false;
var scrollTime = 0;
var maxScroll = 0;
var popupShowSpeed = 600;
var popupHideSpeed = 100;
var popupShowPosition = "0px";

/**
 *  Loads the list of thumbnail pictures for a given set
 *  @param list Specifies the list to be loaded within "images/gallery/" folder
 **/
function loadThumbList(list){
    $.ajax({
	url: "script/pictures.php",
	type: "POST",
	dataType: "json",
	data:{
	    type:"thumbs/",
	    dir:list
	},
	success: function(data){
	    //if it's not the same list being loaded, do stuff
	    if(currentThumbList!=list){
		if(data!=null){
		    //reset the slide css settings
		    $("#slide li img").expire("click");
		    $("#slide").contents().remove();
		    $("#slide").css({
			"left":"0px",
			"position":"absolute"
		    });
		    //reset clickObject
		    clickObject = new Array();
		    currentThumbList=list;
		    //process to build list with images
		    for(i=0; i<data.length; i++){
			var picNameLength = data[i].length;
			var picName = data[i].substring(0, picNameLength-4);
			$(".photoslide ul").append("<li><img src='images/gallery/"+list+"thumbs/"+data[i]+"' alt='' id='"+picName+"'/></li>");
			//add click event to real image
			addBgClick(data[i], picName, list);
		    }
		    //check if the thumblist has to be scrollable or not
		    calculateScrollable();
		    //open the first picture from the list TODO: check if there is a problem with this ("selector required")
		    $("#slide li:first img").click();
		}
	    }
	}
    });
}
/**
 *  Adds a click handler to each thumbnail, to be able to switch the pictures
 *  @param picture The picture to be set
 *  @param picName The name of the picture to be set, without file declaration (equals name of the id to be set)
 *  @param list The list to which this picture belongs (necessary for setting the right path to the picture)
 **/
function addBgClick(picture, picName, list){
    var imgRoot = "images/gallery/";
    clickObject[picName] = imgRoot+list+picture;
    popupObject[picName] = imgRoot+list+picture;
    //generic click function for a picture in the image gallery list
    $("#"+picName).livequery("click",function(){
	closePopup(0);
	var pic = $(this).attr("id");
	//get the picture that should be loaded
	var newPicture = clickObject[pic];
	//get the current picture
	var pictureBackground = $(".picture img").attr("src");
	//if it's a new picture being clicked on, load it
	if(pictureBackground.search(newPicture)==(-1)){
	    //set the picture
	    setPicture(clickObject[pic]);
	    //load the popup belonging to the picture, if there is text available
	    loadPopup(popupText[language[languageSet]+popupObject[pic]]);
	}else{
	    //if the viewMode has changed (due to resizing the window)
	    if(formerViewMode!=viewMode){
		setPicture(clickObject[pic]);
	    }
	    //only load the popup belonging to the picture, if there is text available
	    loadPopup(popupText[language[languageSet]+popupObject[pic]]);
	}
	var formerViewMode = viewMode;
    });    
}
/**
 *  Reload the popup (if the language has changed)
 **/
function reloadPopup(){
    closePopup(0);
    var pictureBackground = $(".picture img").attr("src");
    var occurance = pictureBackground.search("41M_");
    var id = pictureBackground.slice(occurance, pictureBackground.length-4);
    $("#"+id).click();
}
/**
 *  Loads the popup belonging to a specified picture if there is any text for it
 *  @param picture The picture to which the popup belongs
 **/
function loadPopup(picture){
    //if there is text available replace the text of the popup and show it
    if(picture!=null){
	$("#popup_text").text(picture);
	$("#popup_close").text(popupText[language[languageSet]+"popup_close"]);
	//if the header is popped out or in, behave accordingly
	if(headerStatus){
	    slidePopup(1);
	}else{
	    slidePopup(2);
	}
	$("#picture_popup").animate({
	    left: popupShowPosition
	}, popupShowSpeed);
    }else{
	closePopup(0);
    }
}
/**
 *  Determines if the list should be scrollable via the hidden hover divs.
 *  Will set or unset the hover function of the hidden divs for scrolling the lists.
 **/
function calculateScrollable(){
    //expire former event handlers
    $("#gallery_backward").expire("mouseover");
    $("#gallery_forward").expire("mouseover");
    $("#gallery_backward").expire("mouseout");
    $("#gallery_forward").expire("mouseout");
    currentScrollPosition=0;
    //get window width
    windowWidth = $(window).width();
    //get gallery width
    currentGalleryWidth = $("#slide").innerWidth();
    //if picture list is wider than screen, make scrollable
    if(currentGalleryWidth>windowWidth){
	//set backward hover
	$("#gallery_backward").livequery("mouseover", function(event){
	    slideGalleryRight();
	});
	$("#gallery_backward").livequery("mouseout", function(event){
	    $("#slide").clearQueue();
	    $("#slide").stop();
	});
	//set forward hover
	$("#gallery_forward").livequery("mouseover", function(event){
	    slideGalleryLeft();
	});
	$("#gallery_forward").livequery("mouseout", function(event){
	    $("#slide").clearQueue();
	    $("#slide").stop();
	});
    }else{
	//position picture list centered
	$("#slide").css({
	    "position": "relative"
	});
    }
}
/**
 *  Slides the gallery to the left side if applicable
 **/
function slideGalleryLeft(){
    //get current scroll position of the picture list
    var buffer = $("#slide").css("left");
    buffer.substring(0, buffer.length-3);
    currentScrollPosition = parseInt(buffer);
    if(currentScrollPosition>=windowWidth-currentGalleryWidth){
	//get the rest of the distance to scroll
	maxScroll = windowWidth-currentGalleryWidth;
	//calculate the scroll time for it
	scrollTime = maxScroll*(-2);
	//if scrolling is not going back to zero and scroll time is above 0
	if(maxScroll!=0 || scrollTime!=0){
	    $("#slide").animate({
		left:maxScroll+"px"
		}, scrollTime);
	}
    }
}
/**
 *  Slides the gallery to the right side if applicable
 **/
function slideGalleryRight(){
    //get current position of the picture list
    var buffer = $("#slide").css("left");
    buffer.substr(0, buffer.length-3);
    currentScrollPosition = parseInt(buffer);
    if(currentScrollPosition<0){
	maxScroll = windowWidth-currentGalleryWidth;
	maxScroll -=currentScrollPosition;
	scrollTime = currentScrollPosition*(-2);
	maxScroll*=(-1);
	$("#slide").animate({
	    left:"0px"
	}, scrollTime);//, "swing", slideGalleryRight())
    }
}
/**
 *  Sets the startup picture for the website from a random selection in images/startup/
 **/
function loadStartupPicture(){
    if(!imageSet){
	$(".picture").append("<img src='' alt='' />");
	imageSet = true;
    }
    $.ajax({
	url: "script/pictures.php",
	type: "POST",
	dataType: "json",
	data:{
	    type:"../images/startup/",
	    dir:"none"
	},
	success: function(data){
	    setContentPosition(contentFirstMenu, false);
	    showContent("picture");
	    //get random picture from array and display it!
	    if(data!=null){
		var randomPicture = Math.floor(Math.random()*data.length);
		setPicture("images/startup/"+data[randomPicture]);
	    }
	}
    });
}
/**
 *  Sets the picture. Used in startup picture and gallery mode. Will
 *  automatically check if the picture to be shown has to be moved up or down.
 *  top: 0% is default.
 *  @param picturePath The path of the picture to be loaded
 **/
function setPicture(picturePath){
    //sets the picture
    $(".picture img").attr({
	src:picturePath
    });
    //if there is a setting for a picture, use it, otherwise use the default
    if(pictureSettings[picturePath]!=null){
	if(viewMode == viewModeWidescreen){
	    //if the picture setting is set to default, use the default, otherwise use the set value
	    if(pictureSettings[picturePath]==""){
		setPictureDefault();
	    }else{
		$(".picture img").css({
		    top:pictureSettings[picturePath],
		    left:"0px"
		});
	    }
	}
	if(viewMode == viewModeNormal){
	    if(pictureSettings[picturePath]==""){
		setPictureDefault();
	    }else{
		//set the picture with top offset
		$(".picture img").css({
		    top:pictureSettings[picturePath],
		    left: "0px"
		});
		//get the offset of the picture to its parent
		var offset = $(".picture img").offset();
		var position = $(".picture img").position();
		//fix the top property to display the picture to the bottom boundary
		$(".picture img").css({
		    top:position.top-offset.top+"px",
		    left:"0px"
		})
	    }
	}
	if(viewMode == viewModeSmall){
	    setPictureDefault();
	    $(".picture img").css({
	       width: windowHeight*1.6+12+"px"
	    });
	}
    }else{
	setPictureDefault();
    }
}
/**
 *  Set the size of the picture in the gallery and picture mode according to the window size
 **/
function setPictureSize(){
    windowWidth = $(window).width();
    windowHeight = $(window).height();
//    alert("window aspect ratio: "+windowWidth/windowHeight+"\n width: "+windowWidth+"\n height: "+windowHeight);
    var aspect_ratio = windowWidth/windowHeight;
    if(aspect_ratio<upperBorder){
	viewModeFormer = viewMode;
	viewMode = viewModeNormal;
	//change the settings immediately for the current picture
	setPicture($(".picture img").attr("src"));
	$(".picture").css({
	    width:windowWidth+12+"px",
	    left:"0px"
	});
	//set picture width
	$(".picture img").css({
	    width:windowWidth+12+"px"
	});
	popupShowPosition = "0px";
    }
    if(aspect_ratio<lowerBorder){
	viewModeFormer = viewMode;
	viewMode = viewModeSmall;
	setPicture($(".picture img").attr("src"));
	$(".picture").css({
	   width: windowHeight*1.6+12+"px",
	   left: (-1)*(((windowHeight*1.6+12)-windowWidth)/2)+"px"
	});
	popupShowPosition = (((windowHeight*1.6+12)-windowWidth)/2)+"px";
    }
    if(aspect_ratio>upperBorder){
	viewModeFormer = viewMode;
	viewMode = viewModeWidescreen;
	//change the settings immediately for the current picture
	setPicture($(".picture img").attr("src"));
	$(".picture").css({
	    width:windowWidth+12+"px",
	    left:"0px"
	});
	//set picture width
	$(".picture img").css({
	    width:windowWidth+12+"px",
	    left:"0px"
	});
	popupShowPosition = "0px";
    }
    //set the menu item padding according to window width
    if(windowWidth<850){
	$(".menu ul li").css({
	    "padding-left":"8px"
	});
    }
    if(windowWidth>850){
	$(".menu ul li").css({
	    "padding-left":"20px"
	});
    }
    //adjust the gallery scrolling according to window width on resize
    if(photoMode){
	calculateScrollable();
    }
    //if in photo mode and view mode has changed, reload popup to show it correctly
    if(photoMode && viewMode!=viewModeFormer){
	reloadPopup();
    }
}
/**
 *  Shows the size of the window (currently not needed or used, for debugging only)
 **/
function showWindowSize(){
    windowWidth = $(window).width();
    //set picture container width
    windowHeight = $(window).height();
    alert("windowWidth: "+windowWidth+"\n windowHeight: "+windowHeight);
}
/**
 *  Sets the default top property value for the image in gallery mode
 **/
function setPictureDefault(){
    $(".picture img").css({
	top: "0%",
	left:"0px"
    });
}