aboutsummaryrefslogtreecommitdiff
path: root/src/paperflight/static
diff options
context:
space:
mode:
authorMark Powers <markppowers0@gmail.com>2020-05-13 10:53:44 -0500
committerMark Powers <markppowers0@gmail.com>2020-05-13 10:53:44 -0500
commit1855e0c673b06399ca89aa0c705d30b1a9ea3b97 (patch)
tree2c78eceab67bc2f377449a25df7f87181876070b /src/paperflight/static
parenta5706caa9cd91e357085d77c62aff7107ac76fc1 (diff)
Add sim and paperflight games
Diffstat (limited to 'src/paperflight/static')
-rw-r--r--src/paperflight/static/draw.js74
-rw-r--r--src/paperflight/static/levels.js94
-rw-r--r--src/paperflight/static/styles.css4
-rw-r--r--src/paperflight/static/update.js48
4 files changed, 220 insertions, 0 deletions
diff --git a/src/paperflight/static/draw.js b/src/paperflight/static/draw.js
new file mode 100644
index 0000000..fe0cad5
--- /dev/null
+++ b/src/paperflight/static/draw.js
@@ -0,0 +1,74 @@
+function draw() {
+ ctx.fillStyle = "#4444ff"
+ ctx.fillRect(0, 0, width, height)
+
+ drawPlane()
+ currLevel.items.forEach(item => {
+ item.draw()
+ })
+ drawExit(currLevel.exit)
+
+ ctx.fillStyle = "#222"
+ ctx.font = "20px Courier"
+ ctx.fillText(`Level ${currLevelIndex} (${collected}/${currLevel.coinsNeeded}) - Time ${Math.round(t / fps / 60)}:${Math.round(t / fps) % 60}`, 20, 20)
+
+}
+function drawPlane() {
+ ctx.fillStyle = "#fff"
+ ctx.strokeStyle = "#111"
+ ctx.lineWidth = 3
+ ctx.beginPath();
+ if (plane.dir < 0) {
+ ctx.moveTo(plane.x + plane.width, plane.y);
+ ctx.lineTo(plane.x, plane.y);
+ ctx.lineTo(plane.x + plane.width + 4, plane.y + plane.height);
+ ctx.lineTo(plane.x + plane.width, plane.y);
+ } else {
+ ctx.moveTo(plane.x, plane.y);
+ ctx.lineTo(plane.x + plane.width, plane.y);
+ ctx.lineTo(plane.x + 4, plane.y + plane.height);
+ ctx.lineTo(plane.x, plane.y);
+ }
+ ctx.stroke();
+ ctx.fill();
+}
+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 = this.y; i > 30; i -= 60) {
+ ctx.fillRect(this.x, this.y - i + yDelta, 1, 8)
+ ctx.fillRect(this.x+this.width/2-2, this.y - i + yDelta/2, 1, 12)
+ ctx.fillRect(this.x+this.width-2, this.y - i + yDelta, 1, 8)
+ }
+}
+function drawBlock() {
+ ctx.fillStyle = "#0d0"
+ ctx.fillRect(this.x, this.y, this.width, this.height)
+}
+function drawRamp() {
+ ctx.fillStyle = "#0d0"
+ var delta = this.width * this.slope
+ ctx.beginPath()
+ ctx.moveTo(this.x, this.y)
+ // Note we subtract beause y=0 is top
+ ctx.lineTo(this.x + this.width, this.y - delta)
+ ctx.lineTo(this.x + this.width, this.y + this.height - delta)
+ ctx.lineTo(this.x, this.y + this.height)
+ ctx.lineTo(this.x, this.y)
+ ctx.stroke()
+ ctx.fill()
+}
+function drawCoin() {
+ ctx.fillStyle = "yellow"
+ ctx.beginPath();
+ ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2)
+ ctx.fill()
+}
+function drawExit(exit) {
+ ctx.fillStyle = "green"
+ ctx.beginPath()
+ ctx.arc(exit.x, exit.y, 20, 0, Math.PI * 2)
+ ctx.fill()
+} \ No newline at end of file
diff --git a/src/paperflight/static/levels.js b/src/paperflight/static/levels.js
new file mode 100644
index 0000000..d826095
--- /dev/null
+++ b/src/paperflight/static/levels.js
@@ -0,0 +1,94 @@
+var levels = {
+ 1: {
+ coinsNeeded: 5,
+ exit: {
+ x: 40,
+ y: 460
+ },
+ items: [{
+ draw: drawVent,
+ update: updateVent,
+ x: 420,
+ y: 580,
+ width: 60
+ },
+ {
+ draw: drawRamp,
+ update: updateRamp,
+ x: 0,
+ y: 0,
+ slope: 0,
+ width: 800,
+ height: 40
+ },
+ {
+ draw: drawCoin,
+ update: updateCoin,
+ x: 40,
+ y: 80,
+ radius: 10
+ },
+ {
+ draw: drawVent,
+ update: updateVent,
+ x: 120,
+ y: 100,
+ width: 280
+ },
+ {
+ draw: drawBlock,
+ update: updateBlock,
+ x: 580,
+ y: 200,
+ width: 10,
+ height: 250
+ },
+ {
+ draw: drawCoin,
+ update: updateCoin,
+ x: 700,
+ y: 240,
+ radius: 10
+ },
+ {
+ draw: drawCoin,
+ update: updateCoin,
+ x: 700,
+ y: 320,
+ radius: 10
+ },
+ {
+ draw: drawCoin,
+ update: updateCoin,
+ x: 700,
+ y: 400,
+ radius: 10
+ },
+ {
+ draw: drawRamp,
+ update: updateRamp,
+ x: 70,
+ y: 410,
+ slope: 2/5,
+ width: 200,
+ height: 10
+ },
+ {
+ draw: drawRamp,
+ update: updateRamp,
+ x: 70,
+ y: 470,
+ slope: 2/5,
+ width: 200,
+ height: 10
+ },
+ {
+ draw: drawCoin,
+ update: updateCoin,
+ x: 170,
+ y: 405,
+ radius: 10
+ },
+ ]
+ }
+} \ No newline at end of file
diff --git a/src/paperflight/static/styles.css b/src/paperflight/static/styles.css
new file mode 100644
index 0000000..febe7a0
--- /dev/null
+++ b/src/paperflight/static/styles.css
@@ -0,0 +1,4 @@
+button {
+ background-color: lavender;
+ padding: 10px 20px;
+} \ No newline at end of file
diff --git a/src/paperflight/static/update.js b/src/paperflight/static/update.js
new file mode 100644
index 0000000..296308f
--- /dev/null
+++ b/src/paperflight/static/update.js
@@ -0,0 +1,48 @@
+function update() {
+ t++
+ score++
+ if(startLevel){
+ plane.x += plane.vx * plane.dir
+ plane.y += plane.vy
+ }
+ if (plane.x < 0 || plane.x > width - plane.width || plane.y < 0 || plane.y + plane.height > height) {
+ gameOver()
+ }
+ currLevel.items.forEach(item => {
+ item.update()
+ })
+ currLevel.items = currLevel.items.filter(item => !item.collected )
+ if (atExit()) {
+ console.log("exit!")
+ }
+}
+function updateVent() {
+ if (plane.x >= this.x - plane.width && plane.x <= this.x + this.width && plane.y < this.y) {
+ plane.y -= 2
+ }
+}
+function updateBlock() {
+ if (plane.x >= this.x - plane.width && plane.x <= this.x + this.width
+ && plane.y >= this.y - plane.height && plane.y <= this.y + this.height) {
+ gameOver()
+ }
+}
+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 updateRamp() {
+ if (isPointInRamp(plane.x, plane.y, this) ||
+ isPointInRamp(plane.x + plane.width, plane.y, this) ||
+ isPointInRamp(plane.x + plane.width, plane.y + plane.height, this) ||
+ isPointInRamp(plane.x, plane.y + plane.height, this)) {
+ gameOver()
+ }
+}
+function updateCoin(){
+ if( Math.sqrt(Math.pow(plane.x - this.x, 2) + Math.pow(plane.y - this.y, 2)) < this.radius
+ || Math.sqrt(Math.pow(plane.x + plane.width - this.x, 2) + Math.pow(plane.y - this.y, 2)) < this.radius){
+ this.collected = true
+ collected++
+ }
+} \ No newline at end of file