/**/

function initiateInformation(tile) {
    var tileTitle = tile.attr("data-product-title");
    var tileText = tile.attr("data-product-ingress");
    var tileLink = tile.attr("data-product-linkUrl");
    var tileLinkText = tile.attr("data-product-linkText");
    var tileHeaderImage = tile.attr("data-product-headerImage");

    $("#informationImage").attr("src", tileHeaderImage);
    $("#informationTitle").text(tileTitle);
    $("#informationIngress").html(tileText);
    $("#informationLink").attr("href", tileLink);
    if (tileLinkText != "")
        $("#informationLink").html(tileLinkText);
    else
        $("#informationLink").html("Les mer om " + tileTitle);
}


function resetGrayscale() {
    $(".toGrayscale.grayscale").each(function() {
        $(this).removeClass("grayscale");
        grayscale.reset($(this));
    });
}

function grayscaleTiles() {
    $(".toGrayscale:not(.grayscale)").each(function() {
        $(this).addClass("grayscale");
        grayscale($(this));
    });
}

function productPageTile() {
    clickOnTileProductPage($(this));
    //tileClicking(true, $(this));
}

function productOverviewTile() {
    clickOnTileOverviewPage($(this));
    //tileClicking(false, $(this));
}

function addHoverGrayscaleEffect() {
    $(this).animate({
        top: '-5px'
    }, 200);
    $(this).children(".toGrayscale").hide();

}

function removeHoverGrayscaleEffect() {
    $(this).animate({
        top: '0px'
    }, 200);
    $(this).children(".toGrayscale").show();
}

function addHoverProductPage() {
    $(".tiles").not(".selectedTile").find(".toGrayscale").show();
    $(this).find(".toGrayscale").hide();
}

function removeHoverProductPage() {
    if ($(".selectedTile").length > 0)
        $(".tiles").not(".selectedTile").find(".toGrayscale").show();
    else {
        $(".tiles").find(".toGrayscale").hide();
    }
}

function changeTile(tiles, tile, lastTileOnRow) {
    var informationContainer = $("#information-container");
    tiles.find(".toGrayscale").show();
    tile.find(".toGrayscale").hide();
   
    $(".selectedTile").hover(addHoverGrayscaleEffect, removeHoverGrayscaleEffect);

    tiles.removeClass("selectedTile");
    tile.addClass("selectedTile");
    initiateInformation(tile);
        
    $(".selectedTile").unbind('mouseenter').unbind('mouseleave');
    $(".selectedTile").animate(600, function () {
        $(this).css({
            top: '0px'
            });
    });

    informationContainer.insertAfter(lastTileOnRow);
    informationContainer.children().addClass("full-opacity");
    informationContainer.removeClass("hidden");
    informationContainer.show();
    informationContainer.animate({height : 360 }, "slow", function() {
        $(this).animate({ opacity: 1 }, 300);
        $(this).children().removeClass("full-opacity");
    });
}


function clickOnTileOverviewPage(tile) {
    var tiles = $(".main").find(".tiles:visible, .aboutTiles:visible");
    var index = tiles.index(tile);
    var informationContainer = $("#information-container");
    var information = $("#information");

    //samme tile klikket
    if (information.attr("data-ident") == index) {
        informationContainer.children().addClass("full-opacity");
        informationContainer.animate({ opacity: 0 }, 300, function () {
            informationContainer.animate({ height: 0 }, "slow", function () {
                informationContainer.hide();
                $(".toGrayscale").show();
                $(".selectedTile").hover(addHoverGrayscaleEffect, removeHoverGrayscaleEffect);
                tile.removeClass("selectedTile");
                $(this).children().removeClass("full-opacity");
            });
        });

        information.attr("data-ident", -1);
    } //klikke på annen tile
    else {
        information.attr("data-ident", index);
            var greatestIndex = tiles.size() - 1;
            var lastIndex = Math.min(index + 3 - (index % 4), greatestIndex);
            var lastTileOnRow = tiles.get(lastIndex);

            var indexPreviouslySelectedTile = tiles.index($(".selectedTile"));
            var previousLastIndex = Math.min(indexPreviouslySelectedTile + 3 - (indexPreviouslySelectedTile % 4), greatestIndex);

            informationContainer.animate({ opacity: 0 }, 300, function () {
                //clicked tile is another row than the previous one 
                if (previousLastIndex != lastIndex) {
                    informationContainer.children().addClass("full-opacity");
                    informationContainer.animate({ opacity: 0 }, 300, function () {
                        informationContainer.animate({ height: 0 }, 300, function () {
                            informationContainer.hide();
                            changeTile(tiles, tile, lastTileOnRow);
                            $('html, body').animate({ scrollTop: tile.offset().top - 235 }, 600);
                        });
                    });

                } else { //new tile is on the same row as the previously clicked one (not sliding up the information)
                    changeTile(tiles, tile, lastTileOnRow);
                }
            });
    }
}

function clickOnTileProductPage(tile) {
    var tiles = $(".tiles");
    var index = tiles.index(tile);
    var information = $("#information-container");

    //klikke på samme tile
    if ($("#information").attr("data-ident") == index) {

        information.animate({ opacity: 0 }, 300, function () {
            information.children().addClass("full-opacity");
            information.animate({ height: 0 }, { duration: 600, complete: function () {
                $(".toGrayscale").hide();
                information.hide();
            }
            });
            tile.hover(addHoverProductPage, removeHoverProductPage);
            tile.removeClass("selectedTile");
        });
        $("#information").attr("data-ident", -1);
    }
    //klikke på en annen tile
    else {
        information.find(".information-close-button").show();
        $("#information").attr("data-ident", index);



        information.animate({ opacity: 0 }, 100, function () {
            $(".selectedTile").hover(addHoverProductPage, removeHoverProductPage);
            tiles.removeClass("selectedTile");
            tile.addClass("selectedTile");
            tiles.find(".toGrayscale").show();
            tile.find(".toGrayscale").hide();
            //$(".tiles").not(".selectedTile").find(".toGrayscale").show();
            $(".selectedTile").unbind('mouseenter').unbind('mouseleave');

            initiateInformation(tile);

            if (information.css("display") == "none")
                $('html, body').animate({ scrollTop: $(document).height() - $(".main-footer").height() - 360 - tile.height() + 40 }, 600);

            information.children().addClass("full-opacity");
            information.show();
            information.animate({ height: 360 }, 600, function () {
                $(this).animate({ opacity: 1 }, 100);
                $(this).children().removeClass("full-opacity");
            });
        });
    }
}