Ad viewing: full-screen in-page overlay instead of a new tab

Mobile and in-app wallet (dApp) browsers handle tabs badly, so opening each ad in
a new tab made the earn loop hard to navigate and impossible to close. Ads now
open in a full-screen in-page overlay that reuses the /view dwell + human-check +
credit logic in an iframe: an always-working close control, no window.close, no
tab-switching. The framed /view relaxes its focus-pause to visibility only and
messages the dashboard when it credits or the user is done.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

public/assets/view.js

@@ -5,6 +5,7 @@
 (() => {
   const $ = id => document.getElementById(id);
   const token = location.pathname.split('/').pop();
+  const framed = window.self !== window.top; // shown inside the dashboard's in-page ad overlay
   let left = 5, timer = null, credited = false, asking = false;
   const setMsg = t => { $('vMsg').textContent = t; };
   async function j(url, body) {
@@ -15,10 +16,12 @@
   }
   function tick() {
     if (credited || asking) return;
-    if (document.visibilityState !== 'visible' || !document.hasFocus()) {
+    // In the in-page overlay the iframe often doesn't hold focus even though it's
+    // fully on screen, so gate on tab visibility only when framed.
+    if (document.visibilityState !== 'visible' || (!framed && !document.hasFocus())) {
       $('vTimer').classList.add('paused');
       $('vTimer').textContent = 'paused';
-      setMsg('Come back to this tab to keep the countdown moving.');
+      setMsg(framed ? 'Keep this ad on screen to finish the countdown.' : 'Come back to this tab to keep the countdown moving.');
       return;
     }
     $('vTimer').classList.remove('paused');
@@ -71,6 +74,7 @@
       + (st.views >= st.target && !st.claimed ? ' Head back and claim your credits.' : ''));
     $('vDone').classList.add('on');
     try { localStorage.setItem('iap-view-done', String(Date.now())); } catch (e) {}
+    try { if (framed) window.parent.postMessage({ t: 'iap-view-done' }, location.origin); } catch (e) {}
   }
   function fail(msg) {
     credited = true; // stop the loop; this view is over either way
@@ -89,6 +93,13 @@
       if (!window.closed) { setMsg('Taking you back to your dashboard…'); location.href = '/my#earn'; }
     }, 400);
   });
+  // When shown inside the dashboard's in-page overlay there is no tab to close:
+  // hide "Close tab" and turn "Back to dashboard" into a close-the-overlay signal.
+  if (framed) {
+    const cb = $('vClose'); if (cb) cb.style.display = 'none';
+    const back = document.querySelector('#vDone a[href="/my#earn"]');
+    if (back) back.addEventListener('click', e => { e.preventDefault(); try { window.parent.postMessage({ t: 'iap-view-close' }, location.origin); } catch (x) {} });
+  }
   (async () => {
     const info = await j('/api/my/viewinfo?token=' + token);
     if (info.error) {