diff options
author | Mark Powers <markppowers0@gmail.com> | 2020-04-07 14:17:24 -0500 |
---|---|---|
committer | Mark Powers <markppowers0@gmail.com> | 2020-04-07 14:17:24 -0500 |
commit | 1bffb064e2414ced5b1924a4f9fbd822a09c718e (patch) | |
tree | f0e4a0a8d9a6f4f58619329bf408fe9bf7d1dd4c /src/pinball |
Initial commit
Diffstat (limited to 'src/pinball')
-rw-r--r-- | src/pinball/index.html | 120 | ||||
-rw-r--r-- | src/pinball/server.js | 11 |
2 files changed, 131 insertions, 0 deletions
diff --git a/src/pinball/index.html b/src/pinball/index.html new file mode 100644 index 0000000..b39d48e --- /dev/null +++ b/src/pinball/index.html @@ -0,0 +1,120 @@ +<center> + <canvas id="canvas"></canvas> +</center> +<script> + var WIDTH = 300 + var HEIGHT = 400 + window.onload = function(){ + canvas = document.getElementById("canvas"); + ctx = canvas.getContext("2d"); + canvas.width = WIDTH; + canvas.height = HEIGHT; + document.addEventListener("keydown",keyDown); + document.addEventListener("keyup",keyUp); + setInterval(game, 1000/10); + } + var tileCountWidth = 30; + var tileCountHeight = 40; + var tileWidth = WIDTH/tileCountWidth; + var tileHeight = HEIGHT/tileCountHeight; + var ballX = WIDTH/2; + var ballY = 10; + var leftUp = false; + var rightUp = false; + var vx = randomInt(20)-10; + var vy = 0; + var ay = 2; + var ymax = 20; + var length = 5; + var paddleWidth = 11; + function game(){ + update() + + color("black"); + // BACKGROUND + ctx.fillRect(0,0,WIDTH, HEIGHT); + // SIDES + color("blue"); + ctx.fillRect(0,0,tileWidth, HEIGHT); +// console.log(WIDTH, tileWidth, tileCountWidth) + ctx.fillRect(WIDTH-tileWidth, 0, tileWidth, HEIGHT); + ctx.beginPath(); + // DRAW BALL + color("white"); + ctx.fillRect(ballX, ballY, tileWidth, tileHeight); + // DRAW PADDLES + color("red"); + ctx.lineWidth=10; + + ctx.moveTo(1*tileWidth, 33*tileHeight); + if(leftUp){ + ctx.lineTo((1+paddleWidth)*tileWidth, 33*tileHeight); + } else { + ctx.lineTo((1+paddleWidth)*tileWidth, 35*tileHeight); + } + ctx.stroke(); + var t = tileCountWidth - 1 + ctx.moveTo(t*tileWidth, 33*tileHeight); + if(rightUp){ + ctx.lineTo((t-paddleWidth)*tileWidth, 33*tileHeight); + } else { + ctx.lineTo((t-paddleWidth)*tileWidth, 35*tileHeight); + } + ctx.stroke(); + } + function update(){ + + if(((leftUp && ballX/tileWidth <=8) || (rightUp && ballX/tileWidth >=13)) + && ballY/tileHeight <= 35 && ballY/tileHeight >= 32){ + console.log("Hit!") + vy=-20 + } + vy += ay + vy = Math.min(vy, ymax) + ballY += vy + ballX += vx + if(ballX <= tileWidth){ + ballX = tileWidth + vx = -vx + } + if(ballX >= WIDTH-(2*tileWidth)){ + ballX = WIDTH-(2*tileWidth) + vx = -vx + } + + } + function keyUp(e){ + switch(e.keyCode){ + case 37: + leftUp = false; + break; + case 39: + rightUp = false; + break; + } + } + function keyDown(e){ + switch(e.keyCode){ + case 37: + leftUp = true; + break; + case 39: + rightUp = true; + break; + } + } + function setRandomCoords(item){ + item.x = randomInt(tileWidth); + item.y = randomInt(tileHeight); + } + function randomInt(max){ + return Math.floor(Math.random()*max); + } + function font(size){ + ctx.font=size+"px Courier"; + } + function color(c){ + ctx.strokeStyle=c; + ctx.fillStyle=c; + } +</script> diff --git a/src/pinball/server.js b/src/pinball/server.js new file mode 100644 index 0000000..2bf88d5 --- /dev/null +++ b/src/pinball/server.js @@ -0,0 +1,11 @@ +const path = require('path'); +const fs = require('fs'); + +function setUpRoutes(server, models, jwtFunctions, database) { + server.get('/pinball', (req, res) => res.sendFile(__dirname + "/index.html")) + server.get('/pinball/styles.css', (req, res) => res.sendFile(__dirname + "/static/styles.css")) +} + +module.exports = { + setUpRoutes +}; |