$(function($) {

    // Template for interactions
    $.tpl('quilt_square', [
        '<div class="quilt_square">',
            '<img src="{imageUrl:s}"/>',
        '</div>'
    ]);

    // Initialize Stream objects
    var Quilt = new Object();

    // Set constants
    Quilt.rows = 6;
    Quilt.cols = 10;
    Quilt.squareSize = 85;
    Quilt.opacity = 0.30;
    Quilt.tipDelay = 1300;
    Quilt.auotoPlaySpeed = 8000;
    Quilt.auotoPlayInactivityTime = 15000;

    // Cache commonly used elements
    Quilt.grid = $("#quilt_grid_container");

    Quilt.tooltip = $("#quilt_tip");
    Quilt.tooltipTop = $("#quilt_tip_top");

    Quilt.leftCarrot = $("#quilt_tip_carrot_left");
    Quilt.rightCarrot = $("#quilt_tip_carrot_right");

    Quilt.avatarContainer = $("#avatar_container");
    Quilt.avatars = $("#avatar_container img");
    Quilt.numAvatars = Quilt.avatars.size();

    Quilt.rank = $("#rank");
    Quilt.rankSuffix = $("#rank_suffix");

    Quilt.rankDelta = $("#rank_delta");

    Quilt.more = $("#more");
    Quilt.moreBox = $("#more_box");

    Quilt.tooltipWidth = 290;
    Quilt.tooltipHeight = 350;
    Quilt.tooltipOffset = Quilt.squareSize+ 100;
    Quilt.selectedItem = null;

    Quilt.utils = new Object();

    Quilt.utils.maxLength = function( str, len ) {
        return ( str.length > len ) ? str.substring( 0, len ) + "..." : str;
    };

    Quilt.utils.getSuffix = function ( rank )
    {
        if (Math.floor(rank / 10) % 10 == 1) {
            return "th";
        } else {
            switch (rank % 10) {
                 case 1 : return "st";
                 case 2 : return "nd";
                 case 3 : return "rd";
                default : return "th";
            }
        }
    };

    Quilt.utils.log = function(msg)
    {
        if(typeof(console) != "undefined")
            console.log(msg);
    };

    Quilt.utils.navOpen = function()
    {
        return jQuery("#adb_smartlinks_navigator").css("display") == "block" ||
                      jQuery("#adb_navigator").css("display") == "block";
    }

    Quilt.loadGrid = function(category)
    {
        if (Quilt.selectedItem)
        {
            Quilt.deselectItem(Quilt.selectedItem);
            Quilt.tooltip.fadeOut("normal");
        }
        Quilt.grid.empty();
        $.ajax({
                type: "GET",
                url: "../api/popular.php?category=" + category,
                dataType: "json",
                success: function(json) {

            var interactions = json.interactions;
                    
            for(var row = 0; row < Quilt.rows; row++)
            {
                for(var col = 0; col < Quilt.cols; col++)
                {
                    var interaction = interactions[row * Quilt.cols + col];

                    var el = $.tpl("quilt_square", {
                        imageUrl: interaction.image
                    });
                    el.data("row", row);
                    el.data("col", col);
                    el.data("title", Quilt.utils.maxLength(interaction.title, 30));
                    el.data("objectKey", interaction.objectKey);
                    el.data("link", interaction.link);
                    el.data("rank", interaction.rank);
                    el.data("delta", interaction.rankChange);
                    el.data("more", interaction.activity > Quilt.numAvatars ? interaction.activity - Quilt.numAvatars : 0);
                    el.data("category", interaction.category);

                    Quilt.grid.append(el);
                }

            }

            // bind all events for grid squares
            $("div.quilt_square").hover(
                function (){
                    if(!Quilt.utils.navOpen()) // This is a hack because we cant get callback on navigator close, so we cant correctly pause/resume
                    {
                        clearTimeout(Quilt.tooltipTimer);
                        userActivity();
                        var el = this;
                        Quilt.selectItem(el);
                        Quilt.tooltipTimer = setTimeout(function()
                        {
                            Quilt.showTip(el);
                        }, Quilt.tipDelay );
                    }
                }, function()
                {
                    if(!Quilt.utils.navOpen()) // This is a hack because we cant get callback on navigator close, so we cant correctly pause/resume
                    {
                        clearTimeout(Quilt.tooltipTimer);
                        Quilt.deselectItem(this);
                        Quilt.hideTip();
                    }
                }).click( function()
                {
                    ExploreUtils.showPane($(this).data("objectKey"),$(this).data("link"), "QUILT");
                }).children().bind("error", function()
                {
                    ExploreUtils.glueOnImageError(this, $(this).data("category"), $(this).data("objectKey"));
                });


                clearTimeout(Quilt.autoPlayTimer);
                Quilt.autoPlayTimer = setTimeout(autoPlay, 2000 );
        }});
    };

    /******************
     * Item Selection
     ******************/

    Quilt.selectItem = function(el)
    {
        Quilt.selectedItem = el;
        $(el).stop(true, true);

        $(el).fadeTo("fast", "1.0");
    };


    Quilt.deselectItem = function(el)
    {
        if(el == Quilt.selectedItem)
            Quilt.selectedItem = null;

        $(el).fadeTo("fast", Quilt.opacity);
    };


    function getActionClass(action) {
        switch(action) {
            case "Liked":
                return "liked";
            case "Comment":
                return "commented";
            case "LikedComment":
                return "commented";
            default:
                return "";
        }
    }

    Quilt.showTip = function(el)
    {
        if(!el)
            el = Quilt.selectedItem;


        var pos = $(el).position();

        var top = pos.top + Quilt.squareSize/2 - 113;
        var left;

        if($(el).data("col") >= (Quilt.cols / 2))
        {
            Quilt.leftCarrot.hide();
            Quilt.rightCarrot.show();
            left = pos.left - Quilt.tooltipWidth - Quilt.tooltipOffset + Quilt.squareSize;
        } else {
            Quilt.rightCarrot.hide();
            Quilt.leftCarrot.show();
            left = pos.left + Quilt.tooltipOffset;
        }

        Quilt.tooltip.data("link", $(el).data("link"));
        Quilt.tooltipTop.text($(el).data("title"));

        var rank = $(el).data("rank");
        var delta = $(el).data("delta");
        var oldPos = rank + delta;

        Quilt.rank.text(rank);
        Quilt.rankSuffix.text(Quilt.utils.getSuffix(rank));

        Quilt.rankDelta.removeClass("up down").addClass( delta > 0 ? "up" : delta < 0 ? "down" : "").text( (delta > 0 ? "Up from " : "Down from ") + (oldPos > 100 ? "100+" : oldPos + Quilt.utils.getSuffix(oldPos) ) ); 

        Quilt.avatars.each(function()
        {
            this.src = "http://s3.amazonaws.com/blueorganizer/images/default/person.png";
            $(this).removeClass("comment liked");
        });

        if($(el).data("interactions"))
        {
            Quilt.loadAvatars($(el).data("interactions"));
        } else {
            $.ajax({
                    type: "GET",
                    url: "../api/interactions.php?objectId=" + $(el).data("objectKey"),
                    dataType: "json",
                    success: function(json)
                    {
                        if(json && json.interactions)
                        {
                            var interactions = json.interactions;
                            $(el).data("interactions", interactions);
                            Quilt.loadAvatars(interactions);
                        }
                    }});
        }

        if($(el).data("more") == 0)
        {
            Quilt.moreBox.hide();
        } else {
            Quilt.more.text($(el).data("more"));
            Quilt.moreBox.show();
        }

        Quilt.tooltip.css({"left": left, "top": top });

        // IE has many issues with fading tips, just show it
        if($.browser.msie)
        {
            Quilt.tooltip.show();
        } else {
            Quilt.tooltip.fadeIn(1000);
        }
    };

    Quilt.hideTip = function(cb)
    {
        // IE has many issues with fading tips, just hide it
        if($.browser.msie){
            Quilt.tooltip.hide();
            if(cb && cb.call)
                cb.call();
        } else {
            Quilt.tooltip.fadeOut(cb);
        }
    };

    Quilt.loadAvatars = function(interactions)
    {
        var max = interactions.length > Quilt.numAvatars ? Quilt.numAvatars : interactions.length;

        Quilt.avatars.each(function(i){
            if(i < interactions.length && interactions[i].userId)
            {
                this.src = "http://s3.amazonaws.com/adb/" + interactions[i].userId + "/avatar.png";
             //   $(this).addClass(getActionClass(interactions[i].action));
            }
        });

    };

    Quilt.selectRandomItem = function()
    {
        var rand = Math.floor(Math.random() * Quilt.grid.children().length);
        Quilt.selectItem(Quilt.grid.children().get(rand));
    };

    Quilt.categoryClicked = function(auto)
    {
        var el = $(this).attr("class", "selected").parent();
        var cat = $(this).parent().attr("class")? $(this).parent().attr("class"): "all";
        $("li:not(." + cat + ") a", ("#quiltControls")).removeClass();
        userActivity();
        Quilt.loadGrid(cat);
    };

    function autoPlay()
    {
        clearTimeout(Quilt.autoPlayTimer);
        clearTimeout(Quilt.tooltipTimer);

        if(!Quilt.utils.navOpen()) // This is a hack because we cant get callback on navigator close, so we cant correctly pause/resume
        {
            if(!Quilt.autoPlaying)
            {
                Quilt.fadeGrid();
                Quilt.autoPlaying = true;
            }

            if(Quilt.selectedItem)
                Quilt.deselectItem(Quilt.selectedItem);

            Quilt.selectRandomItem();
            Quilt.hideTip(Quilt.showTip);
        }

        Quilt.autoPlayTimer = setTimeout(autoPlay, Quilt.auotoPlaySpeed);
    }

    function userActivity()
    {
        clearTimeout(Quilt.autoPlayTimer);
        Quilt.autoPlaying = false;
        Quilt.hideTip();
        Quilt.autoPlayTimer = setTimeout(autoPlay, Quilt.auotoPlayInactivityTime);
    }

    Quilt.pauseAutoplay = function(){
        clearTimeout(Quilt.autoPlayTimer);
        Quilt.hideTip();
        Quilt.grid.mouseleave();
        Quilt.utils.log("Blur");
    };

    Quilt.resumeAutoplay = function(){
        clearTimeout(Quilt.autoPlayTimer);
        Quilt.autoPlayTimer = setTimeout(autoPlay, 2000);
        Quilt.utils.log("Fucs");
    };

    Quilt.fadeGrid = function()
    {
        if(!Quilt.utils.navOpen())
        {
            var els = $("div.quilt_square");
            if(Quilt.selectedItem)
                els = els.not(Quilt.selectedItem);
            els.fadeTo("slow", Quilt.opacity);
        }
    };

    Quilt.lightGrid = function()
    {
        if(!Quilt.utils.navOpen())
            $("div.quilt_square").stop(true,true).fadeTo("normal", 1);
    };

    Quilt.grid.mouseleave(function()
    {
        clearTimeout(Quilt.fadeTimer);
        Quilt.fadeTimer = setTimeout(Quilt.lightGrid, 500);
    });

    Quilt.grid.mouseenter(function()
    {
        userActivity();
        clearTimeout(Quilt.fadeTimer);
        Quilt.fadeGrid();
    });

    $("#quiltControls li a").click(Quilt.categoryClicked);


//if (/*@cc_on!@*/false) { // check for Internet Explorer
//	document.onfocusin = Quilt.resumeAutoplay;
//	document.onfocusout = Quilt.pauseAutoplay;
//} else {
//	window.onfocus = Quilt.resumeAutoplay;
//	window.onblur = Quilt.pauseAutoplay;
//}


    Quilt.categoryClicked();

});