From 0d3864bcebcdba1b1743367d0f84389fd53e37e1 Mon Sep 17 00:00:00 2001
From: srdusr <99972264+srdusr@users.noreply.github.com>
Date: Sat, 13 Sep 2025 21:11:00 +0200
Subject: Rework the end screen figures, mode picker, corners and race view

End screen
- Every figure is now a dim label directly over its value, the two centred on
  each other, grouped by what they qualify: RAW and PB under WPM, ERR and
  CONSISTENCY under ACC, KEYSTROKES and CHARACTERS either side of TIME. The
  row is a grid so TIME sits on the graph's exact centre line rather than
  drifting with its neighbours' widths.
- Errors go back onto the wpm line. Their own y axis implied a magnitude a
  mistake does not have; what matters is when one happened.
- Graph hover reads "wpm ... raw ... time" - the figures first, the second
  they happened in as the qualifier.

Mode picker
- Opens from the Single Player button itself, and choosing a mode starts it:
  picking what to type and starting it are one action. The control has now
  been a chevron notched into that button, a caption between the two buttons,
  a pill above them and a chip row below them; as the button's own menu it
  needs no separate real estate at all.

Corners
- Settings and Store move to the bottom-left. The top-left is the wordmark's
  alone.
- The global racer count is gone from the home screen - it is not something
  you can act on there. The Friends control carries "N online" instead, which
  is.
- Presence: users gain a last_seen column, touched at most once a minute per
  active user on any authenticated request, and the friends list reports who
  has been seen inside a five-minute window.

Multiplayer race view
- The standings move to the middle of the screen, the space the end screen's
  graph occupies, and now include your own row rather than opponents only.
  Pinned to the top-left corner they put what you are racing against in your
  peripheral vision and left out the one bar you most need to see.

Programming mode
- Snippets carry an explanation of what the code does. Shown under the passage
  while you type in single player; in multiplayer that space belongs to the
  standings, so it waits for the end screen, where it appears either way.
---
 web/src/app.js | 12 ++++++++++++
 1 file changed, 12 insertions(+)

(limited to 'web/src/app.js')

diff --git a/web/src/app.js b/web/src/app.js
index fac89d4..cc4e0d2 100644
--- a/web/src/app.js
+++ b/web/src/app.js
@@ -104,6 +104,15 @@ export function startApp(root, localTexts) {
                 try { localStorage.setItem('typerpunk:last_mode', cat); } catch {}
                 showMainMenu();
             },
+            // Picking a mode from the Single Player menu starts that mode --
+            // choosing what to type and starting it are one action now, not a
+            // selection followed by a second click on the same button.
+            onPickAndStart: cat => {
+                selectedCategory = cat;
+                try { localStorage.setItem('typerpunk:last_mode', cat); } catch {}
+                session = { type: 'random', customIndex: 0 };
+                startGame();
+            },
             customText,
             onLoadCustom: loaded => {
                 customText = loaded;
@@ -228,6 +237,7 @@ export function startApp(root, localTexts) {
         teardown();
         let content;
         let attribution;
+        let explanation;
         let language;
         let progress;
         let timeLimit;
@@ -272,6 +282,7 @@ export function startApp(root, localTexts) {
             // Code snippets highlight themselves; prose packs have no language
             // and fall through as plain text.
             language = item.language || undefined;
+            explanation = item.explanation || undefined;
             modeKey = `quote-${selectedCategory || 'random'}`;
         }
 
@@ -288,6 +299,7 @@ export function startApp(root, localTexts) {
             game,
             text: content,
             attribution,
+            explanation,
             language,
             progress,
             timeLimit,
-- 
cgit v1.2.3