benkyd/Examples
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pong

Browse Source
This commit is contained in:
Ben
2018-06-17 18:10:22 +00:00
parent d70d1379e3
commit 1eb0212574
3 changed files with 69 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
NodeJS/Pong/css/style.css Normal file
View File

@@ -0,0 +1,14 @@
body {
background-color: black;
}
canvas {
padding: 0;
margin: auto;
display: block;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}

41
NodeJS/Pong/game.js Normal file
View File

@@ -0,0 +1,41 @@
let c = document.getElementById("canv");
let ctx = c.getContext("2d");
let playerP = {
width: 30,
height: 60,
x: 30 / 2,
y: ctx.canvas.height / 2
}
window.addEventListener("keydown", onKeyDown, false);
function onKeyDown(event) {
switch (event.key) {
case 'W':
case 'w':
playerP.y++;
break;
case 'S':
case 's':
playerP.x--;
break;
}
}
function gameLoop() {
draw();
}
function draw() {
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
ctx.fillStyle="#FFFFFF";
ctx.fillRect(0, 0, 400, 400);
ctx.fillStyle="#FF00FF";
ctx.fillRect(playerP.x, playerP.y, playerP.w, playerP.h);
}
setInterval(gameLoop, 10);

14
NodeJS/Pong/index.html Normal file
View File

@@ -0,0 +1,14 @@
<!DOCTYPE <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Pong!</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />
</head>
<body>
<canvas id="canv" width="400" height="400" onkeypress="onKeyPressed(event)"></canvas>
<script src="game.js"></script>
</body>
</html>