From ae74d0d38196c14ea79cef2444f508c649c57580 Mon Sep 17 00:00:00 2001 From: Mark Powers Date: Thu, 14 May 2020 10:21:26 -0500 Subject: Refactor some functions into util.js, add better vent wind --- src/paperflight/index.html | 1 + src/paperflight/server.js | 1 + src/paperflight/static/draw.js | 38 +++++++++++++++++++++++++++++--------- src/paperflight/static/items.js | 18 ++++++++++++------ src/paperflight/static/levels.js | 33 ++++++++++++++++++--------------- src/paperflight/static/update.js | 16 +++------------- src/paperflight/static/util.js | 16 ++++++++++++++++ 7 files changed, 80 insertions(+), 43 deletions(-) create mode 100644 src/paperflight/static/util.js diff --git a/src/paperflight/index.html b/src/paperflight/index.html index dc60794..26540b4 100644 --- a/src/paperflight/index.html +++ b/src/paperflight/index.html @@ -16,6 +16,7 @@ var height = 600 var fps = 60 + diff --git a/src/paperflight/server.js b/src/paperflight/server.js index 35a2669..ee63ff8 100644 --- a/src/paperflight/server.js +++ b/src/paperflight/server.js @@ -5,6 +5,7 @@ function setUpRoutes(server, models, jwtFunctions, database) { server.get('/paperflight/update.js', (req, res) => res.sendFile(__dirname + "/static/update.js")) server.get('/paperflight/draw.js', (req, res) => res.sendFile(__dirname + "/static/draw.js")) server.get('/paperflight/items.js', (req, res) => res.sendFile(__dirname + "/static/items.js")) + server.get('/paperflight/util.js', (req, res) => res.sendFile(__dirname + "/static/util.js")) } module.exports = { diff --git a/src/paperflight/static/draw.js b/src/paperflight/static/draw.js index c82974a..0c940b6 100644 --- a/src/paperflight/static/draw.js +++ b/src/paperflight/static/draw.js @@ -1,3 +1,6 @@ +/** + * Draw functions + */ function draw() { ctx.fillStyle = "#4444ff" ctx.fillRect(0, 0, width, height) @@ -6,7 +9,7 @@ function draw() { item.draw() }) drawExit(currLevel.exit) - + drawPlane() ctx.fillStyle = "#222" @@ -36,13 +39,30 @@ function drawPlane() { function drawVent() { ctx.fillStyle = "#ccc" ctx.fillRect(this.x, this.y, this.width, 10) - ctx.fillStyle = "white" - var yDelta = Math.sin(t / 30) * 40 - for (var i = 40; i < this.height; i+= 60) { - for (var j = 0; j < this.width; j+= 30) { - ctx.fillRect(this.x+j, this.y - i + yDelta, 1, 8) + // every 1/3 seconds spawn new air vents + // (since this is purely cosmetic, updates to it are in here) + if (t % Math.floor(fps / 3) == 0) { + for (var j = 0; j <= this.width; j += 20) { + this.wind.push({ + x: this.x + j, + y: this.y - 10, + height: Math.floor(Math.random() * 15) + 4 + }) } } + // Move up each wind a bit randomly + this.wind.forEach(w => { + w.y -= Math.random() * 4 + 2 + }) + // Remove all wind higher than certain height + this.wind = this.wind.filter(w => { + return this.y - w.y < this.height + }, this) + // Finally draw each wind + ctx.fillStyle = "white" + this.wind.forEach(w => { + ctx.fillRect(w.x, w.y, 1, w.height) + }) } function drawBlock() { ctx.fillStyle = "#0d0" @@ -73,12 +93,12 @@ function drawExit(exit) { ctx.arc(exit.x, exit.y, 20, 0, Math.PI * 2) ctx.fill() } -function drawSwitch(){ +function drawSwitch() { ctx.fillStyle = "black" ctx.fillRect(this.x, this.y, this.width, this.height) } -function drawSwitchRect(){ - if(switchState == this.state){ +function drawSwitchRect() { + if (switchState == this.state) { ctx.fillStyle = "blue" ctx.fillRect(this.x, this.y, this.width, this.height) } else { diff --git a/src/paperflight/static/items.js b/src/paperflight/static/items.js index 11c2047..16ea754 100644 --- a/src/paperflight/static/items.js +++ b/src/paperflight/static/items.js @@ -1,39 +1,45 @@ -function vent(x, y, width, height){ +/** + * Contains functions to create each type of object that can + * appear in a level. + */ + +function constructVent(x, y, width, height){ return { draw: drawVent, update: updateVent, + wind: [], x, y, width, height } } -function coin(x, y, radius=10){ +function constructCoin(x, y, radius=10){ return { draw: drawCoin, update: updateCoin, x, y, radius } } -function block(x, y, width, height){ +function constructBlock(x, y, width, height){ return { draw: drawBlock, update: updateBlock, x, y, width, height } } -function ramp(x, y, width, height, slope){ +function constructRamp(x, y, width, height, slope){ return { draw: drawRamp, update: updateRamp, x, y, width, height, slope } } -function getSwitch(x, y, width, height, stateCount){ +function constructSwitch(x, y, width, height, stateCount){ return { draw: drawSwitch, update: updateSwitch, x, y, width, height, stateCount } } -function switchRect(x, y, width, height, state){ +function constructRect(x, y, width, height, state){ return{ draw: drawSwitchRect, update: updateSwitchRect, diff --git a/src/paperflight/static/levels.js b/src/paperflight/static/levels.js index 33d011c..7555afb 100644 --- a/src/paperflight/static/levels.js +++ b/src/paperflight/static/levels.js @@ -1,3 +1,6 @@ +/** + * Creates the levels object for the game + */ var levels = { 2: { coinsNeeded: 0, @@ -7,10 +10,10 @@ var levels = { }, title: "Switch madness", items: [ - getSwitch(120, 400, 60, 60, 3), - switchRect(300, 400, 60, 60, 0), - switchRect(400, 400, 60, 60, 1), - switchRect(500, 400, 60, 60, 2), + constructSwitch(120, 400, 60, 60, 3), + constructRect(300, 400, 60, 60, 0), + constructRect(400, 400, 60, 60, 1), + constructRect(500, 400, 60, 60, 2), ] }, 1: { @@ -21,17 +24,17 @@ var levels = { }, title: "Downwards Dash", items: [ - vent(420, 580, 60, 600), - coin(40, 80), - vent(120, 100, 280, 100), - block(580, 200, 10, 250), - coin(700, 240), - coin(700, 320), - coin(700, 400), - ramp(70, 410, 200, 10, 2/5), - ramp(70, 470, 200, 10, 2/5), - coin(170, 405), - block(0, 0, 800, 40) + constructVent(420, 580, 60, 300), + constructCoin(40, 80), + constructVent(120, 100, 280, 100), + constructBlock(580, 200, 10, 250), + constructCoin(700, 240), + constructCoin(700, 320), + constructCoin(700, 400), + constructRamp(70, 410, 200, 10, 2/5), + constructRamp(70, 470, 200, 10, 2/5), + constructCoin(170, 405), + constructBlock(0, 0, 800, 40) ] } } \ No newline at end of file diff --git a/src/paperflight/static/update.js b/src/paperflight/static/update.js index b953914..3a61647 100644 --- a/src/paperflight/static/update.js +++ b/src/paperflight/static/update.js @@ -1,16 +1,6 @@ -function isPointInRamp(x, y, ramp) { - var yDelta = (x - ramp.x) * ramp.slope - return ramp.x < x && x < ramp.x + ramp.width && ramp.y < y + yDelta && y + yDelta < ramp.y + ramp.height -} -function isPointInBox(x, y, box) { - return box.x <= x && x <= box.x + box.width && box.y <= y && y <= box.y + box.height -} -function isPlaneInBox(box) { - return isPointInBox(plane.x, plane.y, box) - || isPointInBox(plane.x + plane.width, plane.y, box) - || isPointInBox(plane.x + plane.width, plane.y + plane.height, box) - || isPointInBox(plane.x, plane.y + plane.height, box) -} +/** + * Update functions + */ function update() { t++ score++ diff --git a/src/paperflight/static/util.js b/src/paperflight/static/util.js new file mode 100644 index 0000000..f818809 --- /dev/null +++ b/src/paperflight/static/util.js @@ -0,0 +1,16 @@ +/** + * General purpose functions + */ +function isPointInRamp(x, y, ramp) { + var yDelta = (x - ramp.x) * ramp.slope + return ramp.x < x && x < ramp.x + ramp.width && ramp.y < y + yDelta && y + yDelta < ramp.y + ramp.height +} +function isPointInBox(x, y, box) { + return box.x <= x && x <= box.x + box.width && box.y <= y && y <= box.y + box.height +} +function isPlaneInBox(box) { + return isPointInBox(plane.x, plane.y, box) + || isPointInBox(plane.x + plane.width, plane.y, box) + || isPointInBox(plane.x + plane.width, plane.y + plane.height, box) + || isPointInBox(plane.x, plane.y + plane.height, box) +} \ No newline at end of file -- cgit v1.2.3