var move_to_offset,
    set_and_move_offset,
    move_on_click,
    current_offset = 0,
    hero_width,
    timeout = 5000,
    interval,
    current_offset = 0,
    hero,
    wn,
    elements,
    controls,
    create_timeout;

$(document).ready(function(){
    hero = $('#hero');
    wn = $('#window');
    elements = hero.find('li > a > img');
    controls = $('#controls');
    controls.find( 'a' ).click( move_on_click );

    wn.css( 'position' , 'relative' )
        .css( 'left' , 0 );

    hero_width = 912;
    create_timeout();
});

create_timeout = function(){
    interval = setTimeout( set_and_move_offset , timeout );
}

move_to_offset = function( offset ){
    var move = offset * hero_width * -1;
    wn.animate({'left' : move});
    controls.find('.current').toggleClass('current');
    controls.find('a:nth-child('+ (current_offset + 1).toString() +')').toggleClass( 'current' );
}

set_and_move_offset = function(){
    current_offset += 1;
    if ( current_offset === elements.length ) {
        current_offset = 0;
    }
    move_to_offset( current_offset );
    create_timeout();
}

move_on_click = function(){
    clearTimeout( interval );
    current_offset = $(this).text().toString() * 1 - 1;
    move_to_offset( current_offset );
    interval = setTimeout( set_and_move_offset , timeout );
    return false;
}

