/// <reference path="/js/jquery-1.3.2-vsdoc.js" />

//var recentHash = "";
//var customOverlay;

function getTopBasedOnViewport(_windowHeight, _originalTop) {
    var intWindowTop;

    var intDefaultTop = _originalTop;
    var intWindowHeight = _windowHeight;
    var intViewportHeight = $(window).height();

    if (intDefaultTop + intWindowHeight > intViewportHeight)
        intWindowTop = (intViewportHeight - intWindowHeight) / 2;
    else
        intWindowTop = intDefaultTop;

    if (intWindowTop < 0)
        intWindowTop = 0;

    return intWindowTop;
}

function getFixedBasedOnViewport(_windowHeight) {
    var intViewportHeight = $(window).height();
    return intViewportHeight > _windowHeight;
}

$(document).ready(function () {
    //    setInterval(pollHash, 200);

    //    var ajaxUrl;
    //    var currentHash = window.location.hash.replace("#", "");

    //    if (currentHash.length > 0) {
    //        if (currentHash.indexOf("/katter/") >= 0) {
    //            ajaxUrl = currentHash.replace("/katter/", "/katter-ajax/");
    //            openProductModal(ajaxUrl, 247);
    //        }
    //    }

    var intTopPosition;

    if ($(".ourcats").length > 0)
        intTopPosition = $(".ourcats").offset().top - 10;
    else
        intTopPosition = 133;

    $(".catarchive .cat[rel]").each(function () {
        setProductModal($(this), getTopBasedOnViewport(555, intTopPosition), $(this).parent().children().length > 1, getFixedBasedOnViewport(555));
    });

    $(".ourcats .cat[rel]").each(function () {
        setProductModal($(this), getTopBasedOnViewport(555, intTopPosition), $(this).parent().children().length > 1, getFixedBasedOnViewport(555));
    });

    $(".popupcatpagination a.prev").live("click", function (e) {
        if (e.button == 0) {
            e.preventDefault();
            productScroll($(this));
        }
    });

    $(".popupcatpagination a.next").live("click", function (e) {
        if (e.button == 0) {
            e.preventDefault();
            productScroll($(this));
        }
    });

    $(".overlay .panes .pane .popupcattext .popupcattextscroll a").live("click", function (e) {
        if (e.button == 0 && $(this).attr("href").indexOf("/katter/") >= 0) {
            e.preventDefault();

            var ajaxUrl = $(this).attr("href");
            var $overlay = $(this).parents(".overlay");
            var $thumbnail = $(".cat .catlink[href=" + $(this).attr("href") + "]").parent().parent();

            //    setLocationHash(ajaxUrl);
            ajaxUrl = ajaxUrl.replace("/katter/", "/katter-ajax/");

            $overlay.children("div").hide();
            showLoader($overlay);

            $.ajax({
                type: "GET",
                url: ajaxUrl,
                cache: true,
                success: function (msg) {
                    $overlay.children("div").fadeIn("fast");
                    bindOverlay($overlay, msg, $thumbnail);
                    hideLoader($overlay);
                },
                error: function (msg) {
                    $overlay.children("div").fadeIn("fast");
                    $overlay.find(".panes").html("<h2>Ett fel intr&auml;ffade vid h&auml;mtning.</h2>");
                    Cufon.refresh();
                    hideLoader($overlay);
                }
            });
        }
    });

    //    function pollHash() {
    //        if (window.location.hash == recentHash || (window.location.hash == "" && (recentHash == "#" || recentHash == "#none")))
    //            return;

    //        recentHash = window.location.hash;

    //        var ajaxUrl = recentHash.replace("#", "").replace("/katter/", "/katter-ajax/");

    //        closeAllModals();
    //        openProductModal(ajaxUrl, getTopBasedOnViewport(555, intTopPosition), getFixedBasedOnViewport(555));
    //    }
});

function closeAllModals() {
    $(".cat[rel]").each(function () {
        $(this).overlay().close();
    });

//    if ($(".customoverlay").length > 0)
//        customOverlay.close();
}

