@bobfrankston/rmfmail 1.0.492 → 1.0.493

package/client/app.js

@@ -4,7 +4,7 @@
  */
 import { initFolderTree, refreshFolderTree, updateFolderCounts, setFolderSynced, getFolderSynced, setOutboxTotal } from "./components/folder-tree.js";
 import { initMessageList, loadMessages, loadUnifiedInbox, loadSearchResults, reloadCurrentFolder, clearSearchMode, getSelectedMessages, markBodiesCached, getCurrentFocused, releaseFocus, removeMessagesAndReconcile, setRowFlagged, scrollFocusedIntoView } from "./components/message-list.js";
-import { showMessage, getCurrentMessage, initViewer, popOutCurrentMessage, toggleFullscreenPreview } from "./components/message-viewer.js";
+import { showMessage, getCurrentMessage, initViewer, popOutCurrentMessage, toggleFullscreenPreview, showPreviewBodyMenu } from "./components/message-viewer.js";
 import { connectWebSocket, onWsEvent, triggerSync, syncAccount, reauthenticate, getAccounts, getFolders, deleteMessages, undeleteMessage, restartServer, getSyncPending, getVersion, getSettings, saveSettings, getAutocompleteSettings, saveAutocompleteSettings, repairAccounts, updateFlags, markAsSpamMessages, logClientEvent, sendMessage as apiSendMessage } from "./lib/api-client.js";
 import * as messageState from "./lib/message-state.js";
 // ── New message badge (favicon + title) ──
