var topbarWidth;
var wayRight = 0;
var wayLeft = 0;

$(document).ready(function() {
       topbarWidth = $('#top-of-page-bar').width()+8;
        walkRight();
});

function walkRight() {
        setTimeout('animateLeftRight()',0); // Call to make the figure animate walking
        $('#steps #step-01').animate({ 
//            left:'+='+topbarWidth+'px'
            left:'942px'
            }, 20000, 
            function() {
                $('#steps #step-01').css('visibility', 'hidden');
                $('#steps #step-02').css('visibility', 'visible');
                fallDown(); 
            }); // Move figure left to right, when finished call fallDown
}

function animateLeftRight() {
        if (wayRight == 0) {
          $('#steps #step-01 .stickman-left-to-right').css( 'background-position', '-15px 0' );
          wayRight = 1;
        } else {
          $('#steps #step-01 .stickman-left-to-right').css( 'background-position', '0 0' );
          wayRight = 0;
        }
        setTimeout('animateLeftRight()',300);
}

function fallDown() {
        $('#steps #step-02').animate({
            top:'550px'
            }, 5000, 
            function() {
                $('#steps #step-02').css('visibility', 'hidden');
                $('#steps #step-03').css('visibility', 'visible');
                walkLeft(); 
            }); // Let figure fall down, when finished call walkLeft
}

function walkLeft() {
        setTimeout('animateRightLeft()',0); // Call to make the figure animate walking
        $('#steps #step-03').animate({ 
            left:'36px'
            }, 20000, 
            function() {
                $('#steps #step-03').css('visibility', 'hidden');
                $('#steps #step-05').css('visibility', 'visible');
                $('#steps #step-04').css('visibility', 'hidden');
//                sitDown(); 
            }); // Move figure right to left
}

function animateRightLeft() {
        if (wayLeft == 0) {
          $('#steps #step-03 .stickman-right-to-left').css( 'background-position', '-15px 0' );
          wayLeft = 1;
        } else {
          $('#steps #step-03 .stickman-right-to-left').css( 'background-position', '0 0' );
          wayLeft = 0;
        }
        setTimeout('animateRightLeft()',300);
}

function sitDown() {
/*        $('#steps #step-02').animate({top:'550px'}, 5000, 
            function() {
                $('#steps #step-02').css('visibility', 'hidden');
                walkLeft(); 
            }); // Sit figure down in chair */
}