summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--index.html3
-rw-r--r--level.js46
-rw-r--r--levelSelect.js20
-rw-r--r--main.js10
-rw-r--r--render.js10
-rw-r--r--style.css4
6 files changed, 67 insertions, 26 deletions
diff --git a/index.html b/index.html
index fba6177..485a79e 100644
--- a/index.html
+++ b/index.html
@@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
- <title>robotic</title>
+ <title>Hyperspace Navigator</title>
<script type="module" src="main.js"></script>
<script src="mathjs/mathjs-expression-parser.js"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
@@ -23,6 +23,7 @@
<audio id="sfx-buttonenter" src="sounds/sfx/gui-beep/33777__jobro__1-beep-c.wav"></audio>
<audio id="sfx-buttonclick" src="sounds/sfx/gui-beep/33780__jobro__2-beep-c.wav"></audio>
+ <audio id="sfx-listappear" src="sounds/sfx/gui-beep/33775__jobro__1-beep-a.wav"></audio>
<div id="root"></div>
<div id="overlay"></div>
diff --git a/level.js b/level.js
index 5a20ef5..637694f 100644
--- a/level.js
+++ b/level.js
@@ -37,7 +37,7 @@ export function setupLevelUi(level, root, sfx) {
root.classList.add('center');
ui.launchButton = document.createElement('input');
ui.launchButton.type = 'button';
- ui.launchButton.value = 'Launch';
+ ui.launchButton.value = 'launch';
ui.launchButton.onmouseenter = () => {
sfx.buttonEnterAudio.currentTime = 0;
sfx.buttonEnterAudio.play();
@@ -88,18 +88,29 @@ export function setupLevelUi(level, root, sfx) {
ui.message = document.createElement('div');
ui.id = "level-message";
- root.appendChild(ui.xeqLabel);
- root.appendChild(ui.xeq);
- root.appendChild(document.createElement('br'));
- root.appendChild(ui.yeqLabel);
- root.appendChild(ui.yeq);
- root.appendChild(document.createElement('br'));
- root.appendChild(ui.launchButton);
- root.appendChild(ui.message);
+ const appearSound = () => { sfx.listAppearAudio.currentTime = 0; sfx.listAppearAudio.play(); };
+ setTimeout(() => {
+ root.appendChild(ui.xeqLabel);
+ root.appendChild(ui.xeq);
+ root.appendChild(document.createElement('br'));
+ appearSound();
+ }, 100);
+ setTimeout(() => {
+ root.appendChild(ui.yeqLabel);
+ root.appendChild(ui.yeq);
+ root.appendChild(document.createElement('br'));
+ appearSound();
+ }, 200);
+ setTimeout(() => {
+ root.appendChild(ui.launchButton);
+ root.appendChild(ui.message);
+ appearSound();
+ }, 300);
ui.canvas = document.createElement('canvas');
+ ui.canvas.classList.add('bordered');
const setCanvasSize = () => {
- const size = Math.min(0.7*window.innerHeight, 0.9*root.offsetWidth);
+ const size = Math.min(0.8*window.innerHeight, 0.9*root.offsetWidth);
ui.canvas.width = size;
ui.canvas.height = size;
ui.ctx = ui.canvas.getContext('2d');
@@ -109,12 +120,16 @@ export function setupLevelUi(level, root, sfx) {
}
setCanvasSize();
window.onresize = setCanvasSize;
- root.appendChild(ui.canvas);
- root.appendChild(document.createElement('br'));
+ setTimeout(() => {
+ root.appendChild(ui.canvas);
+ root.appendChild(document.createElement('br'));
+ appearSound();
+ }, 400);
+
ui.returnBtn = document.createElement('input');
ui.returnBtn.type = 'button';
- ui.returnBtn.value = '↲ Return';
+ ui.returnBtn.value = '↲ return';
ui.returnBtn.onmouseenter = () => {
sfx.buttonEnterAudio.currentTime = 0;
sfx.buttonEnterAudio.play();
@@ -127,7 +142,10 @@ export function setupLevelUi(level, root, sfx) {
window.onresize = () => {};
setupLevelSelectUi(root, sfx);
}
- root.appendChild(ui.returnBtn);
+ setTimeout(() => {
+ root.appendChild(ui.returnBtn);
+ appearSound();
+ }, 500);
return ui;
}
diff --git a/levelSelect.js b/levelSelect.js
index 0fbdbf0..2fe3d52 100644
--- a/levelSelect.js
+++ b/levelSelect.js
@@ -1,11 +1,11 @@
import{ setupLevel, setupLevelUi } from './level.js';
const levels = {
- 'Initial Jump': [ [], setupLevel([], [8, 0]) ],
- 'Monopole Mining': [ ['Initial Jump'], setupLevel([[3, 3]], [8,8]) ],
- 'Parabolic': [ ['Initial Jump', 'Monopole Mining'], setupLevel([[-2, 4], [0,0], [2, 4]], [3,9]) ],
- 'Sinusoidal': [
- ['Initial Jump', 'Monopole Mining'],
+ '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]) ],
+ 'sinusoidal': [
+ ['initial jump', 'monopole harvesting'],
setupLevel([
[-4, 4*Math.sin(0)],
[0.5*Math.PI - 4, 4*Math.sin(0.5*Math.PI)],
@@ -44,7 +44,15 @@ export function setupLevelSelectUi(root, sfx) {
}
}
- [...Object.keys(levels)].forEach(levelPicker);
+ let time = 0;
+ [...Object.keys(levels)].forEach(name => {
+ setTimeout(() => {
+ sfx.listAppearAudio.currentTime = 0;
+ sfx.listAppearAudio.play();
+ levelPicker(name);
+ }, 100 * time + 100)
+ time += 1;
+ });
const header = document.createElement('h1');
header.classList.add('center');
header.innerText = 'AVAILABLE CONTRACTS';
diff --git a/main.js b/main.js
index a052d74..0415b29 100644
--- a/main.js
+++ b/main.js
@@ -20,12 +20,12 @@ window.onload = () => {
root.appendChild(title2);
const paragraph = document.createElement('p');
- paragraph.innerText = 'Greetings, navigator! Thank you for helping us to program the hyperspace engines of our Automated Monopole Harvester (AMH) platforms. By doing so, you help ensure stable antimatter production throughout the Nine Worlds.';
+ paragraph.innerText = 'greetings, navigator! thank you for helping us to program the hyperspace engines of our automated monopole harvester (AMH) platforms. by doing so, you help ensure stable antimatter production throughout the eight worlds.';
root.appendChild(paragraph);
const start = document.createElement('input');
start.type = 'button';
- start.value = 'Connect to AMH';
+ start.value = 'connect to AMH';
start.onclick = () => {
root.classList.remove('center');
root.innerText = '';
@@ -40,11 +40,11 @@ window.onload = () => {
}
musicGain.gain.value = 0.5;
const musicList = [
+ 'music-aeroplane',
'music-minute',
'music-starboard',
- 'music-cribwhistling',
'music-swish',
- 'music-aeroplane',
+ 'music-cribwhistling',
].reduce(addMusic, []);
musicList.forEach(
({ element }, i) => element.addEventListener(
@@ -57,8 +57,10 @@ window.onload = () => {
const sfx = {};
sfx.buttonEnterAudio = document.getElementById('sfx-buttonenter');
sfx.buttonClickAudio = document.getElementById('sfx-buttonclick');
+ sfx.listAppearAudio = document.getElementById('sfx-listappear');
audio.createMediaElementSource(sfx.buttonEnterAudio).connect(audio.destination);
audio.createMediaElementSource(sfx.buttonClickAudio).connect(audio.destination);
+ audio.createMediaElementSource(sfx.listAppearAudio).connect(audio.destination);
sfx.resourceAudio = document.getElementById('sfx-resource');
sfx.resourceSource = audio.createMediaElementSource(sfx.resourceAudio);
diff --git a/render.js b/render.js
index 5fde9d1..126d6be 100644
--- a/render.js
+++ b/render.js
@@ -99,7 +99,15 @@ export function drawMark(ctx, mark, x, y) {
ctx.lineWidth = 0.1;
ctx.beginPath();
- ctx.arc(x, y, 0.4, 0, 2*Math.PI);
+ if (mark === '+') {
+ ctx.arc(x, y, 0.4, 0, 2*Math.PI);
+ } else {
+ ctx.moveTo(x+0.4, y);
+ ctx.lineTo(x, y+0.4);
+ ctx.lineTo(x-0.4, y);
+ ctx.lineTo(x, y-0.4);
+ ctx.closePath();
+ }
ctx.stroke();
ctx.textAlign = 'center';
diff --git a/style.css b/style.css
index fb4fec7..41f7ffd 100644
--- a/style.css
+++ b/style.css
@@ -58,6 +58,10 @@ body {
font-size: 24px;
}
+.bordered {
+ border: 2px solid white;
+}
+
h1 {
font-size: 32px;
}
generated by cgit v1.2.1 (git 2.18.0) at 2024-11-22 03:29:40 +0000