// MOVEMENT ANIMATION
function moveSprite(name, size){
    var pane = $('#sea'),
    box = $(name),
    col = $('#col'),
    w = pane.width() - box.width() + size,
    d = {},
    x = 7;

    function newv(v,a,b) {
        var n = parseInt(v, 10) - (d[a] ? x : 0) + (d[b] ? x : 0);
        return n < 0 ? 0 : n > w ? w : n;
    }

    $(window).keydown(function(e) { d[e.which] = true; });
    $(window).keyup(function(e) { d[e.which] = false; });

    setInterval(function() {
        box.css({
            left: function(i,v) { return newv(v, 37, 39); },   // ARROWs L/R
            top: function(i,v) { return newv(v, 38, 40); }     // ARROWs U/D
        });
    }, 20);

    setInterval(function() {
        box.css({
            left: function(i,v) { return newv(v, 65, 68); },   // KEYS A/D
            top: function(i,v) { return newv(v, 87, 83); }     // KEYS w/S
        });
    }, 20);
}

// KEYS BINDING

function keyBinding_1(){

    // FLIP ON KEY L/R - A/D
    function flipl(name){ $(name).css('transform', 'scale(0.3, 0.3)'); }
    function flipr(name){ $(name).css('transform', 'scale(-0.3, 0.3)'); }

    // SCROLL WINDOW ON KEY D
    function scrollWin() { window.scrollBy(10, 0); }

    $(document).keydown(
      function(e){  
        if (e.keyCode == 37) {   // ARROW LEFT
        	e.preventDefault();
        	flipl('.boat');
        }
        if (e.keyCode == 39) {   // ARROW RIGHT 
        	// e.preventDefault();
        	// scrollWin();
        	flipr('.boat');
        }
         
        if (e.keyCode == 40) {   // ARROW DOWN
        	e.preventDefault();
        }
        if (e.keyCode == 65) {   // A LEFT
            e.preventDefault();
            flipl('.boat');
        }
        if (e.keyCode == 68) {   // D RIGHT
            scrollWin();
            flipr('.boat');
        }
        if (e.keyCode == 83) {   // S DOWN
        	e.preventDefault();
        }
    });
}

function keyBinding_2(){

    function flipl(){ $('.sprite').css('transform', 'scale(-0.5, 0.5)'); }
    function flipr(){ $('.sprite').css('transform', 'scale(0.5, 0.5)'); }

    $(document).keydown(
        function(e){  
            if (e.keyCode == 37) {   // ARROW LEFT
                e.preventDefault();
                flipl();
            }
            if (e.keyCode == 39) {   // ARROW RIGHT
                e.preventDefault();
                flipr();
            }
            if (e.keyCode == 38) {   // ARROW UP
                e.preventDefault();
            }
            if (e.keyCode == 40) {   // ARROW DOWN
                e.preventDefault();
            }
            if (e.keyCode == 65) {   // A LEFT
                e.preventDefault();
                flipl();
            }               
            if (e.keyCode == 68) {   // D RIGHT
                e.preventDefault();
                flipr();
            }
            if (e.keyCode == 87) {   // W UP
                e.preventDefault();
            }
            if (e.keyCode == 83) {   // S DOWN
                e.preventDefault();
            }
    });

    $(document).ready(function(){
        $(document).keydown(function(){ $(".sprite").addClass("walk-right"); });
        $(document).keyup(function(){ $(".sprite").removeClass("walk-right"); });
    });
}

function keyBinding_4(){

    function flipl(){ $('.sprite').css('transform', 'scale(-0.6, 0.6)'); }
    function flipr(){ $('.sprite').css('transform', 'scale(0.6, 0.6)'); }

    $(document).keydown(
        function(e){  
            if (e.keyCode == 37) {   // ARROW LEFT
                e.preventDefault();
                flipl();
            }
            if (e.keyCode == 39) {   // ARROW RIGHT
                e.preventDefault();
                flipr();
            }
            if (e.keyCode == 38) {   // ARROW UP
                e.preventDefault();
            }
            if (e.keyCode == 40) {   // ARROW DOWN
                e.preventDefault();
            }
            if (e.keyCode == 65) {   // A LEFT
                e.preventDefault();
                flipl();
            }               
            if (e.keyCode == 68) {   // D RIGHT
                e.preventDefault();
                flipr();
            }
            if (e.keyCode == 87) {   // W UP
                e.preventDefault();
            }
            if (e.keyCode == 83) {   // S DOWN
                e.preventDefault();
            }
    });

    $(document).ready(function(){
        $(document).keydown(function(){ $(".sprite").addClass("walk-right"); });
        $(document).keyup(function(){ $(".sprite").removeClass("walk-right"); });
    });
}



function keyBinding_3(){

    function flipl(){ $('.sprite-d').css('transform', 'scale(-0.5, 0.5)'); }
    function flipr(){ $('.sprite-d').css('transform', 'scale(0.5, 0.5)'); }

    $(document).keydown(
        function(e){  
            if (e.keyCode == 37) {   // ARROW LEFT
                e.preventDefault();
                flipl();
            }
            if (e.keyCode == 39) {   // ARROW RIGHT
                e.preventDefault();
                flipr();
            }
            if (e.keyCode == 38) {   // ARROW UP
                e.preventDefault();
            }
            if (e.keyCode == 40) {   // ARROW DOWN
                e.preventDefault();
            }
            if (e.keyCode == 65) {   // A LEFT
                e.preventDefault();
                flipl();
            }               
            if (e.keyCode == 68) {   // D RIGHT
                e.preventDefault();
                flipr();
            }
            if (e.keyCode == 87) {   // W UP
                e.preventDefault();
            }
            if (e.keyCode == 83) {   // S DOWN
                e.preventDefault();
            }
    });

    $(document).ready(function(){
        $(document).keydown(function(){ $(".sprite-d").addClass("walk-right-d"); });
        $(document).keyup(function(){ $(".sprite-d").removeClass("walk-right-d"); });
    });
}