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

Promo tools: hook video cards (matched links, downloads, captions, share buttons)

Browse Source 
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-09-10 08:55:29 -05:00
parent 276618dd73
commit f6490c9444
16 changed files with 55 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>
<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="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
<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{color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em}
public/assets/promo.js
+36 -1
View File
@@ -81,6 +81,15 @@ window.IAPPromo = (function () {
return a;
}
// hook videos: one per angle; the matched link continues the same hook on the join page
const VID_BASE = 'https://coolify-saasytop.nyc3.digitaloceanspaces.com/promo/';
const VIDEOS = [
{ angle: 'instant', title: 'Paid before the page reloads', hook: 'What if your commission landed before the thank-you page finished loading?', caption: 'What if your commission landed before the thank-you page finished loading? On InstantAdPay a smart contract splits every ad package the second it sells, straight to wallets, on a public ledger. Free to join by email: {{LINK:instant}}' },
{ angle: 'adspend', title: 'You were buying traffic anyway', hook: 'Every ad dollar you have ever spent went one direction. Out.', caption: 'Every ad dollar you have ever spent went one direction. Out. Here the ad spend in your line pays you back in the same transaction. Seven formats, packages from $5, free to join: {{LINK:adspend}}' },
{ angle: 'free', title: 'Watch first, spend never', hook: 'You can run your first ad campaign here for exactly zero dollars.', caption: 'Run your first ad campaign for exactly zero dollars. Join free by email, earn credits by viewing ads, launch a real campaign, and watch real payouts land on a public ledger before you spend a cent: {{LINK:free}}' },
{ angle: 'ledger', title: 'No back office. No payday.', hook: 'Your last affiliate program paid you on the fifteenth. If it paid you.', caption: 'Your last affiliate program paid you on the fifteenth. If it paid you. Here the payroll is the blockchain: every payout is a public transaction, nothing is held, nobody can change the split. Open the ledger, then join free: {{LINK:ledger}}' },
{ angle: 'two', title: 'Two buyers open level two', hook: 'Two buyers. Then five. That is the whole ladder.', caption: 'Two buyers. Then five. That is the whole ladder. Level 1 pays from your first buyer, two qualifying buyers open level 2, five open level 3, all in the same transaction, straight to your wallet. Free to join: {{LINK:two}}' }
];
function fill(link, me) {
const token = (me && (me.username || me.refCode || me.memberId)) || '';
// invite strip
@@ -128,6 +137,32 @@ window.IAPPromo = (function () {
sw.appendChild(block(text, '<span class="pb-net">' + esc(s.tier) + '</span> <b>' + esc(s.subject) + '</b>'));
}
}
// hook videos
const vw = $('promoVideos');
if (vw && vw.dataset.filled !== link) {
vw.dataset.filled = link; vw.innerHTML = '';
for (const v of VIDEOS) {
const mlink = angleLink(link, v.angle);
const card = document.createElement('div'); card.className = 'pv';
card.innerHTML = '<div class="pv-head"><span class="pb-net">' + esc(v.angle) + ' angle</span> <b>' + esc(v.title) + '</b><div class="muted small">' + esc(v.hook) + '</div></div>'
+ '<video src="' + VID_BASE + v.angle + '.mp4" poster="' + VID_BASE + v.angle + '.jpg" preload="none" controls playsinline style="width:100%;max-width:640px;border-radius:12px;background:#000;margin:10px 0"></video>'
+ '<p class="small"><span class="muted">Matched link:</span> <span class="mono" style="overflow-wrap:anywhere">' + esc(mlink) + '</span></p>';
const row = document.createElement('p'); row.className = 'pb-actions';
row.appendChild(copyBtn(mlink, 'Copy matched link'));
row.appendChild(linkBtn(VID_BASE + v.angle + '.mp4', 'Download 16:9'));
row.appendChild(linkBtn(VID_BASE + v.angle + '-portrait.mp4', 'Download 9:16'));
card.appendChild(row);
const cap = fillLink(v.caption, link);
const extras = [
linkBtn('https://twitter.com/intent/tweet?text=' + encodeURIComponent(cap), 'Post on X'),
linkBtn('https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(mlink), 'Share on Facebook'),
linkBtn('https://t.me/share/url?url=' + encodeURIComponent(mlink) + '&text=' + encodeURIComponent(cap.replace(/https?:\/\/\S+$/, '').trim()), 'Telegram'),
linkBtn('https://wa.me/?text=' + encodeURIComponent(cap), 'WhatsApp')
];
card.appendChild(block(cap, '<span class="lab">Caption</span>', extras));
vw.appendChild(card);
}
}
// objections
const ob = $('promoObjections');
if (ob && ob.dataset.filled !== link) {
@@ -146,5 +181,5 @@ window.IAPPromo = (function () {
}
}
return { fill, POSTS, TEXTS, SWIPES, OBJECTIONS };
return { fill, POSTS, TEXTS, SWIPES, OBJECTIONS, VIDEOS };
})();
public/assets/site.css
+2
View File
@@ -218,6 +218,8 @@ tr:last-child td{border-bottom:0}
.ad-strip a{color:var(--ink)}
.ad-strip b{color:var(--mint)}
.ad-foot{text-align:center}
.pv{border:1px solid var(--line);border-radius:14px;padding:16px 18px;margin:0 0 16px;background:rgba(4,8,7,.35)}
.pv-head b{display:block;font-size:18px;margin:4px 0 2px}
.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 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">
<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="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body>
<div class="wrap">
public/disclaimer.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Disclaimer | InstantAdPay</title>
<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="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body>
<div id="nav"></div>
public/index.html
+1 -1
View File
@@ -20,7 +20,7 @@
<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="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body>
public/join.html
+1 -1
View File
@@ -6,7 +6,7 @@
<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="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
<style>
.jn-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 0}
.jn-hero{padding:14px 0 4px;text-align:left}
public/ledger.html
+1 -1
View File
@@ -17,7 +17,7 @@
<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="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body>
<div class="wrap">
public/my.html
+4 -3
View File
@@ -5,7 +5,7 @@
<title>Member area | InstantAdPay</title>
<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="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body class="bo-body">
@@ -684,8 +684,9 @@
<div class="card promo-sec" id="promo-videos" hidden>
<h3>Hook videos</h3>
<p class="muted small">Short videos, one per angle, each with a matched invite link that lands on a
page continuing the same hook. In production now. When they arrive, this tab holds the previews,
your matched links, and paste-ready captions.</p>
page continuing the same hook. Post the video with the matched link, or download it and use it anywhere.
Every caption below already carries your link.</p>
<div id="promoVideos"></div>
</div>
<div class="card ad-foot" id="adSlotPane-promo" hidden></div>
</div>
public/plays.html
+1 -1
View File
@@ -8,7 +8,7 @@
<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="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
<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 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>
<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="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body>
<div id="nav"></div>
public/shorts.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Shorts | InstantAdPay</title>
<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="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
<style>
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)}
public/terms.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Terms of Service | InstantAdPay</title>
<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="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body>
<div id="nav"></div>
public/tx.html
+1 -1
View File
@@ -5,7 +5,7 @@
<title>Transaction | InstantAdPay</title>
<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="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body>
<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">
<title>Viewing ad — InstantAdPay</title>
<link rel="icon" type="image/png" href="/logo-icon.png">
<link rel="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
<style>
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)}
public/wall.html
+1 -1
View File
@@ -6,7 +6,7 @@
<!--OG-->
<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="stylesheet" href="/assets/site.css?v=20260910g">
<link rel="stylesheet" href="/assets/site.css?v=20260910h">
</head>
<body>
<div id="nav"></div>