diff --git a/js13kgames.zip b/js13kgames.zip index 8a09401..61ad2dc 100644 Binary files a/js13kgames.zip and b/js13kgames.zip differ diff --git a/src/js/app.js b/src/js/app.js index 52c39ba..11fc06a 100644 --- a/src/js/app.js +++ b/src/js/app.js @@ -1,5 +1,6 @@ import { testCollision } from './collisions.js' import { drawShape } from './draw.js' +import { Vec2 } from './vector.js' import { makeAstronaut, makeBoundary } from './world.js' /** @typedef {import('./shape').Shape} Shape */ @@ -13,6 +14,8 @@ const boundaries = [] let canvas /** @type {CanvasRenderingContext2D} */ let context +/** @type {number} */ +let gravity /** * Entry point into the game. @@ -26,6 +29,14 @@ export function app () { return } + const input = document.getElementById('gravity') + if (!input) { + console.error('Could not start game!') + return + } + + input.addEventListener('change', updateGravity) + canvas = /** @type {HTMLCanvasElement} */(game) const ctx = canvas.getContext('2d') @@ -35,6 +46,31 @@ export function app () { } context = ctx + gravity = parseFloat(/** @type {HTMLInputElement} */(input).value) + createObjectsInWorld() + tick() +} + +/* TODO: Add some paint-FPS to UI */ +// See https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame#notes +function tick () { + context.clearRect(0, 0, canvas.width, canvas.height) + boundaries.forEach(function (boundary) { + drawShape(context, boundary) + }) + + drawShape(context, astronaut, Vec2(0, gravity)) + + boundaries.forEach(function (boundary) { + if (testCollision(boundary, astronaut)) { + throw new Error('Game Over!') + } + }) + + window.requestAnimationFrame(tick) +} + +function createObjectsInWorld () { astronaut = makeAstronaut() const boundaryHeight = 2 @@ -55,25 +91,18 @@ export function app () { width: canvas.width }) ) - - tick() } -/* TODO: Add some paint-FPS to UI */ -// See https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame#notes -function tick () { - context.clearRect(0, 0, canvas.width, canvas.height) - boundaries.forEach(function (boundary) { - drawShape(context, boundary) - }) - - drawShape(context, astronaut) - - boundaries.forEach(function (boundary) { - if (testCollision(boundary, astronaut)) { - throw new Error('Game Over!') - } - }) +/** + * Updates the applied gravity. + * + * @param {Event} event + */ +function updateGravity (event) { + if (!event.target) { + return + } - window.requestAnimationFrame(tick) + const input = /** @type {HTMLInputElement} */(event.target) + gravity = parseFloat(input.value) }