(function($) {
    $.fn.heroSwap = function(options) {
        // add to defaults
        var o = $.extend({}, $.fn.heroSwap.defaults, options);
        // check we have the right id
        o.container = '#' + $(this).attr('id');
        o.container_static = $(this).attr('id');
        o.animation_ref = o.container_static + '_' + o.animation_ref;


        // some default setting
        var timer, continue_cycle = true, next_hero, prev_hero, current_hero = o.default_hero;
        // list of all the available heroes
        var heroes = $(this).find(o.content_class + " li");
        // list of available nav items
        var navs = $(this).find(o.nav_class + " li");
        // get prev/next
        var nextbtn = $(this.find(o.next));
        var prevbtn = $(this.find(o.prev));

        /** automatic something **/
        // swap two images
        var swap = function(a, b) {
            // make sure the new one isnt the original
            if (a != b) {
                //alert("a: " + a);
                //alert("b: " + b);
                // set the new current hero
                set_active(b);

                // easy use
                var fout = $(heroes[a]);
                var fin = $(heroes[b]);

                // and the old one out
                fout.fadeOut(o.fade_time);
                // fade the new item in
                fin.fadeIn(o.fade_time);
            }
        }

        // 
        var set_active = function(i) {
            // remove the active state from the current hero
            $(navs[current_hero]).removeClass('active');

            // make whatever was clicked the new hero
            current_hero = i;

            // add an active class to the selected item
            $(navs[i]).addClass('active');
        }

        // get the next hero
        var get_next_hero = function(i) {
            // get the next index
            var next = current_hero + 1;

            // make sure the next one exists
            if (next + 1 > heroes.length) {
                // if not, start at the start
                next_hero = 0;
            }
            else {
                // otherwise make the next one next
                next_hero = next;
            }
        }

        // get the prev hero
        var get_prev_hero = function(i) {
            var prev = current_hero - 1;
            if (prev < 0) {
                prev_hero = heroes.length - 1;
            }
            else {
                prev_hero = prev;
            }
        }

        // anything to do if auto is set?
        var cycle = function(type) {
            // if we should continue the cycle
            if (continue_cycle == true) {
                // no point fading if theres only one item
                if (heroes.length >= 1) {
                    // get the next hero
                    get_next_hero(current_hero);

                    timer = setTimeout(function() {
                        swap(current_hero, next_hero);
                        cycle();
                    }, o.cycle_delay);

                }
            }
        }

        // if we want to cycle
        if (o.cycle == true) {
            cycle(o.type);
        }
        
        
        // this was added, incase there was no nav items, needs to be reviewed
        $(this).find(o.content_class + " li").each(function(i) {
            if (i != current_hero) {
                $(heroes[i]).css({
                    'display': 'none'
                }); 
            }
        });

    // get all the nav items
    $(this).find(o.nav_class + " li").each(function(i) {

        $(heroes[i]).css({
            'position': 'absolute',
            'top': '0',
            'left': '0',
            'overflow': 'hidden'
        });

        if (i != current_hero) {
            $(heroes[i]).css({
                'display': 'none'
            });
        }

        // set clickable for each nav item
        $(this).click(function() {
            var clicked_nav = navs.index(this);
            // stop cycling
            if (o.cycle == true) {
                clearTimeout(timer);
                continue_cycle = false;
            }
            // fade them over
            swap(current_hero, clicked_nav);


            // stop the anchor being followed
            return false;
        });
    });

    // trying to do prev/next links
    if (nextbtn != undefined) {
        $(nextbtn).click(function() {
            // stop cycling
            if (o.cycle == true) {
                clearTimeout(timer);
                continue_cycle = false;
            }
            get_next_hero(current_hero);
            swap(current_hero, next_hero);
            return false;
        });
    }
    if (prevbtn != undefined) {
        $(prevbtn).click(function() {
            if (o.cycle == true) {
                clearTimeout(timer);
                continue_cycle = false;
            }
            get_prev_hero(current_hero);
            swap(current_hero, prev_hero);
            return false;
        });
    }

    // the current hero
    set_active(o.default_hero);

};


$.fn.heroSwap.defaults = {
    default_hero: 0,
    container: "#fader",
    nav_class: ".fader-nav",
    content_class: ".fader-content",
    animation_ref: "in_anim_0o0o",
    cycle: true,
    cycle_delay: 2500,
    type: 'fade',
    fade_time: 1500,
    prev: '#fader-prev',
    next: '#fader-next'
};
})(jQuery);

