$(function(){
    // Display first panel
    $('DIV#features DIV.slides DIV.slide:first').css('left',0)
    $('DIV.orb[no_js!=1]').each(
        function(i){
            this.orb_index = i;
            $(this).mouseover(function (){orb_background($(this), 80)});
            $(this).mouseout(function (){orb_background($(this), 0)});
            $(this).click(activate_orb);
            }
        );

    return;
    });

var SLIDE_TIME = 500;
var stack = [];
var feature_sliding = 0;

function activate_orb(){
    var $orb = $(this);
    if ($orb.hasClass('active')) return;

    var $old = $('DIV.orb.active');
    if ($old.length){
        $old.removeClass('active');
        orb_background($old, 0);
        }

    orb_background($orb, 170)
    $orb.addClass('active');

    var captures = $orb.attr('id').match(/(.*)_orb/);
    stack.push(captures[1]);

    // If there's a feature currently sliding then when it'd done it'll automatically use the stack
    if (!feature_sliding) show_feature();

    return;
    }

function orb_background($orb, offset){
    if ($orb.hasClass('active')) return;

    var orb_index = $orb.get(0).orb_index;
    var bg_top = (95 * orb_index)+5;
    $orb.css('backgroundPosition', '-'+offset+'px -'+bg_top+'px');
    return; 
    }

function show_feature(){
    // We've been called - so yank the first feature from the stack and act upon it
    var feature_name = stack.shift();

    // If we have more to show, then hurry up, ffs
    var adjusted_slide_time = SLIDE_TIME;
    if (stack.length) adjusted_slide_time = 200;

    var $slide = $('DIV#'+feature_name+'_slide');
    
    var $slides = $('DIV#features DIV.slides');
    var $current = $slides.find('DIV.slide.active');

    $current.animate(
        { left:   -313 },
        adjusted_slide_time,
        function(){ }
        );

    $current.removeClass('active');

    feature_sliding = 1;
    $slide.css('left', 313);
    $slide.animate(
        { left:   0 },
        adjusted_slide_time,
        function(){
            feature_sliding = 0;
            if (stack.length){
                show_feature();
                }
            }
        );

    $slide.addClass('active');

    return;
    }

