diff --git a/css/style.css b/css/style.css index 6c1fe969..b8c0efad 100644 --- a/css/style.css +++ b/css/style.css @@ -542,8 +542,14 @@ header img { /* Ensure modal portals always sit above the sidebar stack */ #modalContainer { - position: relative; + position: fixed; + inset: 0; z-index: var(--z-modal-root); + pointer-events: none; +} + +#modalContainer > * { + pointer-events: auto; } #modalContainer > [id$="Modal"]:not(#playerModal) { @@ -1310,7 +1316,7 @@ footer a:hover { position: fixed; inset: 0; background-color: rgb(0 0 0 / 0.9); - z-index: 50; + z-index: var(--z-modal-root); /* remove display: none; */ display: flex; flex-direction: column; @@ -1318,6 +1324,15 @@ footer a:hover { overscroll-behavior: contain; } +#disclaimerModal > .absolute { + z-index: var(--z-modal-overlay); +} + +#disclaimerModal .modal-container, +#disclaimerModal .modal-content { + z-index: var(--z-modal-content); +} + #disclaimerModal.hidden { display: none !important; } diff --git a/js/channelProfile.js b/js/channelProfile.js index fa2a0d9a..ff8b8f38 100644 --- a/js/channelProfile.js +++ b/js/channelProfile.js @@ -1988,11 +1988,6 @@ async function loadUserVideos(pubkey) { const dataset = trigger.dataset || {}; const videoId = dataset.videoId || trigger.getAttribute("data-video-id") || ""; - if (videoId && typeof app?.playVideoByEventId === "function") { - app.playVideoByEventId(videoId); - return; - } - const rawUrl = dataset.playUrl || trigger.getAttribute("data-play-url") || ""; let url = ""; if (typeof rawUrl === "string" && rawUrl) { @@ -2007,9 +2002,35 @@ async function loadUserVideos(pubkey) { dataset.playMagnet || trigger.getAttribute("data-play-magnet") || ""; const magnet = typeof magnetValue === "string" ? magnetValue : ""; - if (typeof app?.playVideoWithFallback === "function") { - app.playVideoWithFallback({ url, magnet }); + const playWithUrlAndMagnet = () => { + if (typeof app?.playVideoWithFallback === "function") { + app.playVideoWithFallback({ url, magnet }); + } + }; + + if (videoId && typeof app?.playVideoByEventId === "function") { + try { + const maybePromise = app.playVideoByEventId(videoId); + if (maybePromise && typeof maybePromise.then === "function") { + maybePromise.catch((error) => { + console.error( + "Failed to play via event id from channel grid:", + error + ); + playWithUrlAndMagnet(); + }); + } + } catch (error) { + console.error( + "Failed to play via event id from channel grid:", + error + ); + playWithUrlAndMagnet(); + } + return; } + + playWithUrlAndMagnet(); }); container.dataset.playHandlerBound = "true"; }