(function($){
    $.fn.itunesFeature = function(options) {
        var options = $.extend(true, $.fn.itunesFeature.defaults, options);    

        return this.each(function(){
            var self    = $(this);
            var context = {
                container : self,
                transitionInProgress : false,
                manualTransition : false,
                pausePresentation : false
            };
            
            ie6();
            
            readBillboardImages(options, context);
            
            if (context.images.length < 4) {
                alert('The "iTunesFeature" widget requires at least four sets of images!');
                return;
            }
            
            initializeBillboards(options, context);
            initializeCarrousel(options, context);
            runBillboards(options, context);
        });
    };
    
    $.fn.itunesFeature.defaults = {
        transitionsInterval : 5000,
        transitionsLength   : 600
    };
    
    function ie6() {
        return ($.browser.msie && $.browser.version == "6.0");
    };

    function readBillboardImages(options, context) {
        var boxes = context.container.find("div");
        context.images = [];

        boxes.each(function(inx, box){
            var imgs = jQuery(box).find("img");
            var anchors = jQuery(box).find("a");
            if (imgs.length >= 2) {
                context.images.push({
                    title: $(box).find("span").text(),
                    thumb: $(imgs[0]).attr("src"), 
                    large: $(imgs[1]).attr("src"),
                    link : $(anchors[0]).attr("href")
                });
            }
        });
        
        context.images.current = 0;
        context.images.next    = 1;
        boxes.remove();
    };
    
    function initializeCarrousel(options, context) {
        context.carrousel = $(document.createElement("ul")).attr("id", "carrousel");
        context.container.append(context.carrousel);

        for (var i = context.images.length - 1; i >= 0; i--) {
            var img = context.images[i];
            var html = '<li style="background:url(' + img.thumb + ') no-repeat"></li>';             
            context.carrousel.append(html);
        }

        context.downArrow = $(document.createElement("img")).attr({"src": "/images/itunes/nothing.gif", "class": ((ie6()) ? "downarrow downarrowIE6" : "downarrow")}).css({"opacity": "0"});
        context.container.append(context.downArrow);

        context.container.bind("mouseenter mouseleave", function(e){
            context.downArrow.css("opacity", (e.type == "mouseenter") ? "8" : "0");
        });
        
        context.downArrow.bind("mouseenter mouseleave click", function(e){
            switch (e.type) {
                case "mouseenter":
                    context.pausePresentation = true;
                break;
                
                case "mouseleave":
                    context.pausePresentation = false;
                break;
                
                case "click":
                    if (context.transitionInProgress) return;
                    context.manualTransition = true;
                    onBillboardTransition(options, context);
                    context.manualTransition = false;
                break;
            }
        });
    };

    function initializeBillboards(options, context) {
        context.container.append('<div id="billboardone"></div><div id="billboardtwo"></div>');
        var panels = context.container.find("div");
        
        context.billboard1      = $(panels[0]);
        context.billboard2      = $(panels[1]).fadeTo(0,0);
        context.activeBillboard = context.billboard1;
        
        context.titleBar = $(document.createElement("span")).attr({"class": (ie6() ? "featuretitle featuretitleIE6" : "featuretitle")}).html("Some big title here");
        context.container.append(context.titleBar);

        context.transparentGlass = jQuery(document.createElement("div")).attr("id","transparentGlass");
        context.container.append(context.transparentGlass);

        context.transparentGlass.click(function(e){
            var link = context.images[context.images.current].link;
            if (link)
                document.location.href = context.images[context.images.current].link;
        });
    };
    
    function runBillboards(options, context) {
        with (context) {
            billboard1.css({"background" : "url(" + images[images.current].large + ") no-repeat"});
            billboard2.css({"background" : "url(" + images[images.next   ].large + ") no-repeat"});
            titleBar.html(images[images.current].title);
        }

        context.container.css("display", "block");
        context.billboardIntervalHandle = setInterval(function(){
            onBillboardTransition(options, context);
        }, options.transitionsInterval);
    };
    
    function reorderImagePointers(images) {
        images.current = (images.current == images.length - 1) ? 0 : images.current + 1;
        images.next    = (images.next    == images.length - 1) ? 0 : images.next    + 1;
    };
    
    function onBillboardTransition(options, context) {
        with (context)
            if (transitionInProgress || (pausePresentation && manualTransition == false))
                return;

        var newBillboard = (context.activeBillboard == context.billboard1) ? context.billboard2 : context.billboard1;
        var curBillboard = context.activeBillboard;

        newBillboard.css({"background" : "url(" + context.images[context.images.next].large + ") no-repeat"});
        
        updateCarrousel(options, context);
        context.carrousel.animate({top: "0px"}, options.transitionsLength);
        
        var w = context.titleBar.width();
        var l = context.titleBar.position().left;
        
        context.titleBar.animate({left: -(l + w) + "px"}, options.transitionsLength / 2, function(){
            context.titleBar.html(context.images[context.images.next].title).css("left", -(context.titleBar.width() + 50) + "px");
            context.titleBar.animate({left: l + "px"}, options.transitionsLength / 2);
        });

        context.transitionInProgress = true;
        newBillboard.fadeTo(options.transitionsLength, 1);
        curBillboard.fadeTo(options.transitionsLength, 0, function(){
            context.activeBillboard = newBillboard;
            reorderImagePointers(context.images);
            curBillboard.css({"background" : "url(" + context.images[context.images.current].large + ") no-repeat"});
            context.transitionInProgress = false;
        });
    };
    
    function updateCarrousel(options, context) {
        var firstItem = context.carrousel.find("li:first");
        var lastItem  = context.carrousel.find("li:last" );
        
        context.carrousel.css("top", -firstItem.height() + "px");

        firstItem.before(lastItem);
    };

})(jQuery);