//function openProductModal(_url, _top, _fixed) {
//    $("<div class='popupcat overlay customoverlay' style='display:none;'><div class='popupcatpagination'></div><div class='panes'></div></div>").appendTo("body").overlay({
//        oneInstance: false,
//        closeOnClick: false,
//        top: _top,
//        effect: "apple",
//        fixed: _fixed,
//        onBeforeLoad: function () { customOverlay = this.getOverlay(); },
//        onClose: function () { clearModal(this); },
//        onLoad: function () {

//            var $overlay = this.getOverlay();

//            showLoader($overlay);

//            $.ajax({
//                type: "GET",
//                url: _url,
//                cache: false,
//                success: function (msg) {
//                    bindOverlay($overlay, msg, null)
//                    hideLoader($overlay);
//                },
//                error: function (msg) {
//                    $overlay.find(".panes").html("<h2>Ett fel intr&auml;ffade vid h&auml;mtning.</h2>");
//                    Cufon.refresh();
//                    hideLoader($overlay);
//                }
//            });

//        },
//        load: true
//    });
//}

function setProductModal($thumbnail, _top, _pagination, _fixed) {
    var url = $thumbnail.find("a.catlink").attr("href");
    
    var $nav = $("<ul><li><a href='#' class='prev backward'>Föregående</a></li><li><a href='#' class='next forward'>Nästa katt</a></li></ul>");
    var $pagination = $("<div class='popupcatpagination'></div>");
    var $panescontainer = $("<div class='panes'></div>");
    var $overlay = $("<div class='popupcat overlay' style='display:none;'></div>");

    if ($(".overlay").length < 1) 
    {
        if (_pagination == true)
            $nav.appendTo($pagination);

        $pagination.appendTo($overlay);
        $panescontainer.appendTo($overlay);
        $overlay.appendTo("body");
    }
    else if ($(".overlay .popupcatpagination").length < 1)
    {
        if (_pagination == true)
            $nav.appendTo($pagination);

        $pagination.appendTo($(".overlay"));
    }

    var overlay = $thumbnail.overlay({
        oneInstance: false,
        closeOnClick: false,
        top: _top,
        effect: "apple",
        fixed: _fixed,
        onClose: function () { clearModal(this); },
        onLoad: function () { productOnLoad(this, url, $thumbnail); }
    });
}

function productOnLoad(_obj, _url, _thumbnail) 
{
    var $overlay = _obj.getOverlay();
    var ajaxUrl = _url.replace("/katter/", "/katter-ajax/");

//    setLocationHash(_url);

    $overlay.children("div").hide();

    showLoader($overlay);

    $.ajax({
        type: "GET",
        url: ajaxUrl,
        cache: true,
        success: function (msg) {
            hideLoader($overlay);
            $overlay.children("div").fadeIn("slow");
            bindOverlay($overlay, msg, _thumbnail);
        },
        error: function (msg) {
            $overlay.find(".panes").html("<h2>Ett fel intr&auml;ffade vid h&auml;mtning.</h2>");
            Cufon.refresh();
            hideLoader($overlay);
            $overlay.children("div").fadeIn("fast");
        }
    });
}

function productScroll(_obj) {
    var ajaxUrl = _obj.attr("href");
    var $overlay = _obj.parent().parent().parent().parent();
    var $thumbnail = $(".cat .catlink[href=" + _obj.attr("href") + "]").parent().parent();

//    setLocationHash(ajaxUrl);
    ajaxUrl = ajaxUrl.replace("/katter/", "/katter-ajax/");

    $overlay.children("div").hide();
    showLoader($overlay);

    $.ajax({
        type: "GET",
        url: ajaxUrl,
        cache: true,
        success: function (msg) {
            $overlay.children("div").fadeIn("fast");
            bindOverlay($overlay, msg, $thumbnail);
            hideLoader($overlay);
        },
        error: function (msg) {
            $overlay.children("div").fadeIn("fast");
            wrap.find(".panes").html("<h2>Ett fel intr&auml;ffade vid h&auml;mtning.</h2>");
            Cufon.refresh();
            hideLoader($overlay);
        }
    });
}

function clearModal(_overlay) {
    _overlay.getOverlay().find(".panes").html("");
//    setLocationHash("");
}

