var idleInterval = undefined;
var eventHandler = [];

// JavaScript Document
function fitIntoMax(element, target) {    
    // FIX THIS!!!!
    if ($(element).length == 0 || $(target).length == 0)
        return 0;

    var targetWidth = $(target).width();
    var targetHeight = $(target).height();
    var elementWidth = $(element).css("max-width");
    var elementWidth = elementWidth.substring(0, elementWidth.indexOf("px"));
    var elementHeight = $(element).css("max-height");
    var elementHeight = elementHeight.substring(0, elementHeight.indexOf("px"));
    //$('#navBox').append('<div>targetWidth: ' + targetWidth + '<br />targetHeight: ' + targetHeight + '</div>');
    var heightRatio = elementHeight / targetHeight;
    var widthRatio = elementWidth / targetWidth;
    if (heightRatio > widthRatio) {
        var resizeFactor = targetHeight / elementHeight;
    }
    else {
        var resizeFactor = targetWidth / elementWidth;
    }
    $(element).css("width", elementWidth * resizeFactor);
    $(element).css("height", elementHeight * resizeFactor);
    //center
    var marginLeft = targetWidth / 2 - $(element).width() / 2;
    $(element).css("margin-left", marginLeft + 'px');
    var marginTop = targetHeight / 2 - $(element).height() / 2;
    $(element).css("margin-top", marginTop + 'px');
}

function imgfitInto(img, target) {
    var targetWidth = $(target).width();
    var targetHeight = $(target).height();
    var imgWidth = $(img).width();
    var imgHeight = $(img).height();
    var heightRatio = targetHeight / imgHeight;
    var widthRatio = targetWidth / imgWidth;

    if (heightRatio > widthRatio) {
        ratio = widthRatio;
    }
    else {
        ratio = heightRatio;
    }
    
    var marginLeft = (targetWidth - imgWidth * ratio) / (2 * ratio);
    var marginTop = (targetHeight - imgHeight * ratio) / (2 * ratio);

    if (marginTop < 1)
        marginTop = 0;
    if (marginLeft < 1)
        marginLeft = 0;
        
    $(img).transform({ origin: ['0px', '0px'], scale: ratio, translate: [marginLeft + 'px', marginTop + 'px']  });     
}

function resizeSubnav() {
    var topNavHeight = $("#topNav").height();
    var navBoxHeight = $("#navBox").height();
    $("#albumList").css("height", (navBoxHeight - topNavHeight - 20) + "px");
    $("#albumDetail").css("height", (navBoxHeight - topNavHeight - 20) + "px");
    $("#aboutSide").css("height", (navBoxHeight - topNavHeight - 20) + "px");
}

function bindScrollPane() {
    if ($("#albumList").length > 0) {
        $('#albumList').jScrollPane(
		{
		    verticalDragMinHeight: 50,
		    verticalDragMaxHeight: 50,
		    autoReinitialise: true
		});
    }
    if ($("#albumDetail").length > 0) {    
        var pane = $('#albumDetail').jScrollPane(
		{
		    verticalDragMinHeight: 50,
		    verticalDragMaxHeight: 50,
		    autoReinitialise: true
		});
        //scroll to top
		api = pane.data('jsp');
		api.scrollToY(0);
    }
}

function navigationSuccess(result) {    
    
    if (result.contentBoxUpdate != undefined)
        $("#contentBox").html(result.contentBoxUpdate);
    if (result.menuUpdate != undefined)
        $("#navBox").html(result.menuUpdate);
    if (result.subMenuUpdate != undefined)
        $("#albumDetailInnerBox").html(result.subMenuUpdate);

    if (result.historyUrl != undefined)
        setHistory(result.historyUrl);

    bindScrollPane();
    resizeSubnav();
}

var prevContentClass;

