Can't seem to change image position with key event

I'm slowly learning some basic HTML 5 and Javascript. I wrote a Javascript file that's suppose to have an image displayed and then have the image's position changed by pressing right. The image loads, but it doesn't it doesn't change position when I press right. What am I doing wrong?

var canvas = document.createElement("canvas");
canvas.width = 800;
canvas.height = 600;
canvas.style  = "border:2px solid blue";
canvas.addEventListener('keydown', doKeyDown, true);
var ctx = canvas.getContext("2d");
document.body.appendChild( canvas );

var guy1Image = new Image();
guy1Image.onload = function () {
   ctx.drawImage( guy1Image, x, y );
};
guy1Image.src = "img/1.png";
var x = 0;
var y = 0;

function doKeyDown( e ) {
  if ( e.keyCode == 39 ) {
 x = 128;
     y = 128;
  }
}