function bindOverlay(_overlay, _msg, _thumbnail) {
    _overlay.find(".panes").html(_msg);

    _overlay.find(".solkattcontainer img").each(function () {
        var _slideWidth = 480;
        var _slideHeight = 360;
       
        var _imageWidth = $(this).attr("width");
        var _imageHeight = $(this).attr("height");

        var _marginLeft = (_slideWidth - _imageWidth) / 2;
        var _marginTop = (_slideHeight - _imageHeight) / 2;

        $(this).css("margin-left", _marginLeft + "px");
        $(this).css("margin-top", _marginTop + "px");
    });

    _overlay.find(".solkattcontainer").each(function () {
        var p = this.parentNode;
        $(this).cycle({
            fx: 'fade',
            speed: 500,
            timeout: 0,
            cleartype: true,
            cleartypeNoBg: true,
            pager: $(".nav", p),
            before: onBefore2,
            pagerAnchorBuilder: pagerFactory2
        });
    });

    if (_overlay.find("a.prev").length) {
        _overlay.find("a.next").attr("href", getNextHref(_thumbnail));
        _overlay.find("a.prev").attr("href", getPrevHref(_thumbnail));
    }

    Cufon.refresh();
}

function getNextHref(_$elem) {
    var $thumbnails = $(".cat");
    
    var intCurrentIndex = $thumbnails.index(_$elem);
    var intNextIndex = intCurrentIndex + 1;

    if (intNextIndex > $thumbnails.length) 
        intNextIndex = 0;

    return $($thumbnails.get(intNextIndex)).find("a.catlink").attr("href");
}

function getPrevHref(_$elem) {
    var $thumbnails = $(".cat");

    var intCurrentIndex = $thumbnails.index(_$elem);
    var intPrevIndex = intCurrentIndex - 1;

    if (intPrevIndex < 0)
        intPrevIndex = $thumbnails.length - 1;

    return $($thumbnails.get(intPrevIndex)).find("a.catlink").attr("href");
}

function pagerFactory2(_index, _DOMelement) {
    var strImgSrc = _DOMelement.src;
    var strThumbnailPath = strImgSrc.replace("_480_360_thumb", "_225_165_thumb");

    if (_index == 3)
        return '<li class="lastnav"><a href="#"><span class="relimgoverbg"></span><img src="' + strThumbnailPath + '" /></a></li>';
    else
        return '<li><a href="#"><span class="relimgoverbg"></span><img src="' + strThumbnailPath + '" /></a></li>';
}

function onBefore2(curr, next, opts) {
    var _slideWidth = 480;
    var _slideHeight = 360;

    var _imageWidth = $(this).attr("width");
    var _imageHeight = $(this).attr("height");

    var _marginLeft = (_slideWidth - _imageWidth) / 2;
    var _marginTop = (_slideHeight - _imageHeight) / 2;

    $(this).css("margin-left", _marginLeft + "px");
    $(this).css("margin-top", _marginTop + "px");
}

function showLoader(_parent) {
    var $loader = $("<span class='loader'></span>");
    $loader.appendTo(_parent);
}

function hideLoader(_parent) {
    var $loader = _parent.find(".loader");
    $loader.fadeOut("fast").remove();
}

//function setLocationHash(_url) {
//    if (_url == "")
//        _url = "none";

//    recentHash = "#" + _url;
//    window.location.hash = _url;
//}

function getHeightOfElement($element) {
    var _height;

    if ($element.height() > 0) {
        _height = $element.height();
    } else {
        var $clone = $element.clone()
                      .attr("id", false)
                      .css({ visibility: "hidden", display: "block", position: "absolute" });
        $("body").append($clone);
        _height = $clone.height();
        $clone.remove();
    }

    return _height;
}

function getWidthOfElement($element) {
    var _width;

    if ($element.width() > 0) {
        _width = $element.width();
    } else {
        var $clone = $element.clone()
                      .attr("id", false)
                      .css({ visibility: "hidden", display: "block", position: "absolute" });
        $("body").append($clone);
        _width = $clone.width();
        $clone.remove();
    }

    return _width;
}