function toggleSideMenu() {
    var navBox = $("#navBox");
    
    var imgUpdate = setInterval(function () {
        if ($("#logoAlbumStart").length > 0) {
            fitIntoMax("#logoAlbumStart", "#innerBox");
        }
        else if ($("#logoAbout").length > 0) {
            fitIntoMax("#logoAbout", "#innerBox");
        }
    }, 20);
   
    if (navBox.hasClass("expanded")) {
        // Close the SideMenu
        $("#albumImg").css("display", "none");

        navBox.switchClass("expanded", "collapsed", 500, function () {
            //clearInterval(imgUpdate);
            $("#innerCollapsedNavBox").fadeIn(400);
            imgfitInto("#albumImg", "#innerContent");
            $("#albumImg").fadeIn(400);
            clearInterval(imgUpdate);
        });

        prevContentClass = $("#content").attr("class");        
                
        if ($("#content").hasClass("about"))
            setClass("content", "about borderBox");
        else if ($("#content").hasClass("borderBox"))
            setClass("content", "presentationNoLeft borderBox");
        else
            setClass("content", "presentationNoLeft");

        $("#logoPanel").css("display", "block");

        $("#tipPanel").css("display", "table");

        var t = setTimeout(function () {
            $("#tipPanel").fadeOut(400);
            clearTimeout(t);
        }, 3000);  
    }

    if (navBox.hasClass("collapsed") || navBox.hasClass("closed")) {
        $("#albumImg").css("display", "none");
        $("#innerExpandedNavBox").css("display", "none");
        // Open the SideMenu
        if (navBox.hasClass("collapsed")) {
            navBox.switchClass("collapsed", "expanded", 500, function () {
                $("#innerExpandedNavBox").fadeIn(400);
                imgfitInto("#albumImg", "#innerContent");
                $("#albumImg").fadeIn(400);
                clearInterval(imgUpdate)
                resizeSubnav();
                bindScrollPane();                           
            });
        }
        if (navBox.hasClass("closed")) {
            navBox.switchClass("closed", "expanded", 500, function () {
                $("#innerExpandedNavBox").css("display", "none");
                $("#innerExpandedNavBox").fadeIn(400);
                clearInterval(imgUpdate)
            });            
        }

        if (prevContentClass != undefined && prevContentClass != "")
            setClass("content", prevContentClass);
        else
            setClass("content", "standardNoLeft borderBox");

        prevContentClass = undefined;

        $("#logoPanel").css("display", "none");
        $("#tipPanel").css("display", "none");
    }
}

function setClass(objectName, newClass) {
    var object = $("#" + objectName)
    
    object.removeClass();
    object.addClass(newClass);  
}

function getUrlFromParameter(url, name) {
    name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regexS = "[\\?&]" + name + "=([^&#]*)";
    var regex = new RegExp(regexS);
    var results = regex.exec(url);
    if (results == null)
        return "";
    else
        return results[1];
}

function removeParameterFromUrl(url, name) {
    var parameter = getUrlFromParameter(url, name);

    if (parameter != "") {
        url = url.replace("&" + name + "=" + parameter, "");
    }

    return url;
}

function addParameterToUrl(toggleLink, url, parameterName) {  
    var parameterValue = getUrlFromParameter(url, parameterName);

    if (parameterValue != "") {
        var toggleLink = $(toggleLink).attr("href");

        var hasParameter = getUrlFromParameter(toggleLink, parameterName);

        if (hasParameter == "")
            toggleLink += "&" + parameterName + "=" + parameterValue;
        else
            toggleLink = toggleLink.replace("&" + parameterName + "=" + hasParameter, "&" + parameterName + "=" + parameterValue);

        $("#lnkToggleSideMenu").attr("href", toggleLink);
    }
}

function selectAlbum(albumID, selectedAssetID) {   
    var thumbArray = $("[id*='album_']").each(function (index, element) {
        if ($(element).hasClass("selected"))
            $(element).removeClass("selected");
    });

    $("#album_" + albumID).addClass("selected");

    $("#lnkToggleSideMenu").attr("href", removeParameterFromUrl($("#lnkToggleSideMenu").attr("href"), "selectedSubMenu"));
    $("#lnkToggleSideMenu").attr("href", $("#lnkToggleSideMenu").attr("href") + "&selectedSubMenu=_AlbumDetail");
}

function selectVideo(albumID, selectedAssetID) {
    /*var thumbArray = $("[id*='album_']").each(function (index, element) {
        if ($(element).hasClass("selected"))
            $(element).removeClass("selected");
    });

    $("#album_" + albumID).addClass("selected");*/

    $("#lnkToggleSideMenu").attr("href", removeParameterFromUrl($("#lnkToggleSideMenu").attr("href"), "selectedSubMenu"));
    $("#lnkToggleSideMenu").attr("href", $("#lnkToggleSideMenu").attr("href") + "&selectedSubMenu=_AssetDetail");
}

function moveAlbumList(result) {
    addParameterToUrl("#lnkToggleSideMenu", this.url, "albumID");
    addParameterToUrl("#lnkToggleSideMenu", this.url, "assetID");

    // $("#albumContainer").webkitTransition(250);
    $("#albumContainer").animate({ translateX: '-290px' });
    
    navigationSuccess(result);
}

(function ($) {
    var cache = [];
    // Arguments are image paths relative to the current page.
    $.preLoadImages = function () {
        var args_len = arguments.length;
        for (var i = args_len; i--; ) {
            var cacheImage = document.createElement('img');
            cacheImage.src = arguments[i];
            cache.push(cacheImage);
        }
    }
})(jQuery)

