From 269d083aef22fa63472b49772608f418c38af9bf Mon Sep 17 00:00:00 2001 From: "prompt.ac/@jeffrey" Date: Wed, 5 Aug 2026 23:09:07 -0700 Subject: [PATCH] Refine Laklok presence header --- system/public/aesthetic.computer/disks/chat.mjs | 16 +++++++++++----- .../public/aesthetic.computer/disks/laklok.mjs | 9 +++++---- .../public/aesthetic.computer/disks/notepat.mjs | 8 ++++---- system/public/aesthetic.computer/lib/disk.mjs | 16 +++++++++++----- 4 files changed, 31 insertions(+), 18 deletions(-) diff --git a/system/public/aesthetic.computer/disks/chat.mjs b/system/public/aesthetic.computer/disks/chat.mjs index a00398271..6a9dd8cb9 100644 --- a/system/public/aesthetic.computer/disks/chat.mjs +++ b/system/public/aesthetic.computer/disks/chat.mjs @@ -2159,8 +2159,8 @@ function paint( } } else if (!client.connecting) { const chatterCount = client?.chatterCount ?? 0; - const onlineHandles = client?.onlineHandles || []; - const hereHandles = client?.hereHandles || []; + const onlineHandles = [...new Set(client?.onlineHandles || [])]; + const hereHandles = [...new Set(client?.hereHandles || [])]; const hereCount = hereHandles.length; const onlineCount = onlineHandles.length; @@ -2187,11 +2187,15 @@ function paint( const presenceY = options?.presenceTop ?? Math.min(hudLabelBottom + 3, maxPresenceY); const onlineFgColor = theme?.timestamp || 160; - const tickerLeftEdge = screen.width - 230; // Reserve space for News/r8Dio + const presenceRightInset = options?.presenceRightInset + ?? (options?.hideChrome ? 6 : 230); + const tickerLeftEdge = screen.width - presenceRightInset; // Build count label let countLabel; - if (hereCount > 0) { + if (options?.presenceOnlineOnly) { + countLabel = `${onlineCount || chatterCount} online`; + } else if (hereCount > 0) { countLabel = `${hereCount} here`; if (onlineCount > hereCount) { countLabel += ` ยท ${onlineCount} online`; @@ -2213,7 +2217,9 @@ function paint( }, false, undefined, false, "MatrixChunky8"); // Render active handles to the right of the count - const activeHandles = hereCount > 0 ? hereHandles : onlineHandles; + // The count may distinguish people viewing this piece (`here`) from the + // wider service, but the names beside "online" should be that wider list. + const activeHandles = onlineHandles.length > 0 ? onlineHandles : hereHandles; if (activeHandles.length > 0) { const countWidth = text.width(countLabel, "MatrixChunky8"); let handleX = presenceX + countWidth + 4; diff --git a/system/public/aesthetic.computer/disks/laklok.mjs b/system/public/aesthetic.computer/disks/laklok.mjs index d0aa43e1c..f400fb340 100644 --- a/system/public/aesthetic.computer/disks/laklok.mjs +++ b/system/public/aesthetic.computer/disks/laklok.mjs @@ -39,9 +39,8 @@ function boot({ api, wipe, debug, send, hud }) { // ๐Ÿท๏ธ Ensure label shows piece name (not "chat"), pinned white so it doesn't // ride the red/orange/lime connection-status color. hud.label("laklok", "white"); - // โœจ Show ".com" superscript in the HUD corner label (laklok.com branding, - // same as notepat). disk.mjs renders the ".com" case specially. - hud.superscript(".com"); + // ๐ŸŒ Complete the laklok.com wordmark on the same baseline. + hud.suffix(".com"); } // ๐ŸŽช "Laer Klokken" circus banner โ€” a striped, gold-trimmed marquee in the @@ -139,7 +138,7 @@ function paintQR($) { const cells = lakQRCells; const size = cells.length; // 1px per cell const qrBoxSize = size + 2; - const rightInset = 6; // Align with the footer controls instead of the canvas edge. + const rightInset = 3; // Match the QR's 3px top inset (4px below at this height). const qrX = screen.width - qrBoxSize - rightInset; const qrY = Math.floor((LAK_TOP_MARGIN - qrBoxSize) / 2); ink(255, 255, 255).box(qrX, qrY, size + 2, size + 2); // white background + border @@ -158,6 +157,8 @@ function paint($) { topMargin: LAK_TOP_MARGIN, // Shorter top chrome panel than the default 42. attachAfterInput: true, inputPlaceholder: "Chat...", + presenceOnlineOnly: true, + presenceRightInset: 34, // QR box + inset + breathing room. // ๐ŸŽช Circus marquee as the header backdrop โ€” fills the whole chrome panel, // painted under the online counter so the counter stays readable on top. paintHeader: (api, tm) => paintLaerKlokkenSign(api, tm), diff --git a/system/public/aesthetic.computer/disks/notepat.mjs b/system/public/aesthetic.computer/disks/notepat.mjs index 8c452f349..80adbb435 100644 --- a/system/public/aesthetic.computer/disks/notepat.mjs +++ b/system/public/aesthetic.computer/disks/notepat.mjs @@ -1585,8 +1585,8 @@ async function boot({ freq: sound?.freq, }); - // โœจ Show ".com" superscript in the HUD corner label (notepat.com branding) - hud.superscript(".com"); + // ๐ŸŒ Complete the notepat.com wordmark on the same baseline. + hud.suffix(".com"); dotComMode = true; // ๐ŸŽน Check if we're in DAW mode (loaded from Ableton M4L) @@ -1598,10 +1598,10 @@ async function boot({ overlayMode = query?.overlay === "true" || query?.overlay === true || query?.overlay === "1"; if (overlayMode) { console.log("๐ŸชŸ Notepat: overlay mode โ€” skipping background wipes"); - // Hide the corner label + ".com" superscript so nothing floats over + // Hide the corner label + ".com" suffix so nothing floats over // the desktop except the piano itself. The default slug is set by // the disk loader, so we have to explicitly clear it. - hud.superscript(null); + hud.suffix(null); hud.label(undefined); dotComMode = false; } diff --git a/system/public/aesthetic.computer/lib/disk.mjs b/system/public/aesthetic.computer/lib/disk.mjs index 1dadda439..53e79f556 100644 --- a/system/public/aesthetic.computer/lib/disk.mjs +++ b/system/public/aesthetic.computer/lib/disk.mjs @@ -3657,7 +3657,11 @@ const $commonApi = { tinyLabel: (enabled = true) => { forceTinyHudLabel = enabled; }, - // โœจ Set a custom superscript (e.g. ".com") to display after the label in cyan + // ๐ŸŒ Set a compact suffix (e.g. ".com") after the HUD label. + suffix: (text) => { + currentHUDSuperscript = text || null; + }, + // Backward-compatible name for older pieces. superscript: (text) => { currentHUDSuperscript = text || null; }, @@ -14894,10 +14898,12 @@ async function makeFrame({ data: { type, content } }) { ); const superscriptX = hudTextX + firstLineWidth + 2; - // Floor-align the small superscript (e.g. ".com", 8px tall via - // MatrixChunky8) with the bottom of the label glyphs, then nudge - // up 1px so it sits just above the corner word's baseline. - const superscriptY = Math.max(0, (currentHUDLabelBlockHeight || 10) - 9); + // Baseline-align the compact suffix with the larger HUD label. + const suffixBlockHeight = 8; // MatrixChunky8 + const superscriptY = hudTextY + Math.max( + 0, + (currentHUDLabelBlockHeight || 10) - suffixBlockHeight, + ); // Special handling for ".com" - color the "." based on connection status if (currentHUDSuperscript === ".com") { -- 2.51.2