Canvas Game Essentials - HTML5 Canvas - page 398

x = x+movingX;
y = y+movingY;
// draw background and text
context.fillStyle = '#000000';
context.fillRect(0, 0, 200, 200);
context.fillStyle = '#ffffff';
context.font = '20px _sans';
context.textBaseline = 'top';
context.fillText ("Player Ship - key turn", 0, 180);
//transformation
var angleInRadians = rotation * Math.PI / 180;
context.save(); //save current state in stack
context.setTransform(1,0,0,1,0,0); // reset to identity
//translate the canvas origin to the center of the player
context.translate(x+.5*width,y+.5*height);
context.rotate(angleInRadians);
//drawShip
context.strokeStyle = '#ffffff';
context.beginPath();
//hardcoding in locations
//facing right
context.moveTo(-10,-10);
context.lineTo(10,0);
context.moveTo(10,1);
context.lineTo(-10,10);
context.lineTo(1,1);
context.moveTo(1,-1);
context.lineTo(-10,-10);
context.stroke();
context.closePath();
//restore context
context.restore(); //pop old state on to screen
}
const FRAME_RATE = 40;
var intervalTime = 1000/FRAME_RATE;
setInterval(drawScreen, intervalTime );
document.onkeydown = function(e){
e = e?e:window.event;
//ConsoleLog.log(e.keyCode + "down");
keyPressList[e.keyCode] = true;
}
document.onkeyup = function(e){
//document.body.onkeyup = function(e){
e = e?e:window.event;