From 3e6d514663a5df1be3b2f0286c5f67f669d9c1d6 Mon Sep 17 00:00:00 2001
From: Christophe Besson <cbesson@gmail.com>
Date: Thu, 17 Sep 2026 12:56:13 +0200
Subject: feat(hub): give the audio-language button a glyph of its own
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The audio-track selector was drawn with `volume` — the same glyph the music
player uses for its level control, and the same one the browser draws a few
dozen pixels below it, since the video player mounts `<video controls>` and
gets the native volume speaker with it. One drawing, two meanings, in one
window.

`speech-pair` is two offset bubbles: the same line, said twice, which is what
the button chooses. Nothing crosses anything — the set is stroked with no
fill, and two overlapping outlines read as a tangle at 20 px — and it leaves
the conventional subtitle glyph free for the button planned beside it.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01UGY17EPph5LsLzePPXhUVc
---
 packages/meshbay-hub/src/meshbay_hub/static/icon.js         | 9 +++++++++
 packages/meshbay-hub/src/meshbay_hub/static/video-player.js | 2 +-
 2 files changed, 10 insertions(+), 1 deletion(-)

(limited to 'packages/meshbay-hub')

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/icon.js b/packages/meshbay-hub/src/meshbay_hub/static/icon.js
index ad9fb82..306158a 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/icon.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/icon.js
@@ -91,6 +91,15 @@ const ICON_PATHS = {
              'M7 23l-4-4 4-4', 'M21 13v2a4 4 0 0 1-4 4H3'],
   volume:   ['M11 5L6 9H2v6h4l5 4z', 'M15.54 8.46a5 5 0 0 1 0 7.07',
              'M19.07 4.93a10 10 0 0 1 0 14.14'],
+  // The spoken-language chooser, and deliberately not a speaker: the video
+  // player mounts `<video controls>`, so the browser's own volume speaker sits
+  // in the same window, and `volume` above is what the music player uses for
+  // the thing it actually names. Two offset bubbles — the same line, said
+  // twice — say "which language", which is what the button does.
+  // Nothing crosses anything: these are stroked with no fill, and two
+  // overlapping outlines read as a tangle at 20 px.
+  'speech-pair': ['M11 2.5H4A1.5 1.5 0 0 0 2.5 4v4A1.5 1.5 0 0 0 4 9.5h1V12l3-2.5h3A1.5 1.5 0 0 0 12.5 8V4A1.5 1.5 0 0 0 11 2.5z',
+                  'M13 12.5h7A1.5 1.5 0 0 1 21.5 14v4a1.5 1.5 0 0 1-1.5 1.5h-1V22l-3-2.5h-3A1.5 1.5 0 0 1 11.5 18v-4a1.5 1.5 0 0 1 1.5-1.5z'],
   image:    ['M5 3.5h14a1.5 1.5 0 0 1 1.5 1.5v14a1.5 1.5 0 0 1-1.5 1.5H5a1.5 1.5 0 0 1-1.5-1.5V5a1.5 1.5 0 0 1 1.5-1.5z',
              'M7 9.5a1.5 1.5 0 1 0 3 0 1.5 1.5 0 0 0-3 0',
              'M20.5 15l-5-5-9.5 9.5'],
diff --git a/packages/meshbay-hub/src/meshbay_hub/static/video-player.js b/packages/meshbay-hub/src/meshbay_hub/static/video-player.js
index 4970262..23b0699 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/video-player.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/video-player.js
@@ -1036,7 +1036,7 @@ function VideoPlayer({ entry, transportRef, gekRef, onClose, onDownload }) {
             <button class="video-close ${audioMenuOpen ? 'cast-active' : ''}"
               onClick=${() => setAudioMenuOpen(!audioMenuOpen)}
               title="${t('video.audio_track')}">
-              <${Icon} name="volume" /></button>
+              <${Icon} name="speech-pair" /></button>
             ${audioMenuOpen && html`
               <div class="cast-picker">
                 ${audioTracks.map((track) => html`
-- 
cgit v1.2.3