openvibers/openvibe.live Commits

On a phone the messages panel is a full-screen sheet over the navbar (#480)

OP OpenVibers committed 13 days ago · dd0ddcf5fb · 2 files, +31 −11

* On a phone the messages panel is a full-screen sheet over the navbar, so their parts no longer draw over each other

The owner, 2026-10-31: "this gets all screwed up when you have DMs open" (a phone, the panel open from the
navbar's messages button). The panel filled the screen under the bar (z-index 9999 < 10000), and the bar is
see-through at the top of a page, so the panel's header showed through it: "Messages" under the brand, its
settings gear under the bell, its close button under the menu.

Up to 480px the panel now sits above the bar (10030; an incoming call, 10035/10040, still shows over it), clear of
the notch and the home bar, with its own header a 56px row of 44px buttons, and its scrolling never moves the page.

* The clip audit's fixtures are dated from today

clip-audit-sql seeded its clips on fixed October days and the audit counts the last 30 days, so from 2026-10-31 the first fell out (2 !== 3) and main's suite went red. The clips are now created a few days before the run.

* Every clip audit fixture is dated from today

The chat messages, the visits and the stream row were on fixed October days as well; the audit counts the last 30 days, so they fell out too (the chat buckets came back empty).

Changes

ddiff --git a/public/css/messenger.css b/public/css/messenger.css
iindex 5eb6992c..f43fb8bd 100644
---- a/public/css/messenger.css
++++ b/public/css/messenger.css
@@@ -927,3 +927,22 @@
  .messenger-panel.from-bar { top: calc(var(--navbar-h, 56px) + 8px); right: 12px; left: auto; bottom: auto; max-height: calc(100vh - var(--navbar-h, 56px) - 24px); max-height: calc(100dvh - var(--navbar-h, 56px) - 24px); }
  @media (max-width: 480px) { .messenger-panel.from-bar { top: 0; right: 0; bottom: 0; left: 0; max-height: none; height: 100%; height: 100dvh; } }
  @media (max-width: 768px) and (min-width: 481px) { .messenger-panel.from-bar { right: 8px; } }
++
++/* On a phone the panel is a full-screen sheet over everything, the navbar included (owner, 2026-10-31: "this gets
++   all screwed up when you have DMs open"). Under the bar (9999 < the navbar's 10000) its header showed through the
++   bar, which is see-through at the top of a page: "Messages" under the brand, the gear under the bell, the close
++   button under the menu. Its own header carries the title and the close button; an incoming call (10035, 10040)
++   still shows above it. The sheet keeps clear of the notch and the home bar, and its scrolling never moves the page. */
++@media (max-width: 480px) {
++    .messenger-panel, .messenger-panel.from-bar {
++        z-index: 10030;
++        border: 0;
++        padding-top: env(safe-area-inset-top, 0px);
++        padding-bottom: env(safe-area-inset-bottom, 0px);
++        background: var(--bg-secondary);
++        overscroll-behavior: contain;
++    }
++    .messenger-panel .msg-header { min-height: 56px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(10px, env(safe-area-inset-right, 0px)); }
++    .messenger-panel .msg-header-title { font-size: 17px; }
++    .messenger-panel .msg-header-btn { min-width: 44px; min-height: 44px; }
++}
ddiff --git a/test/clip-audit-sql.test.js b/test/clip-audit-sql.test.js
iindex bb822793..7836903d 100644
---- a/test/clip-audit-sql.test.js
++++ b/test/clip-audit-sql.test.js
@@@ -87,19 +87,20 @@ async function main() {
          CREATE TABLE public.chat_messages (
              id bigint PRIMARY KEY, stream_id bigint, user_id bigint, anon_id text, message text,
              message_type text, is_deleted bigint, is_filtered bigint, timestamp text);
++        -- Dated a few days before the run, whatever the day (fixed October dates fell out of the audit's 30 days).
          INSERT INTO public.clips VALUES
--            (1, 10, 100, 7, 'MARKER-title', 'MARKER-description', 0, 25, 25, 1, 'public', 'ready', 12, 1, '2026-10-01 10:00:00', 12, 'hello there friends', 'a short clip'),
--            (2, 10, 100, 7, 'MARKER-title', 'MARKER-description', 20, 45, 25, 1, 'public', 'ready', 3, 1, '2026-10-02 10:00:00', 3, 'hello there friends', 'a short clip'),
--            (3, 11, 101, 8, 'MARKER-title', 'MARKER-description', 0, 25, 25, 1, 'public', 'ready', 0, 1, '2026-10-03 10:00:00', 0, NULL, NULL),
--            (4, 12, 102, 9, 'MARKER-title', 'MARKER-description', 0, 30, 30, 1, 'public', 'ready', 5, 0, '2026-10-04 10:00:00', 5, NULL, NULL);
++            (1, 10, 100, 7, 'MARKER-title', 'MARKER-description', 0, 25, 25, 1, 'public', 'ready', 12, 1, to_char(now() - interval '5 days', 'YYYY-MM-DD HH24:MI:SS'), 12, 'hello there friends', 'a short clip'),
++            (2, 10, 100, 7, 'MARKER-title', 'MARKER-description', 20, 45, 25, 1, 'public', 'ready', 3, 1, to_char(now() - interval '4 days', 'YYYY-MM-DD HH24:MI:SS'), 3, 'hello there friends', 'a short clip'),
++            (3, 11, 101, 8, 'MARKER-title', 'MARKER-description', 0, 25, 25, 1, 'public', 'ready', 0, 1, to_char(now() - interval '3 days', 'YYYY-MM-DD HH24:MI:SS'), 0, NULL, NULL),
++            (4, 12, 102, 9, 'MARKER-title', 'MARKER-description', 0, 30, 30, 1, 'public', 'ready', 5, 0, to_char(now() - interval '2 days', 'YYYY-MM-DD HH24:MI:SS'), 5, NULL, NULL);
          INSERT INTO public.content_visits VALUES
--            ('clip', 1, 'visitor-1', '2026-10-01 11:00:00', '2026-10-02 11:00:00', 2),
--            ('clip', 1, 'visitor-2', '2026-10-02 11:00:00', '2026-10-02 12:00:00', 1),
--            ('clip', 4, 'visitor-3', '2026-10-04 11:00:00', '2026-10-05 11:00:00', 1);
++            ('clip', 1, 'visitor-1', to_char(now() - interval '5 days' + interval '1 hour', 'YYYY-MM-DD HH24:MI:SS'), to_char(now() - interval '4 days' + interval '1 hour', 'YYYY-MM-DD HH24:MI:SS'), 2),
++            ('clip', 1, 'visitor-2', to_char(now() - interval '4 days' + interval '1 hour', 'YYYY-MM-DD HH24:MI:SS'), to_char(now() - interval '4 days' + interval '2 hours', 'YYYY-MM-DD HH24:MI:SS'), 1),
++            ('clip', 4, 'visitor-3', to_char(now() - interval '2 days' + interval '1 hour', 'YYYY-MM-DD HH24:MI:SS'), to_char(now() - interval '1 days' + interval '1 hour', 'YYYY-MM-DD HH24:MI:SS'), 1);
          INSERT INTO public.chat_messages VALUES
--            (1, 100, 7, 'anon-1', 'hi', 'message', 0, 0, '2026-10-01 10:00:00'),
--            (2, 100, 8, 'anon-2', 'MARKER-message', 'message', 0, 0, '2026-10-01 10:00:05'),
--            (3, 101, 9, 'anon-3', 'yo', 'message', 1, 0, '2026-10-01 10:00:10');
++            (1, 100, 7, 'anon-1', 'hi', 'message', 0, 0, to_char(now() - interval '5 days', 'YYYY-MM-DD HH24:MI:SS')),
++            (2, 100, 8, 'anon-2', 'MARKER-message', 'message', 0, 0, to_char(now() - interval '5 days' + interval '5 seconds', 'YYYY-MM-DD HH24:MI:SS')),
++            (3, 101, 9, 'anon-3', 'yo', 'message', 1, 0, to_char(now() - interval '5 days' + interval '10 seconds', 'YYYY-MM-DD HH24:MI:SS'));
          INSERT INTO app_state (key, value) VALUES ('auto_clip_log',
              '[{"ts": 1767225600000, "vod_id": 10, "stream_id": 100, "start_time": 0, "title": "MARKER-title", "clip_id": 1},
                {"ts": 1767225600000, "vod_id": 11, "stream_id": 101, "start_time": 0, "title": "MARKER-title", "clip_id": 2}]')
@@@ -112,7 +113,7 @@ async function main() {
              SELECT 'clip-audit-fixture', 'not-a-password'
              WHERE NOT EXISTS (SELECT 1 FROM users WHERE username = 'clip-audit-fixture');
          INSERT INTO streams (user_id, title, is_live, viewer_count, peak_viewers, started_at)
--            SELECT id, 'MARKER-title', 0, 2, 5, '2026-10-01 09:00:00' FROM users WHERE username = 'clip-audit-fixture';
++            SELECT id, 'MARKER-title', 0, 2, 5, to_char(now() - interval '5 days' - interval '1 hour', 'YYYY-MM-DD HH24:MI:SS') FROM users WHERE username = 'clip-audit-fixture';
          INSERT INTO stream_analytics (stream_id, avg_viewers, peak_viewers, unique_chatters, total_messages, clips_created)
              SELECT id, 2, 5, 3, 120, 1 FROM streams WHERE title = 'MARKER-title' LIMIT 1
              ON CONFLICT (stream_id) DO NOTHING;