;(function($) {
    
    $.fn.MGHF_mask = function(settings) {
        this.each(function() {
            //$(this).addClass("enabled");
        });
    };
    
    $.fn.MGHF = function(settings) {
        var config = {
            prefix: "#mghf",
            image: "-image",
            data: "-data",
            content: "-content",
            next: "mghf-next-content",
            tabBumpDistance: -15,
            tabBumpSpeed: 150,
            transitionPeriod: 400,
            autoRotate: 15000
        };

        if (settings) $.extend(config, settings);

        var ari = null;
        
        this.each(function() {
            var mghf = $(this);
            //mghf.removeData("busy");
            var items = $(config["prefix"] + config["data"] + " li");
            items.hover(
                function() {
                    if (mghf.data("busy") || $(this).hasClass("active")) return;
                    $(this).stop(true).animate({top: config["tabBumpDistance"]}, config["tabBumpSpeed"]);
                },
                function() {
                    if (mghf.data("busy") || $(this).hasClass("active")) return;
                    $(this).stop(true).animate({top: 0}, config["tabBumpSpeed"]);
                }
            ).click(function() {
                if (ari) window.clearInterval(ari);
                Transition(mghf, this);
            }).find("h2 a").remove().end().filter(":last").addClass("active");
            
            if (config['autoRotate'] && items) {
                ari = window.setInterval(function() {
                    var activeItem = $(config["prefix"] + config["data"] + " li.active").prev("li");
                    if (!activeItem.length) {
                        activeItem = $(config["prefix"] + config["data"] + " li:last")
                    }
                    Transition(mghf, activeItem);
                }, config['autoRotate']);
            }
        });

        return this;
        
        function Transition(mghf, item) {
            var transitionPeriod = config["transitionPeriod"];
            if (mghf.data("busy")) return false;
            mghf.data("busy", true);
            item = $(item);
            var list = item.parent();
            var items = list.children().removeClass("active");
            var count = items.length;
            var idx = items.index(item.get(0));
            var newItems = items.filter(":gt(" + idx + ")").clone(true);
            var newCount = newItems.length;
            var itemWidth = item.outerWidth(true);
            var currentImage = mghf.find(config["prefix"] + config["image"]);
            var content = mghf.find(config["prefix"] + config["content"]);
            var nextContent = $('<div id="' + config["next"] + '" />').css("background-image", item.css("background-image")).data("background", item.css("background-image"));
            var nextImageUrl = item.children("img.large").attr("src");
            nextContent.append(item.children(":not(h2, img.large)").clone());
            content.prepend(nextContent);
            mghf.css("background-image", "url(" + nextImageUrl + ")");
            item.addClass("active");
            newItems.each(function(idx) {
                $(this).removeClass("active").css("left", (newCount - idx) * itemWidth * -1);
                if (idx == 0) $(this).prependTo(list);
                else $(this).insertBefore(list.children(":eq(" + idx + ")"));
            });
            var incr = transitionPeriod / count;
            var delay =  ((count - 1) - (idx + 1)) * incr;
            
            items = list.children();
            items.stop(true).animate(
                {
                    top: 0,
                    left: "+=" + itemWidth * (count - idx - 1)
                },
                transitionPeriod,
                "linear",
                function() {
                    items.filter(":gt(3)").remove();
                    mghf.removeData("busy");
                }
            );
            nextContent.delay(delay).animate(
                {left: 0},
                transitionPeriod - delay,
                "linear",
                function() {
                    content.html(nextContent.html());
                    content.css("background-image", item.css("background-image"));
                    nextContent.remove();
                }
            );
            currentImage.fadeOut(transitionPeriod, function() {
                $(this).attr("src", nextImageUrl).fadeIn(0);
            });
            return false;
        }
    };

})(jQuery);