Keybourd inputs?

Im wrote a code to try and make an image drawn on a canvas move when a button is pressed, but its no working, can someone tell me where i went wrong in the code? (:

const FPS = 30;
var x = 0;
var y = 0;
var image = new Image();
image.src = “jsplatformer1-smiley.jpg”;
var canvas = null;
var context2D = null;
var left = false
var up = false
var right = false
var down = false
window.onload = init;

function init()
{
canvas = document.getElementById(‘canvas’);
context2D = canvas.getContext(‘2d’);
setInterval(draw, 1000 / FPS);

}

function draw(event)
{
context2D.clearRect(0, 0, canvas.width, canvas.height);
context2D.drawImage(image, x, y);

     if (event.keyCode == 39) {
     x += 1;
     }

}

The event object isn’t getting passed to your function. You need to listen for the keydown event, rather than just run the draw function every x milliseconds:


function init() {
    canvas = document.getElementById('canvas');
    context2D = canvas.getContext('2d');
    document.addEventListener('keydown', draw, false);
}

function draw(event) {
    context2D.clearRect(0, 0, canvas.width, canvas.height);
    context2D.drawImage(image, x, y);
    if (event.keyCode == 39) {
        x += 1;
    }
}