marty/instantadpay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Member area: loading spinner instead of flashing the sign-in card

Browse Source 
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-09-10 08:17:55 -05:00
parent 7708e602ae
commit bcc895dc8d
16 changed files with 24 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/admin.html
+1 -1
View File
@@ -6,7 +6,7 @@
<title>Admin | InstantAdPay</title> <title>Admin | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
<style> <style>
.adm-table th,.adm-table td{padding:8px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);font-size:13.5px} .adm-table th,.adm-table td{padding:8px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);font-size:13.5px}
.adm-table th{color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em} .adm-table th{color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em}
public/assets/my.js
+4 -1
View File
@@ -486,7 +486,10 @@
document.getElementById('memberArea').classList.toggle('side-open')); document.getElementById('memberArea').classList.toggle('side-open'));
async function render() { async function render() {
const me = await IAP.refreshNavWallet(); // while /api/me answers, show a spinner instead of flashing the sign-in card at a signed-in member
let me = null;
try { me = await IAP.refreshNavWallet(); } catch (e) { me = null; }
if ($('bootSpin')) $('bootSpin').hidden = true;
// one way in: email. A wallet-only session (no account) is sent back to the // one way in: email. A wallet-only session (no account) is sent back to the
// email card with a finish-setup note; verifying the code links that wallet. // email card with a finish-setup note; verifying the code links that wallet.
const walletOnly = !!(me && me.signedIn && !me.email); const walletOnly = !!(me && me.signedIn && !me.email);
public/assets/site.css
+3
View File
@@ -210,6 +210,9 @@ tr:last-child td{border-bottom:0}
.spend-banner .sub{color:var(--ink);font-size:15px} .spend-banner .sub{color:var(--ink);font-size:15px}
.spend-banner .rates{display:flex;gap:8px 18px;flex-wrap:wrap;justify-content:center;margin-top:12px;font-size:12.5px;color:var(--muted)} .spend-banner .rates{display:flex;gap:8px 18px;flex-wrap:wrap;justify-content:center;margin-top:12px;font-size:12.5px;color:var(--muted)}
.spend-banner .rates b{color:var(--ink)} .spend-banner .rates b{color:var(--ink)}
.boot-spin{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;min-height:60vh}
.boot-spin .ring{width:46px;height:46px;border-radius:50%;border:4px solid rgba(67,232,195,.18);border-top-color:var(--mint);animation:bootspin .9s linear infinite}
@keyframes bootspin{to{transform:rotate(360deg)}}
.done-big{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 16px;text-align:center} .done-big{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 16px;text-align:center}
.done-big .tick{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;font-size:48px;font-weight:800;color:var(--mint-ink);background:var(--mint);box-shadow:0 0 0 10px rgba(67,232,195,.15),0 10px 30px rgba(67,232,195,.35)} .done-big .tick{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;font-size:48px;font-weight:800;color:var(--mint-ink);background:var(--mint);box-shadow:0 0 0 10px rgba(67,232,195,.15),0 10px 30px rgba(67,232,195,.35)}
.done-big b{font-family:var(--disp);font-size:22px;margin-top:8px} .done-big b{font-family:var(--disp);font-size:22px;margin-top:8px}
public/contract.html
+1 -1
View File
@@ -17,7 +17,7 @@
<meta name="theme-color" content="#043b2f"> <meta name="theme-color" content="#043b2f">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body> <body>
<div class="wrap"> <div class="wrap">
public/disclaimer.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Disclaimer | InstantAdPay</title> <title>Disclaimer | InstantAdPay</title>
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body> <body>
<div id="nav"></div> <div id="nav"></div>
public/index.html
+1 -1
View File
@@ -20,7 +20,7 @@
<meta name="theme-color" content="#043b2f"> <meta name="theme-color" content="#043b2f">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body> <body>
public/join.html
+1 -1
View File
@@ -6,7 +6,7 @@
<title>You're invited | InstantAdPay</title> <title>You're invited | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
<style> <style>
.jn-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 0} .jn-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 0}
.jn-hero{padding:34px 0 10px;text-align:left} .jn-hero{padding:34px 0 10px;text-align:left}
public/ledger.html
+1 -1
View File
@@ -17,7 +17,7 @@
<meta name="theme-color" content="#043b2f"> <meta name="theme-color" content="#043b2f">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body> <body>
<div class="wrap"> <div class="wrap">
public/my.html
+4 -3
View File
@@ -5,12 +5,13 @@
<title>Member area | InstantAdPay</title> <title>Member area | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body class="bo-body"> <body class="bo-body">
<!-- ── signed-out: centered auth ─────────────────────────── --> <!-- ── signed-out: centered auth ─────────────────────────── -->
<div id="authArea"> <div id="bootSpin" class="boot-spin" aria-live="polite"><div class="ring"></div><p class="small muted">Loading your account…</p></div>
<div id="authArea" hidden>
<div class="wrap" style="max-width:560px"> <div class="wrap" style="max-width:560px">
<section class="hero" style="padding:64px 0 10px;text-align:left"> <section class="hero" style="padding:64px 0 10px;text-align:left">
<p class="eyebrow">Member area</p> <p class="eyebrow">Member area</p>
@@ -859,7 +860,7 @@
<script src="/assets/common.js?v=20260910b"></script> <script src="/assets/common.js?v=20260910b"></script>
<script src="/assets/wallet.js?v=20260910a"></script> <script src="/assets/wallet.js?v=20260910a"></script>
<script src="/assets/promo.js?v=20260909b"></script> <script src="/assets/promo.js?v=20260909b"></script>
<script src="/assets/my.js?v=20260910h"></script> <script src="/assets/my.js?v=20260910i"></script>
<script src="/assets/chat.js?v=20260907l"></script> <script src="/assets/chat.js?v=20260907l"></script>
</body> </body>
</html> </html>
public/plays.html
+1 -1
View File
@@ -8,7 +8,7 @@
<meta name="theme-color" content="#043b2f"> <meta name="theme-color" content="#043b2f">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
<style> <style>
.pl-rule{border-left:4px solid #f2c94c;background:rgba(242,201,76,.08);padding:16px 20px;border-radius:0 12px 12px 0;margin:0 0 28px} .pl-rule{border-left:4px solid #f2c94c;background:rgba(242,201,76,.08);padding:16px 20px;border-radius:0 12px 12px 0;margin:0 0 28px}
.pl-rule b{font-family:var(--disp);font-size:17px;display:block;margin-bottom:6px} .pl-rule b{font-family:var(--disp);font-size:17px;display:block;margin-bottom:6px}
public/privacy.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Privacy Policy | InstantAdPay</title> <title>Privacy Policy | InstantAdPay</title>
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body> <body>
<div id="nav"></div> <div id="nav"></div>
public/shorts.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Shorts | InstantAdPay</title> <title>Shorts | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
<style> <style>
html,body{height:100%;margin:0;overflow:hidden;background:#000} html,body{height:100%;margin:0;overflow:hidden;background:#000}
.sh{position:fixed;inset:0;display:flex;flex-direction:column;background:#000;color:var(--ink,#e8fff7)} .sh{position:fixed;inset:0;display:flex;flex-direction:column;background:#000;color:var(--ink,#e8fff7)}
public/terms.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Terms of Service | InstantAdPay</title> <title>Terms of Service | InstantAdPay</title>
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body> <body>
<div id="nav"></div> <div id="nav"></div>
public/tx.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Transaction | InstantAdPay</title> <title>Transaction | InstantAdPay</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body> <body>
<div id="nav"></div> <div id="nav"></div>
public/view.html
+1 -1
View File
@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="viewport" content="width=device-width,initial-scale=1">
<title>Viewing ad — InstantAdPay</title> <title>Viewing ad — InstantAdPay</title>
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
<style> <style>
html,body{height:100%;margin:0;overflow:hidden} html,body{height:100%;margin:0;overflow:hidden}
.vw{display:flex;flex-direction:column;height:100vh;height:100dvh;background:var(--bg,#04110c);color:var(--ink,#e8fff7)} .vw{display:flex;flex-direction:column;height:100vh;height:100dvh;background:var(--bg,#04110c);color:var(--ink,#e8fff7)}
public/wall.html
+1 -1
View File
@@ -6,7 +6,7 @@
<!--OG--> <!--OG-->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&display=swap">
<link rel="icon" type="image/png" href="/logo-icon.png"> <link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910e"> <link rel="stylesheet" href="/assets/site.css?v=20260910f">
</head> </head>
<body> <body>
<div id="nav"></div> <div id="nav"></div>