$(document).ready(function() {
  title = document.title;
  menuIMG = $("img.front_page").attr("src");
  mapURL='http://maps.google.com/maps/ms?ie=UTF8&hl=bg&t=h&msa=0&msid=117199891936130864042.00048a6c82e794202381f&ll=41.603506,24.669757&spn=0.009627,0.019269&z=15&';
  lastSelected = new Object();
  lastPartner = new Object();
  lastClicked = 0;
  navigationPrimary();
});

function navigationPrimary() {
  $("div.css-tabs").tabs("div.css-panes > div", {
    effect: 'fade',
    initialIndex: 0,
    fadeOutSpeed: "slow",
    history: true,

    onBeforeClick: function(event, i) {
        // get the pane to be opened
        var pane = this.getPanes().eq(i);

        // only load once. remove the if ( ... ){ } clause if you want the page to be loaded every time
        if (pane.is(":empty")) {
            // load it with a page specified in the tab's href attribute
            pane.load(this.getTabs().eq(i).attr("href"),function(){
                $(".remove").each(function() {
                    $(this).replaceWith($(this).contents());
                })

                $(".back").remove();

                if (i == 1) { // If it is the gallery
                    replaceThumbnails();
                    startGallery();
                }

                if (i == 4) { // If it is partners
                    initPartners();
                }
            });
        }

        document.title = (title + " - " + this.getTabs().eq(i).text());

        if (i == 2) {
            $("div.container").append('<iframe class="front_page" style="display: none; border: 0px;" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="' + mapURL + 'output=embed"></iframe><a class="map_link" href="' + mapURL + 'source=embed">По-голяма карта</a>');

            $("div.container iframe").load(function(){
                $("img.front_page").fadeOut('slow', function() {
                    $("div.container iframe").width($("div.container iframe").width() + 1);
                    $("div.container iframe").fadeIn();
                });
            });
        }
        else {
            $("div.container iframe, div.container a").fadeOut();
            $("div.container iframe, div.container a").remove();
            if ($("img.front_page").attr("src") !== menuIMG) {
                if (lastClicked == 2) {
                    $("img.front_page").attr("src", menuIMG);
                    $("img.front_page").fadeTo("medium", 1);
                }
                else {
                    $("img.front_page").fadeTo("medium", 0.2, function(){
                        $(this).attr("src", menuIMG);
                        $(this).fadeTo("medium", 1);
                    });
                }

                // clear all selected
                lastSelected = new Object();
                $("#trueContainer img").each(function(index) {
                    hoverIMG("out", $(this))
                });
            }
            else {
                $("img.front_page").fadeTo("medium", 1);
            }
        }

        lastClicked = i;
    },

    onClick: function(event, i) {
        if (i == 1)
            $("body").resize();
    }
  });
}

function replaceThumbnails() {
    $("#trueContainer img").each(function() {
        $(this).attr('src', $(this).attr('alt'));
        $(this).removeAttr('alt');
    });
}

function startGallery() {
    // Start the gallery
    fillup();

    // Bind click events of the thumbnail
    $("#trueContainer img").click(function() {
        // see if same thumb is being clicked
        if ($(this)[0] === lastSelected[0]) { return; }

        // calclulate large image's URL based on the thumbnail URL
        var url = "";
        if ($(this).attr("src").search("_bl_th.png") > 0) {
            url = $(this).attr("src").replace("_bl_th.png", ".jpg");
        }
        else {
            url = $(this).attr("src").replace("_th.png", ".jpg");
        }

        // get handle to element that wraps the image and make it semi-transparent
        $("img.front_page")
            .fadeTo("medium", 0.2, function(){
                // at the end of animation start replacing image
                var wrap=$(this);
                // the large image
                var img = new Image();
                // call this function after it's loaded
                img.onload = function() {
                    // change the image
                    wrap.attr("src", url);

                    // make wrapper fully visible
                    wrap.fadeTo("medium", 1);
                };

                // begin loading the image
                img.src = url;
            });

        // activate item
        lastSelected = $(this);
        hoverIMG("in", $(this));
        $("#trueContainer img").each(function(index) {
            hoverIMG("out", $(this))
        });
    });

    // Bind hover IN and OUT events
    $("#trueContainer img").hover(
        function() { // HoverIn
            $("#trueContainer img").each(function(index) {
                hoverIMG("out", $(this))
            });
            hoverIMG("in", $(this));
        },

        function () { // HoverOut
            $("#trueContainer img").each(function(index) {
                hoverIMG("out", $(this))
            });
        }
    );
}

function initPartners() {
    // Bind click events
    $("div.partners img").click(function() {
        // activate item
        lastPartner = $(this);
        hoverIMG("in", $(this));
        $("div.partners img").each(function(index) {
            hoverIMG("out", $(this))
        });
    });

    // Bind hover IN and OUT events
    $("div.partners img").hover(
        function() { // HoverIn
            hoverIMG("in", $(this));
        },

        function () { // HoverOut
            hoverIMG("out", $(this));
        }
    );
}

function hoverIMG (direction, what) {
    // Check if it is the last Selected object or Partner
    if (what[0] === lastSelected[0] || what[0] === lastPartner[0]) { return;}

    // Check if it is hover in or out
    if (direction == "in") {
        if (what.attr("src").search("_bl_th.png") > 0) {
            // calclulate large image's URL based on the thumbnail URL
            var url = what.attr("src").replace("_bl_th.png", "_th.png");
        }
        else {
            return;
        }
    }
    else {
        if (what.attr("src").search("_bl_th.png") < 0) {
            // calclulate large image's URL based on the thumbnail URL
            var url = what.attr("src").replace("_th.png", "_bl_th.png");
        }
        else {
            return;
        }
    }

    // get handle to element that wraps the image
    var wrap = what;

    // the large image
    var img = new Image();


    // call this function after it's loaded
    img.onload = function() {
        // change the image
        wrap.attr("src", url);
    };

    // begin loading the image
    img.src = url;
}