jQuery.fn.personas = function(options) {

    var settings = jQuery.extend({}, jQuery.fn.personas.defaults, options);

    var scroller = {
    
                frame : Object,
                buttons : Object,
                person : Object,
                skip : Number,
                overlay : Object,
                
                init :          function(settings){
                                    this.frame.box = $("#personas");
                                    this.frame.viewable = $("#viewable");

                                    this.buttons.code = "<div class='buttons'><a href='#' id='left'></a><a href='#' id='right'></a></div>";

                                    this.person.list = $("#persona_list");                               
                                    this.person.boxes = $("#personas .persona");
                                    
                                    this.skip = settings.skip;
                                    
                                    this.overlay = "<div></div>";
                                                    
                                    this.run();
                                },
                                
                cover :         {
                                    add:    function(){
                                                size = {
                                                    w: $(scroller.frame.box).width(),
                                                    h: $(scroller.frame.box).height()
                                                }
                                                
                                                $(scroller.overlay).prependTo(scroller.frame.box).css({ 
                                                    width: size.w,
                                                    height: size.h
                                                }).addClass("overlay");
                                            },
                                            
                                    remove: function(){
                                                $(".overlay").remove();
                                            }
                                },
                                
                resize_list :   function(){
                                    
                                    new_width = $(settings.persona_list.personas).length;
                                    new_width *= $(this.person.boxes).width();

                                    $(this.person.list).width(new_width);
                                    
                                },
                                
                populate :      function(settings){
                                    var base = this;
                                    var persona_stack = [];
                                    var summaries = [];
                                    
                                    data = settings.persona_list.personas;
                                    
                                    $(data).each(function(i){

                                        persona_stack[i]    = "<div class='persona' id='persona_" + i + "'>"
                                                            + "<a href='" + data[i].link + "'>"
                                                            + "<img src='" + data[i].image + "'>"
                                                            + "<span>" + data[i].title + "</span>"
                                                            + "</a>"
                                                            + "</div>";

                                        summaries[i] = "<div class='extra persona_" + i + "'><i></i>" + data[i].summary + "</div>";

                                    });
                                                                        
                                    $("#persona_list").html(persona_stack.join("\n"));
                                    $("#personas").append(summaries.join("\n")).animate({ opacity: 1 }, function(){
                                        base.init(settings);
                                    });
                                    
                                    
                                },
    
                set_buttons :   function(){
                
                                    button_right = $("#right");
                                    button_left = $("#left");
                                    
                                    size = {
                                        viewable: $(this.frame.viewable).width(),
                                        list: $(this.person.list).width()
                                    };
                                    
                                    position = {
                                        viewable: $(this.frame.viewable).offset(),
                                        list: $(this.person.list).offset()
                                    };
                                    
                                    if(((position.list.left - position.viewable.left) - size.viewable) <= (size.list * -1)){

                                        $(button_right).removeClass("active").css({ opacity: .5 });

                                    } else {

                                        $(button_right).addClass("active").css({ opacity: 1 });

                                    }
                                    
                                    if(position.list.left == position.viewable.left){
                                    
                                        $(button_left).removeClass("active").css({ opacity: .5 });

                                    } else {

                                        $(button_left).addClass("active").css({ opacity: 1 });

                                    }
                
                                },
                                
                shift :         function(direction){
                                    
                                    base = this;
                                    
                                    base.cover.add();
                
                                    distance = $(this.person.boxes).width() * base.skip;
                                    position = {
                                        viewable: $(this.frame.viewable).offset(),
                                        list: $(this.person.list).offset()
                                    };

                                    if(direction == "right"){
                                        distance *= -1;
                                    }

                                    distance += position.list.left;
                                    distance -= position.viewable.left;

                                    $(this.person.list).animate({ left: distance }, function(){
                                        base.cover.remove();
                                        base.set_buttons();
                                    });
                
                                },
                                
                run :           function(){
                                    base = this;
                                    
                                    base.resize_list();

                                    $(base.buttons.code).appendTo(base.frame.box).find("a").css({ opacity: .5 });
                                    
                                    base.set_buttons();

                                    $(".buttons a").live("click", function(){
                                        
                                        is_active = $(this).attr("class");
                                        
                                        if(is_active == "active"){
                                            direction = $(this).attr("id");
                                            base.shift(direction);
                                        }
                                        
                                        return false;
                                        
                                    });
                                    
                                    $(base.person.boxes).hover(function(){
                                        
                                        my_id = $(this).attr("id");
                                        my_bubble = $("." + my_id);

                                        my_pos = $(this).offset();
                                        outer_pos = $(base.frame.viewable).offset();
                                        bubble_w = $(my_bubble).width();
                                        outer_w = $(base.frame.viewable).width();
                                        my_w = $(this).width();
                                        i_w = $(this).find("i").width();
                                        
                                        i_pos = my_pos.left - outer_pos.left + ((my_w - i_w) / 2) + ((bubble_w - outer_w) / 2);
                                        
                                        $(my_bubble).fadeIn().find("i").css({ left: i_pos });
                                        
                                    }, function(){
                                    
                                        $("." + my_id).fadeOut();
                                    
                                    });
                                    
                                }
    
    }

    $.getJSON(settings.json_path, function(json){
        
        settings.persona_list = json;
        scroller.populate(settings);

    });


    jQuery.fn.personas.defaults = {
        json_path: "personas.json",
        skip: 3
    }

};