function previousImage() {        
    if (currentArrayID > 0)
    {             
        currentArrayID = +currentArrayID - 1;
        loadNewImage(imageListAssociation[currentArrayID]);                                
    }
    else
    {
        currentArrayID = imageListAssociation.length - 1;
        loadNewImage(imageListAssociation[currentArrayID]);
    }  

    $("#photoNumber").html(+currentArrayID + 1);        
}

function nextImage() {        
    if (currentArrayID < imageListAssociation.length - 1)
    {                
        currentArrayID = +currentArrayID + 1;
        loadNewImage(imageListAssociation[currentArrayID]);                            
    }     
    else
    {
        currentArrayID = 0;
        loadNewImage(imageListAssociation[currentArrayID]);
    }       
    $("#photoNumber").html(+currentArrayID + 1);
}

function checkKeyboard(e)
{
    if (e.keyCode == 37) //left        
        previousImage();
    if (e.keyCode == 39) //right
        nextImage();
    
    if (e.keyCode == 38) { //up
    }
    
    if (e.keyCode == 40) { //down 
    }
}

// CUSTOM BIND

function customBind(obj, event, pageName, func) {
    if (func === undefined)
        customBindOverload(obj, event, "generic", pageName);    //pageName is actually the func
    else
        customBindOverload(obj, event, pageName, func);

}

function customBindOverload(obj, event, pageName, func) {    
    eventHandler[eventHandler.length] = { Object: obj, Event: event, Function: func, PageName: pageName };

    $(obj).bind(event, func);    
}

function customUnbindAll() {
    for (var i = eventHandler.length - 1; i >= 0; i--) {
        //eventHandler[i]
        var obj = eventHandler[i].Object;
        var event = eventHandler[i].Event;
        var func = eventHandler[i].Function;

        $(obj).unbind(event, func);
        eventHandler.splice(i, 1);
    }
}

/* Every eventHandler that is registered to another page is removed */
function customUnbindPage(currentPageName) {
    for (var i = eventHandler.length - 1; i >= 0; i--) {
        //eventHandler[i]
        var obj = eventHandler[i].Object;
        var event = eventHandler[i].Event;
        var func = eventHandler[i].Function;
        var eventPageName = eventHandler[i].PageName;

        if (eventPageName != currentPageName) {
            $(obj).unbind(event, func);
            eventHandler.splice(i, 1);
        }
    }
}

function customUnbindEvent(eventName) {
    for (var i = eventHandler.length - 1; i >= 0; i--) {
        var event = eventHandler[i].Event;

        if (event == eventName) {
            var obj = eventHandler[i].Object;
            var func = eventHandler[i].Function;

            $(obj).unbind(event, func);
            eventHandler.splice(i, 1);
        }
    }
}

function customRebindPage(currentPageName) {
    for (var i = eventHandler.length - 1; i >= 0; i--) {
        var pageName = eventHandler[i].PageName;

        if (pageName == currentPageName) {
            var obj = eventHandler[i].Object;
            var event = eventHandler[i].Event;
            var func = eventHandler[i].Function;
            
            $(obj).unbind(event, func);
            $(obj).bind(event, func);
        }
    }
}

function selectImage(imageID) {
    var thumbArray = $("[id*='thumb_']").each(function(index, element){
        if ($(element).hasClass("selected"))
            $(element).removeClass("selected");     
    });

    $("#thumb_" + imageID).addClass("selected");

    $("#lnkToggleSideMenu").attr("href", removeParameterFromUrl($("#lnkToggleSideMenu").attr("href"), "assetID"));
    $("#lnkToggleSideMenu").attr("href", $("#lnkToggleSideMenu").attr("href") + "&assetID=" + imageID);
}

var currentHash = window.location.hash;

function setHistory(url) {    
    window.location.hash = url;
    currentHash = window.location.hash;
}

function initHistory() {

    if (currentHash != "") {
        params = currentHash.replace("#/photography", "");
        reloadContent(params);
    }

    setInterval(function () {
        if (window.location.hash != currentHash) {
            currentHash = window.location.hash;

            if (currentHash != "") {
                reloadContent(currentHash);
            }
        }
    }, 500);
}

function reloadContent(currentHash) {
    params = currentHash.replace("#/photography", "");

    $.ajax({
        type: "POST",
        url: '/sideMenuHistory' + params,
        success: function (result) {
            $("#navBox").html(result);
        }
    });

    $.ajax({
        type: "POST",
        url: '/homeHistory' + params,
        success: function (result) {
            $("#contentBox").html(result);
        }
    });
}