srdusr
aboutsummaryrefslogtreecommitdiffstats
path: root/web/src/keySounds.js
diff options
context:
space:
mode:
authorsrdusr <[email protected]>2025-09-11 21:53:00 +0200
committersrdusr <[email protected]>2025-09-11 21:53:00 +0200
commita726d9f5fb56e1fd7983c5ac806d408ad78daa86 (patch)
tree4129a058e2a9e8fa4e0a51e3ed943b746750c3cf /web/src/keySounds.js
parent8c95e90fa54db565919ec323818f77e7256812c8 (diff)
downloadtyperpunk-a726d9f5fb56e1fd7983c5ac806d408ad78daa86.tar.gz
typerpunk-a726d9f5fb56e1fd7983c5ac806d408ad78daa86.zip
Add multiplayer bots, typing languages, and rework the UI layout
Multiplayer - Quick match: POST /api/multiplayer/quickmatch returns whichever room is still filling, or opens one. Players never see a room code; joining by code stays for racing specific people. - Bots fill quick-match rooms after a short wait so a new game is never an empty lobby. They only ever join quick-match rooms, never a room opened by code. One or two per room, drawn from separate ~40 and ~80 WPM tiers so two bots are never near each other's pace, and they stall to correct mistakes rather than typing a clean straight line. - Live player count via GET /api/multiplayer/online, shown on the Multiplayer control and under the main menu's Multiplayer button. - Per-racer colours: you are the theme accent, opponents take distinct hues that stay the same from lobby to race. - The countdown no longer holds the room lock for its full three seconds, which is what reset clients mid-countdown. Typing languages - 16 languages for the generated-word modes, each with its own high-frequency vocabulary rather than a translation of the English list. - Picker in the top-right rail; non-English uses its own list at every difficulty tier instead of falling back to English words. Fix UTF-8 accuracy in the game core - update_game_state mixed byte and character counts: total_characters_typed accumulated byte-length deltas while total_correct_characters compared a char index against that byte count. Equal on ASCII, so it went unnoticed; a correctly typed Spanish passage scored 6%. The old byte slicing would also have panicked if an index landed inside a multi-byte character. Rewritten char-based, with regression tests. Programming mode - Replaced prose about programming with real code: 26 syntax-highlighted snippets across JavaScript, Python, Rust, C/Go/Java and shell. Single-line by necessity, since the typing input is a single-line field. Layout and readability - One icon rail arrangement on every screen: Settings/Store under the wordmark, Language/Theme/Friends/Account top-right, Stats/Leaderboard/ Multiplayer bottom-right. - Main menu: mode picker moved out of the Single Player button, which it was notching a divider through and pushing the label off-centre. - Escape returns to the menu, closing any open popover first, and confirms before abandoning a live race. - Split --text-color and --sub-color per theme; they shared one value that measured 3.65:1 against the background, below the 4.5:1 body-text floor. - Semantic colours used in exactly one place each: gold for a personal best, amber for the race countdown and the mobile-result badge. - Passage now sits in the same place on the typing and end screens, and its column is a whole number of characters wide so wrapping cannot leave a permanent gap on the right. - End screen: keystrokes and a correct/wrong/extra/missed split, attribution carried over from the typing screen, and a graph with a separate error axis, axis titles including seconds, and smoothed lines.
Diffstat (limited to 'web/src/keySounds.js')
-rw-r--r--web/src/keySounds.js42
1 files changed, 42 insertions, 0 deletions
diff --git a/web/src/keySounds.js b/web/src/keySounds.js
new file mode 100644
index 0000000..1a20087
--- /dev/null
+++ b/web/src/keySounds.js
@@ -0,0 +1,42 @@
+import { getSettings } from './settings.js';
+
+// Synthesized rather than sampled - a couple of short tones via the Web
+// Audio API instead of shipping/loading actual click-sample audio files,
+// so the feature has zero asset dependencies.
+const THEMES = {
+ click: { freq: 1800, duration: 0.03, type: 'square' },
+ mech: { freq: 180, duration: 0.05, type: 'triangle' },
+};
+
+let audioCtx = null;
+function getContext() {
+ if (!audioCtx) {
+ const AudioContextClass = window.AudioContext || window.webkitAudioContext;
+ audioCtx = new AudioContextClass();
+ }
+ return audioCtx;
+}
+
+// Browsers refuse to start an AudioContext before a user gesture - the
+// first keystroke that reaches here always follows one (focusing/typing
+// into the input), so resuming inline rather than requiring a separate
+// "enable sound" click.
+export function playKeySound() {
+ const { soundTheme } = getSettings();
+ const theme = THEMES[soundTheme];
+ if (!theme) return;
+
+ const ctx = getContext();
+ if (ctx.state === 'suspended') ctx.resume();
+
+ const osc = ctx.createOscillator();
+ const gain = ctx.createGain();
+ osc.type = theme.type;
+ osc.frequency.value = theme.freq;
+ gain.gain.setValueAtTime(0.12, ctx.currentTime);
+ gain.gain.exponentialRampToValueAtTime(0.0001, ctx.currentTime + theme.duration);
+ osc.connect(gain);
+ gain.connect(ctx.destination);
+ osc.start();
+ osc.stop(ctx.currentTime + theme.duration);
+}