diff options
Diffstat (limited to 'src/paperflight/static/draw.js')
-rw-r--r-- | src/paperflight/static/draw.js | 74 |
1 files changed, 74 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 |