$.fn.awesomebanner = function() {
    var $ = jQuery.noConflict();
    var banner = $(this[0]);
    
    var lis = banner.find('li');
    var numberOfImages = lis.length;
    var bannerNavWidth = banner.width() - 1;
    var imgWidths = [];
    var imgHalfWidths = [];
    var anchors = [];
    var originalWidth = Math.floor(bannerNavWidth / numberOfImages);
    var timeout = null;
    
    var init = function(){
        lis.bind('mouseenter', function() {
            clearTimeout(timeout);
            var bannerThing = $(this);
            timeout = setTimeout(function() {
               hoverOn(bannerThing);
            }, 250);
        });
        banner.bind('mouseleave', function() {
            clearTimeout(timeout);
            hoverOff();
        });

        var imgs = $(banner).find('img');
        for (var i = 0; i < imgs.length; i++) {
            imgWidths[i] = imgs[i].width; //Real pixel widths.
            imgHalfWidths[i] = '-' + ((imgWidths[i] / 2) - (originalWidth / 2)) + 'px';
            anchors[i] = $(imgs[i]).parents('a');
            //anchors[i].css('margin-left', imgHalfWidths[i]);
            //anchors[i].stop().animate({'margin-left': imgHalfWidths[i]}, 'slow');
            //anchors[i].css('display', 'block');
        }
    }

    var doAnimation = function(ind, itemWidth, otherWidth) {
        var curr = ind != null ? ind : 0;

        for(var i = 0; i<lis.length; i++){
            var l = $(lis[i]);
            var img = $(l.find('img'));
            var txt = $(l.find('.text'));
            var anchor = $(l.find('a'));
 
            if (i == ind) {
                l.stop().animate({width: itemWidth}, "slow");
                img.stop().animate({"opacity": "0"}, "slow");
                anchor.stop().animate({"margin-left": "0px"}, "slow");
                //txt.stop().animate({"opacity": "1"}, "slow");
                //dcc.txt.stop().fadeIn('slow');
                txt.stop().fadeTo('slow', 1.0);
            }
            else {
                l.stop().animate({width: otherWidth}, "slow");
                img.stop().animate({"opacity": "1"}, "slow");
                anchor.stop().animate({"margin-left": imgHalfWidths[i]}, "slow");
               // txt.stop().animate({"opacity": "0"}, "slow");
               //txt.stop().fadeOut('slow');
               txt.stop().fadeTo('slow', 0.0);
            }
        }
    }
        
    var resetAnimation = function(itemWidth) {
        for(var i = 0; i < lis.length; i++){
            var l = $(lis[i]);
            var img = $(l.find('img'));
            var txt = $(l.find('.text'));
            var anchor = $(l.find('a'));
            
            l.stop().animate({width: itemWidth}, "slow");
            img.stop().animate({"opacity": "1"}, "slow");
            anchor.stop().animate({"margin-left": imgHalfWidths[i]}, "slow");
            
            //txt.stop().animate({"opacity": "0"}, "slow");
            //txt.stop().fadeOut('slow');
            txt.stop().fadeTo('slow', 0.0);
        }
    }
    
    var hoverOn = function(t){   
        var cl = t.attr('class');
        var im = t.find('img');

        var mainWidth = 0.0;
        var otherWidth = 0.0;

        var ind = cl.charAt(cl.length - 1);
        for (var i = 0; i < numberOfImages; i++) {
            if (ind == i) {
                var diff = bannerNavWidth - imgWidths[i];
                otherWidth = Math.floor(diff / (numberOfImages - 1.0));
                mainWidth = Math.floor(imgWidths[i]);
                
                break;
            }
        }
        
        doAnimation(ind, mainWidth, otherWidth);
    }


    var hoverOff = function() {
        //resetAnimation(Math.floor(100 / numberOfImages) + '%');
        resetAnimation(Math.floor(bannerNavWidth / numberOfImages) + 'px');
    }

    init();
};