From 1eb021257482f6742903ecc437cd78eba979bf9e Mon Sep 17 00:00:00 2001 From: Ben Date: Sun, 17 Jun 2018 18:10:22 +0000 Subject: [PATCH] pong --- NodeJS/Pong/css/style.css | 14 +++++++++++++ NodeJS/Pong/game.js | 41 +++++++++++++++++++++++++++++++++++++++ NodeJS/Pong/index.html | 14 +++++++++++++ 3 files changed, 69 insertions(+) create mode 100644 NodeJS/Pong/css/style.css create mode 100644 NodeJS/Pong/game.js create mode 100644 NodeJS/Pong/index.html diff --git a/NodeJS/Pong/css/style.css b/NodeJS/Pong/css/style.css new file mode 100644 index 0000000..f81696a --- /dev/null +++ b/NodeJS/Pong/css/style.css @@ -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; +} \ No newline at end of file diff --git a/NodeJS/Pong/game.js b/NodeJS/Pong/game.js new file mode 100644 index 0000000..4d3d39a --- /dev/null +++ b/NodeJS/Pong/game.js @@ -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); diff --git a/NodeJS/Pong/index.html b/NodeJS/Pong/index.html new file mode 100644 index 0000000..3186bb5 --- /dev/null +++ b/NodeJS/Pong/index.html @@ -0,0 +1,14 @@ + + + + + + Pong! + + + + + + + + \ No newline at end of file