@@ -516,6 +516,7 @@ document.getElementById("btn-sync")?.addEventListener("click", async () => {
 const restartBtn = document.getElementById("btn-restart");
 const restartDropdown = document.getElementById("restart-dropdown");
 restartBtn?.addEventListener("click", () => {
+    restoreToolbarDropdown("restart-dropdown", "restart-menu");
     if (restartDropdown)
         restartDropdown.hidden = !restartDropdown.hidden;
 });
@@ -1177,7 +1178,7 @@ document.getElementById("rail-tasks")?.addEventListener("click", async () => {
  *  content. We never put the dropdown back: the toolbar handler also
  *  works on a body-attached dropdown (it's just toggling .hidden), and
  *  re-parenting on every toggle would defeat any focus state inside. */
-function openMenuFromRail(dropdownId, anchor) {
+function openMenuFromRail(dropdownId, _anchor) {
     const dd = document.getElementById(dropdownId);
     if (!dd)
         return;
@@ -1194,54 +1195,39 @@ function openMenuFromRail(dropdownId, anchor) {
     if (dd.parentElement?.classList.contains("tb-menu")) {
         document.body.appendChild(dd);
     }
-    // Reset all positional inline styles each open so a previous configuration
-    // (e.g. wide-tier anchor → narrow-tier modal) doesn't leak through.
+    // Uniform behavior across desktop and Android: render rail-opened menus
+    // as a centered modal with a dimmed backdrop. Anchor-based positioning
+    // was inconsistent (worked on Android narrow but not Mac/desktop wide;
+    // bottom-rail icons sit at the viewport floor and the menu spilled off
+    // or landed under chrome). A centered card is always visible, always
+    // dismissible by tapping the backdrop, and the same on every platform.
     dd.style.cssText = "";
     dd.style.position = "fixed";
+    dd.style.top = "50%";
+    dd.style.left = "50%";
+    dd.style.transform = "translate(-50%, -50%)";
+    dd.style.maxHeight = "85vh";
+    dd.style.maxWidth = "92vw";
+    dd.style.overflowY = "auto";
+    dd.style.boxShadow = "0 8px 32px rgba(0,0,0,0.4)";
     dd.style.zIndex = "10000";
-    if (window.innerWidth <= 768) {
-        // Narrow tier: render as a centered modal-style overlay. Anchor-based
-        // positioning was unreliable on phones because bottom-rail icons sit
-        // at the viewport floor — the menu either spilled off-screen or
-        // landed where the rail itself overlapped it. A centered card is
-        // always visible, always reachable, and matches the keyboard-shortcut
-        // dialog pattern (click-outside / Esc to close).
-        dd.style.top = "50%";
-        dd.style.left = "50%";
-        dd.style.transform = "translate(-50%, -50%)";
-        dd.style.maxHeight = "85vh";
-        dd.style.maxWidth = "92vw";
-        dd.style.overflowY = "auto";
-        dd.style.boxShadow = "0 8px 32px rgba(0,0,0,0.4)";
-        dd.hidden = false;
-        ensureRailMenuBackdrop();
-    }
-    else {
-        // Wide tier: anchor to the right of the rail icon, growing whichever
-        // way has more room. (Bottom-rail icons sit near the viewport floor —
-        // anchoring `top: rect.top` makes the menu spill off the bottom.)
-        const rect = anchor.getBoundingClientRect();
-        const minWidth = 220;
-        const left = Math.min(rect.right + 6, window.innerWidth - minWidth - 8);
-        dd.style.left = `${Math.max(8, left)}px`;
-        dd.hidden = false;
-        const ddHeight = dd.getBoundingClientRect().height;
-        const spaceBelow = window.innerHeight - rect.top - 8;
-        const spaceAbove = rect.bottom - 8;
-        if (ddHeight > spaceBelow && spaceAbove > spaceBelow) {
-            dd.style.bottom = `${Math.max(8, window.innerHeight - rect.bottom)}px`;
-            if (ddHeight > spaceAbove) {
-                dd.style.maxHeight = `${spaceAbove}px`;
-                dd.style.overflowY = "auto";
-            }
-        }
-        else {
-            dd.style.top = `${Math.max(8, rect.top)}px`;
-            if (ddHeight > spaceBelow) {
-                dd.style.maxHeight = `${spaceBelow}px`;
-                dd.style.overflowY = "auto";
-            }
-        }
+    dd.hidden = false;
+    ensureRailMenuBackdrop();
+}
+/** Restore a body-parented rail-opened dropdown back to its toolbar parent
+ *  and clear inline positioning, so the toolbar button's plain
+ *  `dd.hidden = !dd.hidden` toggle renders the dropdown in its usual
+ *  position-absolute place. Without this, the toolbar dropdown opens at
+ *  the rail-modal's centered position (or somewhere else stale) the first
+ *  time a user mixes rail-open and toolbar-open in the same session. */
+function restoreToolbarDropdown(ddId, tbMenuId) {
+    const dd = document.getElementById(ddId);
+    const tb = document.getElementById(tbMenuId);
+    if (!dd || !tb)
+        return;
+    if (dd.parentElement === document.body) {
+        tb.appendChild(dd);
+        dd.style.cssText = "";
     }
 }
 /** Narrow-tier rail menus need a tap-anywhere-to-close backdrop because the
@@ -1570,6 +1556,26 @@ window.addEventListener("message", (e) => {
             window.open(url, "_blank", "noopener,noreferrer");
         }
     }
+    if (e.data?.type === "previewToggleFullscreen") {
+        toggleFullscreenPreview();
+        return;
+    }
+    if (e.data?.type === "previewContextMenu") {
+        // Translate iframe-relative coords to viewport. Find the iframe whose
+        // contentWindow matches the source so we map correctly even when
+        // multiple iframes are present (compose iframe + viewer iframe).
+        let iframeRect = null;
+        for (const f of Array.from(document.querySelectorAll("iframe"))) {
+            if (f.contentWindow === e.source) {
+                iframeRect = f.getBoundingClientRect();
+                break;
+            }
+        }
+        const x = (iframeRect?.left || 0) + (e.data.x || 0);
+        const y = (iframeRect?.top || 0) + (e.data.y || 0);
+        showPreviewBodyMenu(x, y, String(e.data.selectedText || ""), e.source);
+        return;
+    }
     if (e.data?.type === "linkContextMenu") {
         // C29: right-click in body iframe → Open / Save / Copy URL menu.
         // Iframe's clientX/Y is relative to the iframe; translate to viewport.
@@ -2380,6 +2386,10 @@ viewBtn?.addEventListener("click", (e) => {
     const restartDd = document.getElementById("restart-dropdown");
     if (restartDd)
         restartDd.hidden = true;
+    // If the dropdown was previously opened via the rail (re-parented to
+    // body with inline modal styles), restore it to its toolbar parent so
+    // it renders in the expected position-absolute location.
+    restoreToolbarDropdown("view-dropdown", "view-menu");
     if (viewDropdown)
         viewDropdown.hidden = !viewDropdown.hidden;
 });
@@ -3195,6 +3205,7 @@ settingsBtn?.addEventListener("click", (e) => {
     const restartDd = document.getElementById("restart-dropdown");
     if (restartDd)
         restartDd.hidden = true;
+    restoreToolbarDropdown("settings-dropdown", "settings-menu");
     if (settingsDropdown)
         settingsDropdown.hidden = !settingsDropdown.hidden;
 });