From c012fec2870757990080e823d42dd91031e64f25 Mon Sep 17 00:00:00 2001 From: sanine Date: Sat, 6 Jul 2024 21:24:04 -0500 Subject: set rocket to relatively constant velocity --- index.html | 3 ++- level.js | 7 +++++-- levelSelect.js | 33 ++++++++++++++++++++++++++------- main.js | 6 +++--- style.css | 20 +++++++++++++------- 5 files changed, 49 insertions(+), 20 deletions(-) diff --git a/index.html b/index.html index 485a79e..20d07b9 100644 --- a/index.html +++ b/index.html @@ -8,10 +8,11 @@ - + +

diff --git a/level.js b/level.js index 637694f..9f6ee60 100644 --- a/level.js +++ b/level.js @@ -174,9 +174,12 @@ function stepLevel(ui, level, index) { finishLevel(ui, level, false); render(ui.ctx, level, 0); } else if (level.running && index < level.path.length-1) { - setTimeout(() => stepLevel(ui, level, index+1), 1); + const distNext = distance(pos, level.path[index+1] || pos); + setTimeout(() => stepLevel(ui, level, index+1), 50*distNext); } else { - finishLevel(ui, level, true); + if (index >= level.path.length-1) { + finishLevel(ui, level, true); + } level.running = false; render(ui.ctx, level, 0); } diff --git a/levelSelect.js b/levelSelect.js index 2fe3d52..238639c 100644 --- a/levelSelect.js +++ b/levelSelect.js @@ -1,18 +1,37 @@ import{ setupLevel, setupLevelUi } from './level.js'; + +function buildLevel(x, y, t) { + const ts = t.slice(0, -1); + const tf = t[t.length-1]; + return setupLevel(ts.map(T => [ x(T), y(T) ]), [ x(tf), y(tf) ]); +} + const levels = { 'initial jump': [ [], setupLevel([], [8, 0]) ], 'monopole harvesting': [ ['initial jump'], setupLevel([[3, 3]], [8,8]) ], - 'parabolic': [ ['initial jump', 'monopole harvesting'], setupLevel([[-2, 4], [0,0], [2, 4]], [3,9]) ], + 'parabolic 0': [ ['initial jump', 'monopole harvesting'], setupLevel([[-2, 4], [0,0], [2, 4]], [3,9]) ], 'sinusoidal': [ ['initial jump', 'monopole harvesting'], - setupLevel([ - [-4, 4*Math.sin(0)], - [0.5*Math.PI - 4, 4*Math.sin(0.5*Math.PI)], - [1.0*Math.PI - 4, 4*Math.sin(1.0*Math.PI)], - [1.5*Math.PI - 4, 4*Math.sin(1.5*Math.PI)], - ], [2.0*Math.PI - 4, 4*Math.sin(2.0*Math.PI)]), + buildLevel(t => t-4, t => 4 * Math.sin(t), [...Array(8).keys()].map(x => Math.PI * x / 4)), + ], + 'parabolic 1': [ + ['parabolic 0'], + buildLevel(t => -0.5*(t-3)**2 + 4, t => t-3, [...Array(8).keys()].map(x => x - 2)), ], + 'orbital': [ + ['parabolic 0', 'sinusoidal'], + buildLevel(t => 8*Math.cos(t), t => 8*Math.sin(t), [...Array(8).keys()].map(x => Math.PI * x / 4)), + ], + 'lissajous 0': [ + ['orbital'], + buildLevel(t => 8*Math.cos(3*t), t => 8*Math.sin(2*t), [...Array(8).keys()].map(x => Math.PI * x / 4)), + ], + 'lissajous 1': [ + ['orbital'], + buildLevel(t => 8*Math.sin(4*t), t => 8*Math.cos(3*t), [...Array(16).keys()].map(x => Math.PI * x / 8)), + ], + }; export function setupLevelSelectUi(root, sfx) { diff --git a/main.js b/main.js index 0415b29..94d5e77 100644 --- a/main.js +++ b/main.js @@ -1,8 +1,8 @@ import { setupLevelSelectUi } from './levelSelect.js'; import { setupLevel, setupLevelUi } from './level.js'; -window.onload = () => { - +window.onload = () => setTimeout(() => { + const root = document.getElementById('root'); root.classList.add('center'); @@ -79,4 +79,4 @@ window.onload = () => { setupLevelSelectUi(root, sfx); }; root.appendChild(start); -} +}, 200); diff --git a/style.css b/style.css index 41f7ffd..2b3b0fe 100644 --- a/style.css +++ b/style.css @@ -1,8 +1,7 @@ body { color: white; background-color: black; - font-family: "Jura", monospace; - font-variant-caps: small-caps; + font-family: "VT323", monospace; position: relative; overflow-x: hidden; } @@ -26,6 +25,8 @@ body { } #root { + text-transform: uppercase; + font-family: "VT323", monospace; width: min(90vw, 800px); margin: auto; border-left: 1px solid white; @@ -55,7 +56,7 @@ body { background-color: black; padding: 16px; max-width: min(80vw, 600px); - font-size: 24px; + font-size: 28px; } .bordered { @@ -66,11 +67,11 @@ h1 { font-size: 32px; } h2 { - font-size: 24px; + font-size: 28px; } p { - font-size: 16px; + font-size: 24px; padding: 1em; } @@ -80,8 +81,7 @@ p { } input { - font-family: "Jura", monospace; - font-variant-caps: small-caps; + font-family: "VT323", monospace; color: white; background-color: black; font-size: 16px; @@ -91,6 +91,7 @@ input { border: 2px solid; } input[type=button] { + text-transform: uppercase; font-size: 20px; } input[type=button]:hover { @@ -101,3 +102,8 @@ input[type=button]:active { color: black; background-color: grey; } + + +label { + text-transform: lowercase; +} -- cgit v1.2.1