I am trying to make it so i have one sprite moving up and down while one i can move with the left and right arrow...but as soon as i animate the one up and down, the other one becomes unresponsive...here is my code

Code:
	
    // Constants
    var Right_Arrow = 39;
    var Left_Arrow = 37;
    var Up_Arrow = 38;
    var Down_Arrow = 40;
	 
    //Stage
    var stageWidth = 600;
    var stageHeight = 450;
    var stage = new Kinetic.Stage(
        {
            container: 'container',
            width: stageWidth,
            height: stageHeight,
		
        }
    );
	  
    //Mario
    var marioImg = new Image();
    marioImg.src =  'spongebobwalk.png';
	  
    var marioSteps = 
    {
        step1: 
            [
                {
                    x: 1,
                    y: 1,
                    width: 63,
                    height: 90 //Why KineticJs need Actual Image Height - 1? Not Sure!!
                }
            ],
        step2: 
            [
                {
                    x: 78,
                    y: 1,
                    width: 63,
                    height: 90
                }
            ],		
        step3: 
            [
                {
                    x: 152,
                    y: 1,
                    width: 64,
                    height: 90
                }
            ],
        step4: 
            [
                {
                    x: 226,
                    y: 1,
                    width: 69,
                    height: 90
                }
            ]
    };
    var spongebobSprite = new Kinetic.Sprite
    (
        {
            x:200,
            y:350,
            image: marioImg,
            animation: 'step1',
            animations: marioSteps,
            framerate: 7
        }
    );

    marioImg.onload = function()
    {
        stage.draw();
    }
    var layer = new Kinetic.Layer();
    layer.add(spongebobSprite);
    stage.add(layer);
    spongebobSprite.start();
    spongebobSprite.stop();
    var stepCounter = 1;
    $(document).ready
    (
        function() 
        {
            $(document).keydown
            (
                function(e) 
                {
                    switch(e.keyCode) 
                    { 
                        case Up_Arrow:
			                break;
                        case Down_Arrow:
                            break;
                        case Right_Arrow:
                            moveSpongebobR();
                            break;
                        case Left_Arrow:
                            moveSpongebobL();						
                            break;
                    }
                }
            );
        }
    );
		
    function moveSpongebobR()
    {
        console.log("RIGHT");
        spongebobSprite.setX(spongebobSprite.getX()+10);
        if(stepCounter > 4)
        {
            stepCounter = 1;
        }
        var animString = 'step'+stepCounter++;
        spongebobSprite.setAnimation(animString);
        spongebobSprite.start();
        spongebobSprite.stop();
    }
		
    function moveSpongebobL()
    {
        console.log("left");
        spongebobSprite.setX(spongebobSprite.getX()-10);
        if(stepCounter > 4)
        {
            stepCounter = 1;
        }
        var animString = 'step'+stepCounter++;
        spongebobSprite.setAnimation(animString);
        spongebobSprite.start();
        spongebobSprite.stop();
    }

    // Start Patrick -----	

    var patrick = new Kinetic.Layer();	

    var imageObj2 = new Image();
    imageObj2.onload = function() 
    {
        var pat = new Kinetic.Image
        (
            {
                x: 75,
                y: -225,
                image: imageObj2,
                width: 75,
                height: 75
            }
        );
	  
        patrick.add(pat);
        // add spongebob to the stage
        stage.add(patrick);
    };
    imageObj2.src = 'images/patrick.png';	  	  
    stage.add(patrick);	  

    var amplitude = 75;
    var period = 500;
    // in ms
    var centerY = stage.getWidth() / 2;

    var anim = new Kinetic.Animation
    (
        function(frame) 
            {
                patrick.setY(amplitude * Math.sin(frame.time * 2 * Math.PI / period) + centerY);
            }, 
        patrick
    );

    anim.start();