DEV Community: Gift Trust

CONTINENTAL EPICTURE

Gift Trust — Sat, 15 Aug 2026 09:51:39 +0000

Liquid syntax error: Variable '{{% raw %}' was not properly terminated with regexp: /\}\}/

CONTINETAL EPICTURE

Gift Trust — Thu, 13 Aug 2026 06:54:57 +0000

Liquid syntax error: Variable '{{% raw %}' was not properly terminated with regexp: /\}\}/

CONTINENTAL EPICTURE

Gift Trust — Thu, 13 Aug 2026 06:49:47 +0000

Liquid syntax error: Variable '{{% raw %}' was not properly terminated with regexp: /\}\}/

SPACESHOP

Gift Trust — Wed, 12 Aug 2026 20:37:12 +0000

*<!DOCTYPE html>

SPACESHOP — Dashboard

:root{
--ink:#0D0E14; --panel:#12141C; --card:rgba(255,255,255,0.03); --card-b:rgba(255,255,255,0.07);
--line:rgba(255,255,255,0.08); --white:#F7F5F0;
--orange:#FF6A3D; --gold:#F0B429; --mint:#3DDC8A; --blue:#5B8CFF;
--muted:rgba(255,255,255,0.45); --muted2:rgba(255,255,255,0.28);
}
*{box-sizing:border-box;}
body{margin:0;background:var(--ink);color:var(--white);font-family:'Inter',-apple-system,'Segoe UI',Roboto,system-ui,sans-serif;-webkit-font-smoothing:antialiased;}
h1,h2,.brand{font-family:'Space Grotesk','Inter',-apple-system,sans-serif;}
.mono{font-family:'JetBrains Mono','SFMono-Regular',Consolas,monospace;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input,textarea{font-family:inherit;color:inherit;}
::selection{background:var(--orange);color:var(--ink);}

/* ---- layout shells ---- */
.screen{min-height:100vh;}
.hidden{display:none !important;}

/* ---- onboarding ---- */
.onboard{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px;}
.onboard-box{width:100%;max-width:380px;}
.brand-row{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:32px;}
.brand-mark{width:36px;height:36px;border-radius:10px;background:var(--orange);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--ink);font-size:16px;}
.brand-name{font-weight:700;font-size:20px;letter-spacing:-0.02em;}
.onboard h1{font-size:26px;font-weight:700;text-align:center;line-height:1.2;margin:0;}
.onboard p.sub{color:var(--muted);font-size:14px;text-align:center;margin:10px 0 0;line-height:1.5;}
.field{margin-top:14px;}
.field label{display:block;color:rgba(255,255,255,0.55);font-size:12px;font-weight:500;margin-bottom:6px;}
.field input, .field textarea{width:100%;background:rgba(255,255,255,0.05);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:14px;outline:none;transition:border-color .15s;}
.field input:focus, .field textarea:focus{border-color:rgba(255,106,61,0.6);}
.slug-preview{color:var(--muted2);font-size:12px;margin-top:6px;}
.btn-primary{width:100%;margin-top:20px;background:var(--orange);color:var(--ink);font-weight:700;padding:14px;border-radius:12px;font-size:15px;display:flex;align-items:center;justify-content:center;gap:6px;transition:filter .15s, transform .1s;}
.btn-primary:hover{filter:brightness(1.06);}
.btn-primary:active{transform:scale(0.99);}
.hint{color:var(--muted2);font-size:12px;text-align:center;margin-top:14px;}

/* ---- dashboard top bar ---- */
.topbar{position:sticky;top:0;z-index:20;background:rgba(13,14,20,0.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding:14px 20px;display:flex;align-items:center;justify-content:space-between;}
.topbar .brand-row{margin:0;}
.btn-ghost{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,0.06);border:1px solid var(--line);color:var(--white);font-size:13px;font-weight:500;padding:9px 15px;border-radius:999px;transition:background .15s;}
.btn-ghost:hover{background:rgba(255,255,255,0.1);}

.wrap{max-width:960px;margin:0 auto;padding:24px 20px 60px;}

/* ---- shop identity ---- */
.shop-id{display:flex;align-items:center;gap:12px;margin-bottom:22px;}
.shop-avatar{width:48px;height:48px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:18px;color:var(--ink);flex-shrink:0;}
.shop-name{font-weight:700;font-size:20px;line-height:1.2;}
.shop-link{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:13px;background:none;border:none;padding:0;margin-top:2px;}
.shop-link:hover{color:rgba(255,255,255,0.7);}

/* ---- stat cards ---- */
.stats{display:flex;gap:12px;overflow-x:auto;margin-bottom:22px;padding-bottom:2px;}
.stat-card{flex:1;min-width:130px;background:var(--card);border:1px solid var(--card-b);border-radius:16px;padding:14px 16px;}
.stat-top{display:flex;align-items:center;justify-content:space-between;}
.stat-label{color:var(--muted);font-size:12px;font-weight:500;}
.stat-value{font-size:22px;font-weight:700;margin-top:6px;}

/* ---- toolbar ---- */
.toolbar{display:flex;gap:8px;margin-bottom:16px;}
.search-wrap{position:relative;flex:1;}
.search-wrap svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);opacity:0.35;}
.search-wrap input{width:100%;background:rgba(255,255,255,0.04);border:1px solid var(--line);border-radius:12px;padding:11px 14px 11px 38px;font-size:14px;outline:none;}
.search-wrap input:focus{border-color:rgba(255,255,255,0.25);}
.btn-add{display:flex;align-items:center;gap:6px;background:var(--orange);color:var(--ink);font-weight:600;font-size:14px;padding:11px 18px;border-radius:12px;flex-shrink:0;transition:filter .15s, transform .1s;}
.btn-add:hover{filter:brightness(1.06);}
.btn-add:active{transform:scale(0.98);}

/* ---- category pills ---- */
.pills{display:flex;gap:8px;overflow-x:auto;margin-bottom:16px;padding-bottom:2px;}
.pill{display:flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;font-size:13px;font-weight:500;border:1px solid var(--line);color:rgba(255,255,255,0.6);white-space:nowrap;flex-shrink:0;transition:all .15s;}
.pill:hover{border-color:rgba(255,255,255,0.25);color:rgba(255,255,255,0.9);}
.pill.active-all{background:var(--white);color:var(--ink);border-color:var(--white);}

/* ---- listings panel ---- */
.panel{background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.06);border-radius:18px;padding:0 16px;}
.empty{text-align:center;padding:56px 20px;color:var(--muted);font-size:14px;}
.row{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,0.06);}
.row:last-child{border-bottom:none;}
.beacon{width:5px;align-self:stretch;border-radius:4px;flex-shrink:0;min-height:40px;}
.row-body{flex:1;min-width:0;}
.row-title-line{display:flex;align-items:center;gap:8px;}
.row-title{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.badge-sold{font-size:10px;font-weight:700;text-transform:uppercase;color:rgba(255,255,255,0.4);background:rgba(255,255,255,0.06);padding:2px 6px;border-radius:5px;flex-shrink:0;}
.row-meta{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--muted);margin-top:3px;flex-wrap:wrap;}
.row-price{font-size:14px;font-weight:600;flex-shrink:0;}
.row-actions{display:flex;gap:2px;flex-shrink:0;}
.icon-btn{padding:8px;border-radius:8px;color:rgba(255,255,255,0.45);}
.icon-btn:hover{background:rgba(255,255,255,0.08);color:#fff;}
.icon-btn.danger:hover{background:rgba(239,68,68,0.12);color:#f87171;}

/* ---- modals ---- */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,0.7);backdrop-filter:blur(4px);z-index:50;display:flex;align-items:flex-end;justify-content:center;}
@media(min-width:640px){.overlay{align-items:center;}}
.modal{width:100%;max-width:420px;background:#181A24;border:1px solid var(--line);border-radius:24px 24px 0 0;padding:20px 20px 32px;max-height:90vh;overflow-y:auto;animation:slideup .2s ease;}
@media(min-width:640px){.modal{border-radius:24px;padding-bottom:24px;}}
@keyframes slideup{from{transform:translateY(20px);opacity:0;}to{transform:translateY(0);opacity:1;}}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.modal-head h2{font-size:18px;font-weight:700;margin:0;}
.close-btn{color:rgba(255,255,255,0.4);padding:4px;}
.close-btn:hover{color:#fff;}
.cat-grid{display:flex;gap:8px;flex-wrap:wrap;}
.cat-btn{display:flex;align-items:center;gap:6px;padding:9px 13px;border-radius:12px;font-size:13px;font-weight:500;border:1px solid var(--line);color:rgba(255,255,255,0.6);}
.cat-btn.active{color:var(--ink);}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.modal .field textarea{resize:none;}

/* ---- share sheet ---- */
.share-link-box{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,0.05);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-top:14px;}
.share-link-box span{flex:1;font-size:13px;color:rgba(255,255,255,0.7);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.channels{display:flex;gap:8px;margin-top:14px;}
.channel{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 8px;border-radius:12px;background:rgba(255,255,255,0.05);border:1px solid var(--line);transition:background .15s;}
.channel:hover{background:rgba(255,255,255,0.09);}
.channel span{font-size:11px;color:rgba(255,255,255,0.6);}

/* ---- toast ---- */
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;font-size:14px;font-weight:500;background:var(--panel);color:#fff;border:1px solid rgba(255,255,255,0.1);box-shadow:0 10px 30px rgba(0,0,0,0.4);animation:fadeup .2s ease;}
@keyframes fadeup{from{transform:translate(-50%,8px);opacity:0;}to{transform:translate(-50%,0);opacity:1;}}

/* ---- storefront (public view) ---- */
.store-header{border-bottom:1px solid var(--line);padding:32px 20px 22px;}
.store-inner{max-width:720px;margin:0 auto;}
.store-search{position:relative;margin-top:18px;}
.store-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);opacity:0.3;}
.store-search input{width:100%;background:rgba(255,255,255,0.05);border:1px solid var(--line);border-radius:16px;padding:13px 16px 13px 40px;font-size:14px;outline:none;}
.store-grid{display:grid;grid-template-columns:1fr;gap:12px;max-width:720px;margin:24px auto 0;padding:0 20px;}
@media(min-width:640px){.store-grid{grid-template-columns:1fr 1fr;}}
.listing-card{display:flex;gap:10px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:16px;padding:12px;text-align:left;transition:background .15s;}
.listing-card:hover{background:rgba(255,255,255,0.06);}
.lc-title-line{display:flex;justify-content:space-between;gap:8px;}
.lc-title{font-size:15px;font-weight:600;line-height:1.3;}
.lc-desc{color:var(--muted);font-size:13px;margin-top:3px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.lc-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:10px;}
.lc-price{font-size:15px;font-weight:600;}
.lc-views{color:rgba(255,255,255,0.3);font-size:11px;display:flex;align-items:center;gap:4px;}
.footer-tag{text-align:center;padding:32px 0;color:rgba(255,255,255,0.25);font-size:12px;}
.empty-shop{display:flex;align-items:center;justify-content:center;min-height:100vh;text-align:center;padding:24px;}

.wa-btn{margin-top:18px;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;background:#25D366;color:#0b1a10;font-weight:700;padding:14px;border-radius:16px;}
.wa-btn:hover{filter:brightness(0.97);}

/* ===================================================================
SPACESHOP — single-file dashboard + storefront.
All data lives in-memory (window.STATE) for this demo file.
To make it permanent/shareable for real, this same logic drops
into a backend + real domain — see the note at the bottom of chat.
=================================================================== */

const CATEGORIES = {
clothes: { label: "Clothes", color: "#FF6A3D", icon: "shirt" },
food: { label: "Food", color: "#F0B429", icon: "food" },
houses: { label: "Houses", color: "#3DDC8A", icon: "house" },
appliances: { label: "Appliances", color: "#5B8CFF", icon: "bolt" },
};

const ICONS = {
shirt: '<path d="M16 4l4 3-2 3-2-1.5V20H8V8.5L6 10 4 7l4-3 2 2h4z"/>',
food: '<path d="M6 2v6a3 3 0 003 3v11M6 2v6M10 2v6M6 8h4M18 2c-2 2-3 4-3 7 0 2 1 3 3 3v9"/>',
house: '<path d="M3 11l9-8 9 8M5 10v10h14V10"/>',
bolt: '<path d="M13 2L4 14h6l-1 8 9-12h-6l1-8z"/>',
search: '<circle cx="11" cy="11" r="7"/><path d="M21 21l-4.3-4.3"/>',
eye: '<path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7z"/><circle cx="12" cy="12" r="3"/>',
plus: '<path d="M12 5v14M5 12h14"/>',
x: '<path d="M18 6L6 18M6 6l12 12"/>',
edit: '<path d="M12 20h9"/><path d="M16.5 3.5a2.1 2.1 0 013 3L7 19l-4 1 1-4L16.5 3.5z"/>',
trash: '<path d="M3 6h18M8 6V4a2 2 0 012-2h4a2 2 0 012 2v2m3 0l-1 14a2 2 0 01-2 2H7a2 2 0 01-2-2L4 6"/>',
share: '<circle cx="18" cy="5" r="3"/><circle cx="6" cy="12" r="3"/><circle cx="18" cy="19" r="3"/><path d="M8.6 13.5l6.8 4M15.4 6.5l-6.8 4"/>',
copy: '<rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1"/>',
check: '<path d="M20 6L9 17l-5-5"/>',
pkg: '<path d="M21 8l-9-5-9 5v8l9 5 9-5V8z"/><path d="M3 8l9 5 9-5M12 13v8"/>',
chart: '<path d="M3 3v18h18M18 9l-5 5-3-3-4 4"/>',
store: '<path d="M3 9l1-5h16l1 5M4 9v11h16V9M4 9h16M9 20v-6h6v6"/>',
chevron: '<path d="M9 18l6-6-6-6"/>',
sparkle: '<path d="M12 2l1.5 6.5L20 10l-6.5 1.5L12 18l-1.5-6.5L4 10l6.5-1.5L12 2z"/>',
wa: '<path d="M17 3a10 10 0 00-14.7 13L2 21l5.2-1.4A10 10 0 1017 3z"/><path d="M8.5 8.5c0 4 3 7 7 7"/>',
twitter: '<path d="M22 4.5c-.8.4-1.6.6-2.5.8a4.3 4.3 0 001.9-2.4c-.9.5-1.8.9-2.8 1.1A4.3 4.3 0 0012 7c0 .3 0 .7.1 1A12.2 12.2 0 013 3.3a4.3 4.3 0 001.3 5.7c-.7 0-1.4-.2-2-.5v.1c0 2.1 1.5 3.8 3.4 4.2-.6.2-1.3.2-1.9.1a4.3 4.3 0 004 3A8.6 8.6 0 012 18a12.1 12.1 0 006.6 1.9c7.9 0 12.2-6.6 12.2-12.2v-.6c.8-.6 1.5-1.4 2.2-2.2z"/>',
fb: '<path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"/>',
alert: '<circle cx="12" cy="12" r="10"/><path d="M12 8v4M12 16h.01"/>',
imgoff: '<path d="M3 3l18 18M10.5 10.5a2 2 0 002.9 2.9M21 15V5a2 2 0 00-2-2H8m-5 4v12a2 2 0 002 2h12"/>',
};

function icon(name, size=15, extra=""){
return <svg width="${size}" height="${size}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="${extra}">${ICONS[name]}</svg>;
}

/* ---- in-memory "database" (per-browser-tab demo store) ---- */
const DB = { shops: {}, slugs: {} };

async function reserveUniqueSlug(base){
let candidate = slugify(base), n = 1;
while (DB.slugs[candidate]) { n++; candidate = slugify(base) + "-" + n; }
return candidate;
}

const SEED = () => ([
{ id: uid(), name: "Ankara Wrap Dress", category: "clothes", price: 15000, desc: "Handmade wrap dress, true to size, machine washable.", stock: 8, views: 142, createdAt: Date.now() - 86400000*2 },
{ id: uid(), name: "Jollof Rice (Party Pack)", category: "food", price: 8000, desc: "Serves 5. Smoky party jollof, made fresh on order.", stock: 20, views: 310, createdAt: Date.now() - 3600000*5 },
{ id: uid(), name: "2 Bedroom Flat, Lekki", category: "houses", price: 1800000, desc: "Newly renovated, self-compound, 24/7 light.", stock: 1, views: 502, createdAt: Date.now() - 86400000*6 },
{ id: uid(), name: "Standing Fan 18-inch", category: "appliances", price: 22000, desc: "Brand new, 1 year warranty, 3-speed.", stock: 12, views: 88, createdAt: Date.now() - 86400000 },
]);

/* ---------------- Toast ---------------- */
function showToast(msg, kind="ok"){
const old = document.querySelector(".toast");
if (old) old.remove();
const t = document.createElement("div");
t.className = "toast";
t.innerHTML = (kind==="ok" ? icon("check",14) : icon("alert",14)) + <span>${escapeHtml(msg)}</span>;
document.body.appendChild(t);
setTimeout(()=>t.remove(), 2600);
}

/* ---------------- App state / router ---------------- */
const App = {
view: "onboard", // onboard | dashboard | storefront
shopId: null,
storeQuery: "",
storeCat: "all",
dashQuery: "",
dashCat: "all",
activeListing: null,
};

const root = document.getElementById("root");

function render(){
if (App.view === "onboard") root.innerHTML = renderOnboard();
else if (App.view === "dashboard") root.innerHTML = renderDashboard();
else if (App.view === "storefront") root.innerHTML = renderStorefront();
bindEvents();
}

/* ================= ONBOARDING ================= */
function renderOnboard(){
return <div class="screen onboard"> <div class="onboard-box"> <div class="brand-row"> <div class="brand-mark">${icon("sparkle",17)}</div> <div class="brand-name">SPACESHOP</div> </div> <h1>Open your shop</h1> <p class="sub">Sell clothes, food, houses, or appliances. Get one link that opens anywhere — WhatsApp, Instagram, Facebook, X.</p> <div class="field"> <label>Shop name</label> <input id="in-name" placeholder="e.g. Chidera's Closet" autofocus /> <div class="slug-preview" id="slug-preview"></div> </div> <div class="field"> <label>WhatsApp number (for orders)</label> <input id="in-wa" placeholder="e.g. 2348012345678" /> </div> <button class="btn-primary" id="btn-create">Create my shop ${icon("chevron",16)}</button> <p class="hint">We'll drop in a few sample listings to start you off.</p> </div> </div>;
}

/* ================= DASHBOARD ================= */
function renderDashboard(){
const shop = DB.shops[App.shopId];
const listings = shop.listings;
const q = App.dashQuery.trim().toLowerCase();
const filtered = listings
.filter(l => App.dashCat === "all" || l.category === App.dashCat)
.filter(l => !q || l.name.toLowerCase().includes(q))
.sort((a,b) => b.createdAt - a.createdAt);

const totalViews = listings.reduce((s,l)=>s+(l.views||0),0);
const inStock = listings.filter(l=>l.stock>0).length;
const totalValue = listings.reduce((s,l)=>s+l.price*l.stock,0);
const counts = {};
listings.forEach(l => counts[l.category] = (counts[l.category]||0)+1);

return `
<div class="screen">
<div class="topbar">
<div class="brand-row"><div class="brand-mark">${icon("sparkle",15)}</div><span class="brand-name" style="font-size:16px;">SPACESHOP</span></div>
<button class="btn-ghost" id="btn-share">${icon("share",14)} Share shop</button>
</div>
<div class="wrap">
<div class="shop-id">
<div class="shop-avatar" style="background:${shop.color}">${escapeHtml(shop.name[0].toUpperCase())}</div>
<div>
<div class="shop-name">${escapeHtml(shop.name)}</div>
<button class="shop-link" id="btn-copy-link">/${escapeHtml(shop.slug)} ${icon("copy",11)}</button>
</div>
</div>

  &lt;div class="stats"&gt;
    &lt;div class="stat-card"&gt;&lt;div class="stat-top"&gt;&lt;span class="stat-label"&gt;Listings&lt;/span&gt;${icon("pkg",14,"color:#FF6A3D")}&lt;/div&gt;&lt;div class="stat-value mono"&gt;${listings.length}&lt;/div&gt;&lt;/div&gt;
    &lt;div class="stat-card"&gt;&lt;div class="stat-top"&gt;&lt;span class="stat-label"&gt;Total views&lt;/span&gt;${icon("eye",14,"color:#5B8CFF")}&lt;/div&gt;&lt;div class="stat-value mono"&gt;${totalViews}&lt;/div&gt;&lt;/div&gt;
    &lt;div class="stat-card"&gt;&lt;div class="stat-top"&gt;&lt;span class="stat-label"&gt;In stock&lt;/span&gt;${icon("chart",14,"color:#3DDC8A")}&lt;/div&gt;&lt;div class="stat-value mono"&gt;${inStock}&lt;/div&gt;&lt;/div&gt;
    &lt;div class="stat-card"&gt;&lt;div class="stat-top"&gt;&lt;span class="stat-label"&gt;Inventory value&lt;/span&gt;${icon("store",14,"color:#F0B429")}&lt;/div&gt;&lt;div class="stat-value mono"&gt;${formatNaira(totalValue)}&lt;/div&gt;&lt;/div&gt;
  &lt;/div&gt;

  &lt;div class="toolbar"&gt;
    &lt;div class="search-wrap"&gt;${icon("search",15)}&lt;input id="dash-search" placeholder="Search your listings…" value="${escapeHtml(App.dashQuery)}" /&gt;&lt;/div&gt;
    &lt;button class="btn-add" id="btn-add-listing"&gt;${icon("plus",16)} Add listing&lt;/button&gt;
  &lt;/div&gt;

  &lt;div class="pills"&gt;
    &lt;button class="pill ${App.dashCat==='all'?'active-all':''}" data-cat="all"&gt;All · ${listings.length}&lt;/button&gt;
    ${Object.entries(CATEGORIES).map(([k,c])=&gt;`
      &lt;button class="pill" data-cat="${k}" style="${App.dashCat===k?`background:${c.color};border-color:${c.color};color:#12141C`:''}"&gt;
        ${icon(c.icon,13)} ${c.label} · ${counts[k]||0}
      &lt;/button&gt;`).join("")}
  &lt;/div&gt;

  &lt;div class="panel"&gt;
    ${filtered.length === 0 ? `
      &lt;div class="empty"&gt;${icon("pkg",28,"opacity:.25;margin-bottom:10px")}&lt;div&gt;${listings.length===0 ? "No listings yet — add your first one" : "Nothing matches that search"}&lt;/div&gt;&lt;/div&gt;
    ` : filtered.map(l =&gt; renderRow(l)).join("")}
  &lt;/div&gt;
&lt;/div&gt;

</div>`;
}

/* ================= LISTING FORM MODAL ================= */
function openListingModal(listing){
const isEdit = !!listing;
const f = listing || { name:"", category:"clothes", price:"", desc:"", stock:1 };
const modal = document.createElement("div");
modal.className = "overlay";
modal.innerHTML = <div class="modal"> <div class="modal-head"><h2>${isEdit?"Edit listing":"New listing"}</h2><button class="close-btn" id="modal-close">${icon("x",18)}</button></div> <div class="field"><label>Item name</label><input id="f-name" placeholder="e.g. Leather Sneakers" value="${escapeHtml(f.name)}" /></div> <div class="field"><label>Category</label> <div class="cat-grid"> ${Object.entries(CATEGORIES).map(([k,c])=>
<button class="cat-btn" data-cat="${k}" style="${f.category===k?background:${c.color};border-color:${c.color};color:#12141C:''}">${icon(c.icon,13)} ${c.label}</button>
).join("")} </div> </div> <div class="two-col"> <div class="field"><label>Price (₦)</label><input id="f-price" type="number" placeholder="15000" class="mono" value="${f.price}" /></div> <div class="field"><label>Stock</label><input id="f-stock" type="number" placeholder="10" class="mono" value="${f.stock}" /></div> </div> <div class="field"><label>Description</label><textarea id="f-desc" rows="3" placeholder="What buyers should know…">${escapeHtml(f.desc)}</textarea></div> <button class="btn-primary" id="modal-save">${isEdit?"Save changes":"Add listing"}</button> </div>;
document.body.appendChild(modal);

modal.addEventListener("click", (e) => { if (e.target === modal) modal.remove(); });
modal.querySelector("#modal-close").addEventListener("click", () => modal.remove());
modal.querySelector("#modal-save").addEventListener("click", () => {
const name = modal.querySelector("#f-name").value.trim();
const price = Number(modal.querySelector("#f-price").value);
if (!name || !price) { showToast("Add a name and price first", "err"); return; }
const shop = DB.shops[App.shopId];
const newListing = {
id: listing ? listing.id : uid(),
name, category: selectedCat,
price, stock: Number(modal.querySelector("#f-stock").value) || 0,
desc: modal.querySelector("#f-desc").value.trim(),
views: listing ? listing.views : 0,
createdAt: listing ? listing.createdAt : Date.now(),
};
if (listing) {
shop.listings = shop.listings.map(l => l.id === listing.id ? newListing : l);
showToast("Listing updated");
} else {
shop.listings = [newListing, ...shop.listings];
showToast("Listing added");
}
modal.remove();
render();
});
}

/* ================= SHARE MODAL ================= */
function openShareModal(){
const shop = DB.shops[App.shopId];
const link = window.location.origin + window.location.pathname + "#/s/" + shop.slug;
const shareMsg = encodeURIComponent(Check out ${shop.name} on SPACESHOP 🛍️ ${link});
const modal = document.createElement("div");
modal.className = "overlay";
modal.innerHTML = <div class="modal"> <div class="modal-head"><h2>Share your shop</h2><button class="close-btn" id="modal-close">${icon("x",18)}</button></div> <p style="color:rgba(255,255,255,0.4);font-size:13px;margin:0 0 4px;">Anyone who opens this link sees your storefront.</p> <div class="share-link-box"><span>${escapeHtml(link)}</span><button id="btn-copy2">${icon("copy",15)}</button></div> <div class="channels"> <a class="channel" target="_blank" href="https://wa.me/?text=${shareMsg}">${icon("wa",18,"color:#25D366")}<span>WhatsApp</span></a> <a class="channel" target="_blank" href="https://twitter.com/intent/tweet?text=${shareMsg}">${icon("twitter",18)}<span>X / Twitter</span></a> <a class="channel" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=${encodeURIComponent(link)}">${icon("fb",18,"color:#1877F2")}<span>Facebook</span></a> </div> <p style="color:rgba(255,255,255,0.25);font-size:11px;text-align:center;margin-top:14px;">Instagram doesn't allow direct share links — paste the link into your bio or story instead.</p> </div>;
document.body.appendChild(modal);
modal.addEventListener("click", (e)=>{ if (e.target===modal) modal.remove(); });
modal.querySelector("#modal-close").addEventListener("click", ()=>modal.remove());
modal.querySelector("#btn-copy2").addEventListener("click", async ()=>{
try { await navigator.clipboard.writeText(link); showToast("Link copied"); }
catch { showToast("Couldn't copy — select manually", "err"); }
});
}

/* ================= STOREFRONT (public buyer view) ================= */
function renderStorefront(){
const shop = DB.shops[App.shopId];
if (!shop) {
return <div class="empty-shop"> <div> <div style="width:56px;height:56px;border-radius:16px;background:rgba(255,255,255,0.05);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;">${icon("imgoff",22,"opacity:.3")}</div> <h1 style="font-size:18px;font-weight:700;margin:0;">This shop link doesn't exist</h1> <p style="color:rgba(255,255,255,0.4);font-size:14px;margin-top:6px;">It may have been removed, or the link was typed wrong.</p> </div> </div>;
}
const ranked = rankListings(shop.listings, App.storeQuery, App.storeCat);
const counts = {};
shop.listings.forEach(l => counts[l.category] = (counts[l.category]||0)+1);

return <div class="screen"> <div class="store-header"> <div class="store-inner"> <div class="shop-id" style="margin-bottom:0;"> <div class="shop-avatar" style="background:${shop.color}">${escapeHtml(shop.name[0].toUpperCase())}</div> <div> <div class="shop-name">${escapeHtml(shop.name)}</div> <div style="color:rgba(255,255,255,0.4);font-size:13px;">Powered by SPACESHOP</div> </div> </div> <div class="store-search">${icon("search",16)}<input id="store-search" placeholder="Search this shop…" value="${escapeHtml(App.storeQuery)}" /></div> <div class="pills" style="margin-top:14px;"> <button class="pill ${App.storeCat==='all'?'active-all':''}" data-cat="all">All · ${shop.listings.length}</button> ${Object.entries(CATEGORIES).map(([k,c])=>
<button class="pill" data-cat="${k}" style="${App.storeCat===k?background:${c.color};border-color:${c.color};color:#12141C:''}">${icon(c.icon,13)} ${c.label} · ${counts[k]||0}</button>
).join("")} </div> </div> </div> <div class="store-grid"> ${ranked.length === 0 ?<div class="empty" style="grid-column:1/-1;">${App.storeQuery ? No results for "${escapeHtml(App.storeQuery)}" : "No listings yet in this category"}</div>: ranked.map(l => renderListingCard(l)).join("")} </div> <div class="footer-tag">Built with <strong style="color:rgba(255,255,255,0.4)">SPACESHOP</strong> — a shop that opens with just a link</div> </div>;
}

/* ================= EVENT BINDING ================= */
function bindEvents(){
if (App.view === "onboard") {
const nameInput = document.getElementById("in-name");
nameInput.addEventListener("input", () => {
document.getElementById("slug-preview").textContent = nameInput.value ? "yoursite.com/#/s/" + slugify(nameInput.value) : "";
});
document.getElementById("btn-create").addEventListener("click", async () => {
const name = nameInput.value.trim();
const wa = document.getElementById("in-wa").value.trim();
if (!name) { showToast("Give your shop a name first", "err"); return; }
const slug = await reserveUniqueSlug(name);
const id = uid();
const shop = { id, name, whatsapp: wa, slug, color: "#FF6A3D", listings: SEED(), createdAt: Date.now() };
DB.shops[id] = shop;
DB.slugs[slug] = id;
App.shopId = id;
App.view = "dashboard";
window.location.hash = "#/dash/" + id;
render();
});
return;
}

if (App.view === "dashboard") {
document.getElementById("dash-search").addEventListener("input", (e) => { App.dashQuery = e.target.value; render(); });
document.querySelectorAll(".pill").forEach(p => p.addEventListener("click", () => { App.dashCat = p.dataset.cat; render(); }));
document.getElementById("btn-add-listing").addEventListener("click", () => openListingModal(null));
document.getElementById("btn-share").addEventListener("click", openShareModal);
document.getElementById("btn-copy-link").addEventListener("click", async () => {
const shop = DB.shops[App.shopId];
const link = window.location.origin + window.location.pathname + "#/s/" + shop.slug;
try { await navigator.clipboard.writeText(link); showToast("Link copied"); } catch { showToast("Couldn't copy", "err"); }
});
document.querySelectorAll(".btn-edit").forEach(b => b.addEventListener("click", () => {
const shop = DB.shops[App.shopId];
const listing = shop.listings.find(l => l.id === b.dataset.id);
openListingModal(listing);
}));
document.querySelectorAll(".btn-delete").forEach(b => b.addEventListener("click", () => {
const shop = DB.shops[App.shopId];
shop.listings = shop.listings.filter(l => l.id !== b.dataset.id);
showToast("Listing removed");
render();
}));
// preserve focus/cursor on search re-render
const s = document.getElementById("dash-search");
if (s && document.activeElement !== s && App.dashQuery) { /* no-op, cursor UX best-effort in vanilla JS */ }
return;
}

if (App.view === "storefront") {
const search = document.getElementById("store-search");
if (search) search.addEventListener("input", (e) => { App.storeQuery = e.target.value; render(); document.getElementById("store-search").focus(); });
document.querySelectorAll(".pill").forEach(p => p.addEventListener("click", () => { App.storeCat = p.dataset.cat; render(); }));
document.querySelectorAll(".listing-card").forEach(card => card.addEventListener("click", () => {
const shop = DB.shops[App.shopId];
const listing = shop.listings.find(l => l.id === card.dataset.id);
openListingSheet(listing);
}));
}
}

/* ================= ROUTER ================= */
function handleRoute(){
const hash = window.location.hash;
const storeMatch = hash.match(/^#\/s\/(.+)$/);
const dashMatch = hash.match(/^#\/dash\/(.+)$/);

if (storeMatch) {
const slug = storeMatch[1];
App.shopId = DB.slugs[slug] || null;
App.view = "storefront";
} else if (dashMatch && DB.shops[dashMatch[1]]) {
App.shopId = dashMatch[1];
App.view = "dashboard";
} else if (!App.shopId) {
App.view = "onboard";
}
render();
}

window.addEventListener("hashchange", handleRoute);
handleRoute();

is a submission for DEV's Summer Bug Smash: Smash Stories powered by Sentry.*

AIRTIMES GLOBAL

Gift Trust — Mon, 03 Aug 2026 19:32:03 +0000

This is a submission for DEV's Summer Bug Smash: Smash Stories powered by Sentry.
<!DOCTYPE html>

AIRTIMES — Global Network of Data & Free Services

:root {
--bg: #020508; --sf: #060d14; --sf2: #0a1520;
--ac: #00ffe0; --ac2: #0077ff; --ac3: #ff4d6d;
--gd: #f5c518; --gd2: #ff9f00;
--tx: #c8e8ff; --mt: #3a5570;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: var(--bg); color: var(--tx); font-family: 'Space Mono', monospace; overflow-x: hidden; }

.bg-layer { position: fixed; inset: 0; z-index: 0; pointer-events: none;
background: radial-gradient(ellipse 80% 60% at 20% 10%, rgba(0,119,255,.07), transparent 70%),
radial-gradient(ellipse 60% 50% at 80% 80%, rgba(0,255,224,.06), transparent 70%),
radial-gradient(ellipse 40% 40% at 50% 50%, rgba(245,197,24,.03), transparent 70%); }
.grid-overlay { position: fixed; inset: 0; z-index: 0; pointer-events: none;
background-image: linear-gradient(rgba(0,255,224,.04) 1px, transparent 1px),
linear-gradient(90deg, rgba(0,255,224,.04) 1px, transparent 1px);
background-size: 48px 48px; animation: gridDrift 30s linear infinite; }
@keyframes gridDrift { to { background-position: 48px 48px; } }
.scanline { position: fixed; inset: 0; z-index: 1; pointer-events: none;
background: repeating-linear-gradient(to bottom, transparent 0, transparent 3px, rgba(0,0,0,.06) 3px, rgba(0,0,0,.06) 4px); }
.shell { position: relative; z-index: 2; }

/* NAV */
nav { display: flex; align-items: center; justify-content: space-between;
padding: 15px 38px; border-bottom: 1px solid rgba(0,255,224,.1);
backdrop-filter: blur(14px); position: sticky; top: 0; z-index: 200; background: rgba(2,5,8,.9); }
.logo { font-family: 'Bebas Neue'; font-size: 1.85rem; letter-spacing: .25em;
color: var(--ac); text-shadow: 0 0 24px rgba(0,255,224,.5); cursor: pointer; position: relative; }
.logo::after { content: '●'; font-size: .35em; color: var(--ac3);
position: absolute; top: 4px; right: -14px; animation: blink 1.4s step-end infinite; }
@keyframes blink { 50% { opacity: 0; } }
.nl { display: flex; gap: 22px; list-style: none; }
.nl a { color: var(--mt); text-decoration: none; font-size: .65rem; letter-spacing: .14em;
text-transform: uppercase; transition: color .2s; cursor: pointer; }
.nl a:hover { color: var(--ac); }
.nl a.ga { color: var(--gd); }
.nl a.ga:hover { color: var(--gd2); }
.sp { display: flex; align-items: center; gap: 8px; font-size: .6rem; color: var(--ac); letter-spacing: .12em; }
.pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--ac);
box-shadow: 0 0 8px var(--ac); animation: blink 1.4s step-end infinite; }

/* TABS */
.tab-bar { display: flex; border-bottom: 1px solid rgba(0,255,224,.08); background: rgba(2,5,8,.75);
position: sticky; top: 61px; z-index: 100; backdrop-filter: blur(10px); overflow-x: auto; }
.tab { padding: 13px 22px; font-size: .62rem; letter-spacing: .15em; text-transform: uppercase;
color: var(--mt); cursor: pointer; border-bottom: 2px solid transparent; transition: all .25s; white-space: nowrap; flex-shrink: 0; }
.tab:hover { color: var(--tx); }
.tab.active { color: var(--ac); border-bottom-color: var(--ac); }
.tab.gt { color: rgba(245,197,24,.5); }
.tab.gt:hover { color: var(--gd); }
.tab.gt.active { color: var(--gd); border-bottom-color: var(--gd); }

/* PAGES */
.page { display: none; animation: pi .3s ease; }
.page.active { display: block; }
@keyframes pi { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.sec { max-width: 1300px; margin: 0 auto; padding: 56px 40px; }
.sl { font-size: .58rem; color: var(--ac); letter-spacing: .28em; text-transform: uppercase; margin-bottom: 8px; }
.sl.gd { color: var(--gd); }
.st { font-family: 'Bebas Neue'; font-size: 2.8rem; color: #fff; letter-spacing: .05em; margin-bottom: 28px; line-height: 1; }
.sub { font-size: .76rem; color: var(--mt); line-height: 1.9; max-width: 640px; margin-bottom: 36px; }

/* HERO */
.hero { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center;
padding: 76px 40px 56px; max-width: 1300px; margin: 0 auto; }
.htag { font-size: .62rem; letter-spacing: .24em; text-transform: uppercase;
color: var(--ac2); margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.htag::before { content: ''; width: 30px; height: 1px; background: var(--ac2); }
h1 { font-family: 'Bebas Neue'; font-size: clamp(3.2rem,6.5vw,6rem);
line-height: .92; letter-spacing: .05em; color: #fff; margin-bottom: 20px; }
h1 .t { color: var(--ac); text-shadow: 0 0 25px rgba(0,255,224,.4); }
h1 .r { color: var(--ac3); }
h1 .g { color: var(--gd); }
.hd { font-size: .78rem; line-height: 1.9; color: var(--mt); max-width: 420px; margin-bottom: 32px; }
.ha { display: flex; gap: 10px; flex-wrap: wrap; }

/* BUTTONS */
.btn { border: none; padding: 12px 24px; font-family: 'Space Mono'; font-size: .68rem;
font-weight: 700; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: all .25s; }
.bp { background: var(--ac); color: #000; clip-path: polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%); }
.bp:hover { box-shadow: 0 0 28px rgba(0,255,224,.3); transform: translateY(-2px); }
.bg { background: var(--gd); color: #000; clip-path: polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%); }
.bg:hover { box-shadow: 0 0 28px rgba(245,197,24,.3); transform: translateY(-2px); }
.bs { background: transparent; color: var(--tx); border: 1px solid var(--mt); }
.bs:hover { border-color: var(--ac); color: var(--ac); }
.bsm { padding: 8px 16px; font-size: .6rem; }

/* GLOBE */
.gw { position: relative; display: flex; align-items: center; justify-content: center; height: 400px; }
.globe { width: 290px; height: 290px; border-radius: 50%;
background: radial-gradient(circle at 35% 35%, rgba(0,119,255,.25), transparent 60%),
radial-gradient(circle at 50% 50%, #020d1a 40%, #010608 100%);
border: 1px solid rgba(0,255,224,.15);
box-shadow: 0 0 80px rgba(0,119,255,.2), inset 0 0 60px rgba(0,119,255,.1);
animation: gp 6s ease-in-out infinite; }
@keyframes gp { 50% { box-shadow: 0 0 120px rgba(0,119,255,.35), inset 0 0 80px rgba(0,119,255,.15); } }
.orb { position: absolute; border-radius: 50%; border: 1px solid rgba(0,255,224,.12); }
.o1 { width: 370px; height: 370px; animation: os 12s linear infinite; }
.o2 { width: 450px; height: 450px; border-color: rgba(0,119,255,.08); animation: os 20s linear infinite reverse; }
@keyframes os { to { transform: rotate(360deg); } }
.on { position: absolute; width: 8px; height: 8px; border-radius: 50%;
background: var(--ac); box-shadow: 0 0 12px var(--ac); top: -4px; left: 50%; transform: translateX(-50%); }
.o2 .on { background: var(--ac2); box-shadow: 0 0 12px var(--ac2); }
.sig { position: absolute; top: 50%; left: 50%; height: 1px;
background: linear-gradient(90deg, rgba(0,255,224,.5), transparent);
transform-origin: left; animation: sp 3s ease-in-out infinite; }
@keyframes sp { 0% { opacity: 0; width: 0; } 40% { opacity: 1; } 100% { opacity: 0; width: 150px; } }
.s1 { transform: rotate(35deg); }
.s2 { transform: rotate(135deg); animation-delay: .8s; }
.s3 { transform: rotate(220deg); animation-delay: 1.6s; }
.s4 { transform: rotate(310deg); animation-delay: 2.4s; }
.db { position: absolute; background: rgba(6,13,20,.92); border: 1px solid rgba(0,255,224,.2);
padding: 7px 12px; font-size: .57rem; color: var(--ac); letter-spacing: .1em;
backdrop-filter: blur(8px); animation: fu 4s ease-in-out infinite; }
.db.b1 { top: 46px; left: 4px; }
.db.b2 { bottom: 66px; right: -2px; animation-delay: 1.5s; color: var(--ac2); border-color: rgba(0,119,255,.3); }
.db.b3 { top: 166px; right: -4px; animation-delay: .8s; color: var(--gd); border-color: rgba(245,197,24,.3); }
@keyframes fu { 50% { transform: translateY(-8px); } }

/* TICKER */
.tw { overflow: hidden; padding: 10px 0; border-top: 1px solid rgba(0,255,224,.07);
border-bottom: 1px solid rgba(0,255,224,.07); background: rgba(0,255,224,.02); }
.tt { display: flex; gap: 56px; white-space: nowrap; animation: ts 35s linear infinite; }
@keyframes ts { to { transform: translateX(-50%); } }
.ti { display: flex; align-items: center; gap: 10px; font-size: .62rem;
letter-spacing: .14em; text-transform: uppercase; color: var(--mt); }
.dot { width: 5px; height: 5px; border-radius: 50%; background: var(--ac); }
.dot.gd { background: var(--gd); }

/* STATS ROW */
.sr { max-width: 1300px; margin: 50px auto; padding: 0 40px;
display: grid; grid-template-columns: repeat(4,1fr); gap: 2px; }
.sc { background: var(--sf); border: 1px solid rgba(0,255,224,.08);
padding: 26px 22px; position: relative; overflow: hidden; transition: border-color .3s; }
.sc:hover { border-color: rgba(0,255,224,.2); }
.sc::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
background: linear-gradient(90deg, transparent, var(--ac), transparent); opacity: 0; transition: opacity .3s; }
.sc:hover::before { opacity: 1; }
.sn { font-family: 'Bebas Neue'; font-size: 2.6rem; color: var(--ac); line-height: 1; margin-bottom: 4px; }
.sn.b { color: var(--ac2); } .sn.r { color: var(--ac3); } .sn.gd { color: var(--gd); }
.sl2 { font-size: .56rem; color: var(--mt); letter-spacing: .18em; text-transform: uppercase; }

/* CARDS */
.cg { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; }
.card { background: var(--sf); border: 1px solid rgba(0,255,224,.07);
padding: 30px 24px; position: relative; overflow: hidden; cursor: pointer; transition: all .3s; }
.card:hover { background: var(--sf2); border-color: rgba(0,255,224,.2); transform: translateY(-3px); }
.card::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
background: linear-gradient(90deg, var(--ac2), var(--ac));
transform: scaleX(0); transform-origin: left; transition: transform .4s; }
.card:hover::after { transform: scaleX(1); }
.ci { font-size: 1.7rem; margin-bottom: 16px; }
.cn { font-family: 'Syne'; font-size: .95rem; font-weight: 700; color: #fff; margin-bottom: 8px; }
.cd { font-size: .68rem; line-height: 1.8; color: var(--mt); }
.ctag { display: inline-block; margin-top: 14px; font-size: .54rem; letter-spacing: .17em;
text-transform: uppercase; color: var(--ac); border: 1px solid rgba(0,255,224,.2); padding: 3px 9px; }
.ctag.b { color: var(--ac2); border-color: rgba(0,119,255,.25); }
.ctag.r { color: var(--ac3); border-color: rgba(255,77,109,.25); }
.ctag.gd { color: var(--gd); border-color: rgba(245,197,24,.25); }

/* FORMS */
.fp { background: var(--sf); border: 1px solid rgba(0,255,224,.1); padding: 32px; }
.fp.gp { border-color: rgba(245,197,24,.2); }
.fg { margin-bottom: 14px; }
.fl { font-size: .56rem; color: var(--mt); letter-spacing: .2em; text-transform: uppercase; margin-bottom: 6px; display: block; }
.fi { background: rgba(0,255,224,.03); border: 1px solid rgba(0,255,224,.15);
color: var(--tx); padding: 10px 14px; font-family: 'Space Mono'; font-size: .7rem;
outline: none; width: 100%; transition: border-color .2s; }
.fi:focus { border-color: var(--ac); }
.fi.gi { border-color: rgba(245,197,24,.2); }
.fi.gi:focus { border-color: var(--gd); }
.fi::placeholder { color: var(--mt); }
select.fi option { background: #020508; }
.rb { margin-top: 16px; background: rgba(0,255,224,.03); border: 1px solid rgba(0,255,224,.15);
padding: 16px; font-size: .67rem; line-height: 2.2; display: none; }
.rb.show { display: block; }
.rb.gb { border-color: rgba(245,197,24,.2); background: rgba(245,197,24,.02); }
.rk { color: var(--mt); } .rv { color: var(--ac); }
.rv.gd { color: var(--gd); } .rv.g { color: #4ade80; }

/* WALLET GRID */
.wg { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; margin-bottom: 28px; }
.wc { background: var(--sf); border: 1px solid rgba(245,197,24,.12);
padding: 22px 16px; text-align: center; cursor: pointer; transition: all .3s; position: relative; }
.wc:hover { border-color: rgba(245,197,24,.4); background: rgba(245,197,24,.04); }
.wc.sel { border-color: var(--gd); background: rgba(245,197,24,.06); }
.wc.sel::before { content: '✓'; position: absolute; top: 7px; right: 9px; font-size: .58rem; color: var(--gd); }
.wi { font-size: 1.9rem; margin-bottom: 7px; }
.wco { font-family: 'Bebas Neue'; font-size: 1.15rem; color: var(--gd); letter-spacing: .1em; }
.wna { font-size: .55rem; color: var(--mt); letter-spacing: .1em; margin-top: 2px; }
.wad { font-size: .46rem; color: rgba(58,85,112,.55); margin-top: 7px; word-break: break-all; line-height: 1.4; }

/* BUNDLE GRID */
.bg2 { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; margin-bottom: 22px; }
.bc { background: var(--sf); border: 1px solid rgba(0,255,224,.08);
padding: 20px 14px; text-align: center; cursor: pointer; transition: all .3s; }
.bc:hover { border-color: rgba(0,255,224,.25); }
.bc.sel { border-color: var(--ac); background: rgba(0,255,224,.04); }
.bn { font-family: 'Bebas Neue'; font-size: 1rem; color: #fff; letter-spacing: .1em; }
.bdata { font-size: 1.3rem; color: var(--ac); font-family: 'Bebas Neue'; line-height: 1.1; }
.bprice { font-size: .6rem; color: var(--mt); margin-top: 4px; }
.bbtc { font-size: .56rem; color: var(--gd); margin-top: 2px; }

/* AIRBANK */
.vd { background: var(--sf); border: 1px solid rgba(0,255,224,.1); padding: 32px; margin-bottom: 2px; }
.vn { font-family: 'Bebas Neue'; font-size: 3.5rem; color: var(--ac); line-height: 1; text-shadow: 0 0 40px rgba(0,255,224,.3); }
.vu { font-size: .67rem; color: var(--mt); letter-spacing: .24em; text-transform: uppercase; margin-top: 4px; }
.rg { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; margin-bottom: 2px; }
.rc { background: var(--sf); border: 1px solid rgba(245,197,24,.1); padding: 26px; position: relative; }
.rc::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;
background: linear-gradient(90deg, transparent, var(--gd), transparent); }
.rn { font-family: 'Bebas Neue'; font-size: 2.3rem; color: var(--gd); line-height: 1; margin-bottom: 4px; }
.rl { font-size: .56rem; color: var(--mt); letter-spacing: .17em; text-transform: uppercase; }
.rs { font-size: .6rem; color: rgba(245,197,24,.5); margin-top: 4px; }

/* PROGRESS */
.pr { margin-bottom: 12px; }
.pl { display: flex; justify-content: space-between; font-size: .58rem; color: var(--mt); letter-spacing: .1em; margin-bottom: 5px; }
.pb { height: 4px; background: rgba(0,255,224,.08); border-radius: 2px; overflow: hidden; }
.pf { height: 100%; border-radius: 2px; background: linear-gradient(90deg, var(--ac2), var(--ac));
animation: fb 2s ease forwards; transform-origin: left; }
@keyframes fb { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.pf.gd { background: linear-gradient(90deg, var(--gd2), var(--gd)); }
.pf.r { background: linear-gradient(90deg, var(--ac3), #ff9a6c); }

/* TABLE */
.dt { width: 100%; border-collapse: collapse; font-size: .64rem; }
.dt th { color: var(--mt); letter-spacing: .14em; text-transform: uppercase; font-size: .54rem;
padding: 9px 13px; text-align: left; border-bottom: 1px solid rgba(0,255,224,.08); }
.dt td { padding: 9px 13px; border-bottom: 1px solid rgba(255,255,255,.03); color: var(--tx); }
.dt tr:hover td { background: rgba(0,255,224,.02); }
.bdg { display: inline-block; padding: 2px 8px; font-size: .5rem; letter-spacing: .1em;
text-transform: uppercase; border-radius: 2px; }
.bg3 { background: rgba(0,255,224,.1); color: var(--ac); border: 1px solid rgba(0,255,224,.2); }
.bgd { background: rgba(245,197,24,.1); color: var(--gd); border: 1px solid rgba(245,197,24,.2); }
.br { background: rgba(255,77,109,.1); color: var(--ac3); border: 1px solid rgba(255,77,109,.2); }

/* LOG FEED */
.lf { background: var(--sf); border: 1px solid rgba(0,255,224,.08); padding: 20px; min-height: 260px; }
.le { display: flex; gap: 12px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.03);
animation: fi .4s ease; }
@keyframes fi { from { opacity: 0; transform: translateX(-8px); } to { opacity: 1; transform: none; } }
.ld { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: 5px; }
.lg { background: var(--ac); box-shadow: 0 0 8px var(--ac); }
.lb { background: var(--ac2); box-shadow: 0 0 8px var(--ac2); }
.lr { background: var(--ac3); box-shadow: 0 0 8px var(--ac3); }
.lgd { background: var(--gd); box-shadow: 0 0 8px var(--gd); }
.lt { font-size: .62rem; line-height: 1.7; color: var(--mt); }
.lt strong { color: var(--tx); font-weight: 400; }
.ltm { font-size: .54rem; color: rgba(58,85,112,.5); display: block; margin-top: 1px; }

/* SVG MAP */
.mc { width: 100%; height: 230px; position: relative; margin-top: 18px; }
.ms { width: 100%; height: 100%; }

/* HIGHLIGHT BOX */
.hb { background: rgba(245,197,24,.04); border: 1px solid rgba(245,197,24,.2);
padding: 18px 22px; margin-bottom: 22px; }
.hb p { font-size: .7rem; line-height: 1.9; color: var(--tx); }
.hb strong { color: var(--gd); }

/* CALC DISPLAY */
.cd { background: #000; border: 1px solid rgba(245,197,24,.2); padding: 18px;
font-family: 'Bebas Neue'; font-size: 1.8rem; color: var(--gd);
text-align: right; letter-spacing: .1em; min-height: 64px; margin-bottom: 14px; }
.cd .cs { font-size: .76rem; color: rgba(245,197,24,.5); font-family: 'Space Mono'; }

.copy-btn { background: rgba(245,197,24,.08); border: 1px solid rgba(245,197,24,.2);
color: var(--gd); padding: 4px 12px; font-size: .56rem; cursor: pointer;
font-family: 'Space Mono'; letter-spacing: .1em; transition: all .2s; }
.copy-btn:hover { background: rgba(245,197,24,.18); }

.div { border: none; border-top: 1px solid rgba(0,255,224,.06); margin: 36px 0; }
.tc { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.thc { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2px; }

/* FOOTER */
footer { border-top: 1px solid rgba(0,255,224,.06); padding: 30px 40px;
display: flex; align-items: center; justify-content: space-between;
max-width: 1300px; margin: 0 auto; }
.fl2 { font-family: 'Bebas Neue'; font-size: 1.2rem; color: var(--mt); letter-spacing: .25em; }
.fc { font-size: .54rem; color: rgba(58,85,112,.5); letter-spacing: .1em; }
.fs { display: flex; align-items: center; gap: 8px; font-size: .58rem; color: var(--ac); letter-spacing: .15em; }

@media (max-width: 900px) {
.hero { grid-template-columns: 1fr; }
.gw { height: 270px; } .globe { width: 220px; height: 220px; }
.o1 { width: 280px; height: 280px; } .o2 { width: 350px; height: 350px; }
.sr { grid-template-columns: repeat(2,1fr); }
.cg { grid-template-columns: 1fr; }
.wg { grid-template-columns: repeat(2,1fr); }
.bg2 { grid-template-columns: repeat(2,1fr); }
.rg { grid-template-columns: 1fr; }
.tc { grid-template-columns: 1fr; }
.thc { grid-template-columns: 1fr; }
.nl { display: none; }
nav { padding: 12px 18px; }
.sec { padding: 40px 18px; }
}

AIRTIMES

Network
Services
Nodes
₿ AirPay
🏦 AirBank
👑 Owner

CONNECTING...

🌐 Home
⚡ Services
🔗 Connect
◯ Nodes
📡 Route
₿ AirPay
🏦 AirBank
👑 Owner Dashboard

  Global Data Mesh — v3.2.0
  <h1>FREE<br><span>DATA</span> &amp;<br><span>SERVICE</span><br><span>NETWORK</span></h1>
  <p>AIRTIMES delivers free data, connectivity, and digital services to every node on Earth. Users connect free. Owner earns automatically via AirPay crypto payments and AirBank data revenue — around the clock.</p>

    GET FREE ACCESS
    ₿ BUY DATA BUNDLE
    🏦 AirBank







  ▲ 4,700 Gbps THROUGHPUT
  ◯ 142 ACTIVE NODES
  ₿ AUTO-EARNING ACTIVE





<span></span>AIRDATA FREE TIER ACTIVE
<span></span>AIRBANK — $0.0024 REVENUE LOGGED
<span></span>NAIROBI NODE ONLINE
<span></span>AIRPAY — BTC PAYMENT RECEIVED
<span></span>2.1M USERS CONNECTED
<span></span>AIRBANK VAULT — 842 TB STORED
<span></span>JAKARTA HUB — 340 Gbps
<span></span>AUTO-REVENUE TICKING EVERY SESSION
<span></span>AIRTIMES PROTOCOL v3.2 LIVE
<span></span>AIRPAY — ETH BUNDLE CONFIRMED
<span></span>AIRDATA FREE TIER ACTIVE
<span></span>AIRBANK — $0.0024 REVENUE LOGGED
<span></span>NAIROBI NODE ONLINE
<span></span>AIRPAY — BTC PAYMENT RECEIVED
<span></span>2.1M USERS CONNECTED
<span></span>AIRBANK VAULT — 842 TB STORED
<span></span>JAKARTA HUB — 340 Gbps
<span></span>AUTO-REVENUE TICKING EVERY SESSION
<span></span>AIRTIMES PROTOCOL v3.2 LIVE
<span></span>AIRPAY — ETH BUNDLE CONFIRMED




—Active Nodes Worldwide
—Daily Data Delivered (TB)
—Users Served Free
—Auto Revenue Earned (USD)



// Three Systems · One Network
HOW AIRTIMES WORKS


    🌐
    Free Global Network
    Users connect free worldwide via AirData, AirSMS, AirWeb, AirVault, AirAPI, AirRelay. Zero cost to users forever. Powered by surplus bandwidth redistribution across 142+ global nodes.
    FREE FOR ALL USERS


    ₿
    AirPay — Crypto Payments
    Users buy premium data bundles using Bitcoin, Ethereum, USDT, BNB, or Litecoin. Every payment routes directly to the owner's crypto wallet instantly. No middleman, no processor fees.
    BTC · ETH · USDT · BNB · LTC


    🏦
    AirBank — Auto Revenue Engine
    Every byte transmitted earns the owner automatically. Trillions of AirUnits stored in the vault, converted to direct money on every user session. Earn while you sleep.
    EARN AUTOMATICALLY







    📋 Live Network Events


    💰 Revenue Snapshot
    Loading revenue data...
    VIEW FULL OWNER DASHBOARD →









// All Free + Paid Services
WHAT AIRTIMES PROVIDES

  📡AirData — Free Mobile DataZero-cost mobile internet routing through the AIRTIMES mesh. Any device, any carrier, any country. Bandwidth pooled from surplus commercial nodes globally.FREE · UNLIMITED
  💬AirSMS — Global MessagingEnd-to-end encrypted SMS and voice relay across all 193 countries. Delivered free via spare spectrum on partner networks. Auto-revenue for owner per SMS.FREE · E2E ENCRYPTED
  🌐AirWeb — Open BrowserCompressed web proxy serving the full open internet at zero data cost. Optimized for low-bandwidth environments and offline caching. Up to 70% compression ratio.FREE · COMPRESSED
  🔗AirAPI — Open Data GatewayFree access to global datasets: weather, finance, health, transport. 50,000 requests/day per node. Developer-grade REST and WebSocket access.FREE · 50K RPD
  🛰AirRelay — Satellite FallbackWhen ground infrastructure fails, AIRTIMES auto-routes through low-earth-orbit relay partners to maintain continuous free connectivity globally.RESILIENT · AUTO
  💾AirVault — Distributed Storage5 GB of free distributed cloud storage per user. Sharded across 8+ geo-regions for redundancy. Served at zero cost from network surplus capacity.FREE · 5 GB
  ₿AirPay — Crypto Payment GatewayUsers buy premium data bundles with Bitcoin, Ethereum, USDT, BNB, or Litecoin. Payments go directly to the owner's wallet. No middleman. Instant settlement.BTC · ETH · USDT · BNB · LTC
  🏦AirBank — Auto Revenue EngineEvery user session generates automatic revenue for the owner. Trillions of AirUnits stored and converted to direct money. Revenue from data, SMS, API, storage.AUTO REVENUE
  🗺AirRoute — Smart Mesh RoutingDijkstra mesh routing with Haversine geo-scoring. Auto-failover. Multi-hop path optimization. Load rebalancing every 30 seconds across all nodes.AI ROUTING








// Free Access
JOIN THE NETWORK
<p>Register your phone or email to get a free AIRTIMES token. Instantly connected to 142+ nodes worldwide. No credit card. No contracts. Forever free.</p>


    Phone or Email

    Identifier Type
      EmailPhone
    ACTIVATE FREE ACCESS →
    <span>Fill in your details and click activate.</span>


    What you get FREE:

      ✦ AirData — Unlimited free mobile internet<br>
      ✦ AirSMS — Global encrypted messaging<br>
      ✦ AirWeb — Compressed web proxy<br>
      ✦ AirAPI — 50,000 free API calls/day<br>
      ✦ AirVault — 5 GB free cloud storage<br>
      ✦ AirRelay — Satellite connectivity fallback<br>
      ✦ Assigned to nearest global mesh node<br>
      ✦ 10 GB daily data quota<br>

    <hr>
    Want more data? <span>Buy a premium bundle with crypto via AirPay →</span>


<hr>
// Free API Test
AIRAPI GATEWAY


    City (Free Weather)

    GET FREE WEATHER →
    Exchange Rate



        GET RATE


    <span>Results appear here — all free, no API key needed.</span>


    🌐 AirAPI Specs

      ● <span>50,000</span> free calls/day per node<br>
      ● Weather data for all cities worldwide<br>
      ● Live exchange rates (150+ currencies)<br>
      ● Health, transport, finance datasets<br>
      ● REST + WebSocket endpoints<br>
      ● No API key needed for free tier<br>
      ● Each call auto-earns revenue for owner<br>










// Mesh Routing Engine
TEST YOUR ROUTE
<p>Enter your token and destination to compute the optimal mesh path through AIRTIMES global nodes using Haversine geo-scoring and Dijkstra path finding.</p>


    Your Token (from registration)

    Destination

    Service

        AirDataAirSMSAirWeb
        AirAPIAirVaultAirRelay

    COMPUTE ROUTE →


    Run a route test to see your full mesh path, latency estimate, hop count, and protocol details.









// Global Infrastructure
LIVE NODE MAP

  <svg viewBox="0 0 900 240">
    <line x1="0" y1="80" x2="900" y2="80" stroke="" stroke-width="1"></line>
    <line x1="0" y1="160" x2="900" y2="160" stroke="" stroke-width="1"></line>
    <line x1="225" y1="0" x2="225" y2="240" stroke="" stroke-width="1"></line>
    <line x1="450" y1="0" x2="450" y2="240" stroke="" stroke-width="1"></line>
    <line x1="675" y1="0" x2="675" y2="240" stroke="" stroke-width="1"></line>
    <g stroke="" stroke-width="1" fill="none">
      <line x1="80" y1="90" x2="200" y2="70"></line><line x1="200" y1="70" x2="340" y2="100"></line>
      <line x1="340" y1="100" x2="480" y2="80"></line><line x1="480" y1="80" x2="600" y2="110"></line>
      <line x1="600" y1="110" x2="740" y2="90"></line><line x1="740" y1="90" x2="840" y2="100"></line>
      <line x1="200" y1="70" x2="280" y2="150"></line><line x1="480" y1="80" x2="520" y2="170"></line>
      <line x1="600" y1="110" x2="580" y2="180"></line><line x1="80" y1="90" x2="120" y2="180"></line>
    </g>
    <circle r="3" fill=""></circle>
    <circle r="2.5" fill=""></circle>
    <g>
      <circle cx="80" cy="90" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="80" cy="90" r="3.5" fill="#00ffe0"></circle>
      <circle cx="200" cy="70" r="10" fill="" stroke="" stroke-width="1.5"></circle><circle cx="200" cy="70" r="4" fill="#00ffe0"></circle>
      <circle cx="340" cy="100" r="7" fill="" stroke="" stroke-width="1.5"></circle><circle cx="340" cy="100" r="3" fill="#0077ff"></circle>
      <circle cx="480" cy="80" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="480" cy="80" r="4" fill="#f5c518"></circle>
      <circle cx="600" cy="110" r="8" fill="" stroke="" stroke-width="1.5"></circle><circle cx="600" cy="110" r="3.5" fill="#ff4d6d"></circle>
      <circle cx="740" cy="90" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="740" cy="90" r="4" fill="#00ffe0"></circle>
      <circle cx="840" cy="100" r="7" fill="" stroke="" stroke-width="1"></circle><circle cx="840" cy="100" r="3" fill="#00ffe0"></circle>
      <circle cx="120" cy="180" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="120" cy="180" r="2" fill="#0077ff"></circle>
      <circle cx="520" cy="170" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="520" cy="170" r="2" fill="#0077ff"></circle>
      <circle cx="580" cy="180" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="580" cy="180" r="2" fill="#ff4d6d"></circle>
      <circle cx="660" cy="50" r="6" fill="" stroke="" stroke-width="1"></circle><circle cx="660" cy="50" r="2.5" fill="#0077ff"></circle>
      <circle cx="155" cy="105" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="155" cy="105" r="2" fill="#f5c518"></circle>
    </g>
  </svg>

<table id="nodes-table">
  <thead><tr><th>Node ID</th><th>City</th><th>Country</th><th>Operator</th><th>Capacity (Gbps)</th><th>Load</th><th>Status</th></tr></thead>
  <tbody id="nodes-body"><tr><td colspan="7">Loading nodes...</td></tr></tbody>
</table>







// Bitcoin &amp; Crypto Payment Gateway
₿ AIRPAY

  <p>AirPay lets users buy premium data bundles using <strong>Bitcoin, Ethereum, USDT, BNB, or Litecoin</strong>. Every payment goes <strong>directly to the AIRTIMES owner's crypto wallet</strong> — instantly, no middleman, zero processor fees. Select a bundle, choose your crypto, and send payment to the displayed address.</p>


// Owner Wallet Addresses — All Payments Are Sent Directly Here


<hr>
// Select Your Data Bundle
Choose how much premium data you want to purchase:




    ⚡ Generate Payment Address
    Your User ID (optional)

    Pay With

        ₿ Bitcoin (BTC)
        Ξ Ethereum (ETH)
        ₮ Tether USDT (TRC-20)
        ⬡ BNB Coin
        Ł Litecoin (LTC)

    GENERATE PAYMENT ADDRESS →
    <span>Select a bundle above, then click to generate your payment address.</span>


    📋 How AirPay Works

      <span>Step 1.</span> Select a data bundle above<br>
      <span>Step 2.</span> Choose Bitcoin, ETH, USDT, BNB, or LTC<br>
      <span>Step 3.</span> Click "Generate Payment Address"<br>
      <span>Step 4.</span> Send exact crypto amount shown<br>
      <span>Step 5.</span> Bundle activates in 10–60 minutes<br>
      <span>Step 6.</span> Revenue automatically in owner wallet<br>

    <hr>
    All payments go directly to owner's crypto wallets. No processor. No fees. Direct blockchain settlement.



<hr>
// Confirm Your Payment


    Payment ID

    Transaction Hash (TX Hash from blockchain)

    CONFIRM PAYMENT →
    <span>Enter Payment ID + TX hash to confirm your purchase.</span>


    After sending crypto, paste your <span>Payment ID</span> and the <span>transaction hash</span> from your wallet or blockchain explorer. Data bundle activates immediately upon confirmation.









// Data Storage &amp; Automatic Revenue Engine
🏦 AIRBANK

  <p>AirBank is the <strong>financial backbone of AIRTIMES</strong>. Every byte of data transmitted through the network is stored in the AirBank Vault measured in <strong>Trillions of AirUnits</strong>. When users browse, message, stream, or use any AIRTIMES service — the owner <strong>earns money automatically</strong>, around the clock. Data is the currency. Usage is the revenue. Extract data, convert to direct money.</p>





    Vault Storage
    —
    Total AirUnits Stored


    Data Transmitted
    —
    GB Delivered to Users


    Total Revenue Earned
    —
    USD Earned Automatically






    Per GB Transmitted
    $0.002
    Every 1 GB routed = $0.002 earned by owner


    Per Active User / Day
    $0.001
    Every daily user session earns automatically


    Per API Call
    $0.00005
    Every AirAPI request generates revenue



<hr>
// Data → Money Calculator
Enter any amount of stored/transmitted data to see the revenue it generates for the owner:


    $ 0.00Enter amount below to calculate




          GBTBPB



    <span>Enter data amount above to calculate automatic revenue.</span>


    📈 Revenue Sources Breakdown
    <span>Data Transmission</span><span id="pct1">42%</span>
    <span>Active Users (Daily)</span><span id="pct2">24%</span>
    <span>AirPay Bundles</span><span id="pct3">18%</span>
    <span>API Calls</span><span id="pct4">9%</span>
    <span>Storage Fees</span><span id="pct5">5%</span>
    <span>SMS Revenue</span><span id="pct6">2%</span>









// Private Owner Control Panel
👑 OWNER DASHBOARD

  <p>This is your <strong>private revenue command center</strong>. See every dollar earned, every AirPay payment received, every data unit transmitted. <strong>Set your Bitcoin and crypto wallet addresses below</strong> — all AirPay payments route directly to these wallets instantly. You own the network. You own the revenue.</p>



// ₿ Your Crypto Wallet Addresses
Enter your real wallet addresses here. Users see these when paying via AirPay. All payments land directly in your wallets.


    ₿ Bitcoin (BTC) Wallet Address

    Ξ Ethereum (ETH) Wallet Address

    ₮ USDT Wallet (TRC-20 / Tron Network)

    ⬡ BNB Wallet Address

    Ł Litecoin (LTC) Wallet Address


      SAVE WALLET ADDRESSES →



    <span>Enter your real wallet addresses and click Save. These will be shown to users on the AirPay page. For production, set as environment variables on your backend server.</span>




// Revenue Summary

  Total Earned (USD)$—— BTC
  Projected Monthly$—Based on current daily rate
  Revenue Events Logged—Auto-logged transactions




    Revenue by Source
    Loading...


    Daily Revenue (Last 7 Days)
    Loading...





  AirPay Payment History
  <table>
    <thead><tr><th>Payment ID</th><th>Bundle</th><th>Coin</th><th>Amount</th><th>Status</th><th>Date</th></tr></thead>
    <tbody id="pay-hist"><tr><td colspan="6">No payments yet. Share your AirPay page with users to start receiving crypto payments!</td></tr></tbody>
  </table>


<hr>
// Network Control


    Registered Users
    —
    Total on network


    Active Nodes
    —
    Online globally


    Data Routed Today
    —
    GB transmitted

AIRTIMES
© 2025 AIRTIMES GLOBAL NETWORK · AirPay · AirBank · All Services Free · All Rights Universal
ALL SYSTEMS OPERATIONAL

/* ===== CONFIG ===== */
const API = (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1')
? 'http://localhost:3001' : '';

/* ===== WALLET STATE (saved in localStorage) ===== */
let WALLETS = {
BTC: localStorage.getItem('w_BTC') || '',
ETH: localStorage.getItem('w_ETH') || '',
USDT: localStorage.getItem('w_USDT') || '',
BNB: localStorage.getItem('w_BNB') || '',
LTC: localStorage.getItem('w_LTC') || ''
};

const BUNDLES = [
{ id:'starter', name:'Starter', gb:5, usd:0.50, btc:'0.000010' },
{ id:'basic', name:'Basic', gb:20, usd:1.99, btc:'0.000038' },
{ id:'standard', name:'Standard', gb:100, usd:7.99, btc:'0.000150' },
{ id:'pro', name:'Pro', gb:500, usd:29.99, btc:'0.000600' },
{ id:'unlimited', name:'Unlimited', gb:9999, usd:74.99, btc:'0.001500' }
];

let selBundle = null;

/* ===== PAGE SWITCHER ===== */
function P(id) {
document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
const pg = document.getElementById('page-' + id);
if (pg) pg.classList.add('active');
document.querySelectorAll('.tab').forEach(t => {
if (t.getAttribute('onclick') && t.getAttribute('onclick').includes("'" + id + "'")) t.classList.add('active');
});
window.scrollTo({ top: 0, behavior: 'smooth' });
if (id === 'airpay') renderAirPay();
if (id === 'airbank') loadVault();
if (id === 'owner') loadOwner();
if (id === 'nodes') loadNodes();
}

/* ===== HELPERS ===== */
function fmt(n) { return Number(n).toLocaleString(); }
function ac(el, target, sfx, dur) {
if (!el) return;
sfx = sfx || ''; dur = dur || 2000;
let v = 0; const step = target / (dur / 16);
const t = setInterval(function() {
v += step;
if (v >= target) { v = target; clearInterval(t); }
el.textContent = Math.floor(v).toLocaleString() + sfx;
}, 16);
}
function uid() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
var r = Math.random() * 16 | 0;
return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16);
});
}

/* ===== LOAD STATS ===== */
async function loadStats() {
try {
const r = await fetch(API + '/api/stats');
const d = await r.json();
document.getElementById('nst').textContent = 'ALL SYSTEMS OPERATIONAL';
ac(document.getElementById('s1'), d.activeNodes || 142);
ac(document.getElementById('s2'), d.dataTB || 4700, ' TB');
ac(document.getElementById('s3'), d.totalUsers || 2100000);
try {
const rv = await fetch(API + '/api/airbank/revenue');
const rd = await rv.json();
const tot = parseFloat(rd.summary && rd.summary.totalUSD ? rd.summary.totalUSD : '3.47');
document.getElementById('s4').textContent = '$' + tot.toFixed(2);
const rs = document.getElementById('rev-snap');
if (rs) rs.innerHTML =
'<div><span style="color:var(--mt)">Total USD Earned: </span><span style="color:var(--gd)">$' + (rd.summary ? parseFloat(rd.summary.totalUSD).toFixed(4) : '3.4700') + '</span></div>' +
'<div><span style="color:var(--mt)">In Bitcoin: </span><span style="color:var(--gd)">' + (rd.summary ? rd.summary.totalBTC : '0.00005378') + ' BTC</span></div>' +
'<div><span style="color:var(--mt)">Projected Monthly: </span><span style="color:var(--gd)">$' + (rd.summary ? rd.summary.projectedMonthlyUSD : '104.10') + '</span></div>' +
'<div><span style="color:var(--mt)">Revenue Events: </span><span style="color:var(--ac)">' + fmt(rd.summary ? rd.summary.totalEvents : 200) + '</span></div>';
} catch(e) { setDemoRevSnap(); }
} catch(e) {
document.getElementById('nst').textContent = 'DEMO MODE';
ac(document.getElementById('s1'), 142);
ac(document.getElementById('s2'), 4700, ' TB');
ac(document.getElementById('s3'), 2100000);
document.getElementById('s4').textContent = '$3.47';
setDemoRevSnap();
}
}

function setDemoRevSnap() {
const rs = document.getElementById('rev-snap');
if (!rs) return;
rs.innerHTML = '<div><span style="color:var(--mt)">Total USD: </span><span style="color:var(--gd)">$3.47 (Demo)</span></div>' +
'<div><span style="color:var(--mt)">Bitcoin: </span><span style="color:var(--gd)">0.00005378 BTC</span></div>' +
'<div><span style="color:var(--mt)">Monthly Proj: </span><span style="color:var(--gd)">$104.10</span></div>' +
'<div><span style="color:var(--mt)">Events: </span><span style="color:var(--ac)">200 logged</span></div>';
}

/* ===== LOAD NODES ===== */
const DEMO_NODES = [
{id:'NODE-US-NYC01',city:'New York', country:'US',operator:'AT&T Surplus', capacity_gbps:2100,load_percent:52},
{id:'NODE-GB-LDN01',city:'London', country:'GB',operator:'BT Wholesale', capacity_gbps:3400,load_percent:45},
{id:'NODE-KE-NBI01',city:'Nairobi', country:'KE',operator:'Safaricom', capacity_gbps:880, load_percent:78},
{id:'NODE-AE-DXB01',city:'Dubai', country:'AE',operator:'Etisalat', capacity_gbps:1200,load_percent:60},
{id:'NODE-ID-JKT01',city:'Jakarta', country:'ID',operator:'Telkom ID', capacity_gbps:340, load_percent:88},
{id:'NODE-JP-TYO01',city:'Tokyo', country:'JP',operator:'NTT Com', capacity_gbps:2900,load_percent:41},
{id:'NODE-AU-SYD01',city:'Sydney', country:'AU',operator:'Telstra', capacity_gbps:760, load_percent:33},
{id:'NODE-BR-GRU01',city:'Sao Paulo', country:'BR',operator:'Vivo', capacity_gbps:640, load_percent:55},
{id:'NODE-ZA-CPT01',city:'Cape Town', country:'ZA',operator:'MTN SA', capacity_gbps:420, load_percent:29},
{id:'NODE-IN-BOM01',city:'Mumbai', country:'IN',operator:'Airtel', capacity_gbps:980, load_percent:71},
{id:'NODE-SG-SIN01',city:'Singapore', country:'SG',operator:'Singtel', capacity_gbps:1800,load_percent:66},
{id:'NODE-NG-LOS01',city:'Lagos', country:'NG',operator:'MTN Nigeria', capacity_gbps:320, load_percent:82},
{id:'NODE-DE-BER01',city:'Berlin', country:'DE',operator:'Deutsche Telekom', capacity_gbps:1600,load_percent:38},
{id:'NODE-CN-SHA01',city:'Shanghai', country:'CN',operator:'China Telecom', capacity_gbps:2200,load_percent:59},
{id:'NODE-MX-MEX01',city:'Mexico City',country:'MX',operator:'Telmex', capacity_gbps:560, load_percent:44}
];

async function loadNodes() {
try {
const r = await fetch(API + '/api/nodes');
const d = await r.json();
renderNodes(d.nodes || DEMO_NODES);
} catch(e) { renderNodes(DEMO_NODES); }
}

function renderNodes(nodes) {
const tb = document.getElementById('nodes-body');
if (!tb) return;
tb.innerHTML = nodes.map(function(n) {
const hi = n.load_percent > 80;
const bar = '<span style="display:inline-block;width:50px;height:4px;background:rgba(0,255,224,.08);border-radius:2px;vertical-align:middle;margin-left:4px;overflow:hidden"><span style="display:block;height:100%;width:' + n.load_percent + '%;background:' + (hi ? '#ff4d6d' : '#00ffe0') + ';border-radius:2px"></span></span>';
return '<tr><td style="color:var(--ac);font-size:.58rem">' + n.id + '</td><td>' + n.city + '</td><td>' + n.country + '</td><td style="color:var(--mt)">' + n.operator + '</td><td>' + fmt(n.capacity_gbps) + '</td><td>' + n.load_percent + '% ' + bar + '</td><td><span class="bdg bg3">ONLINE</span></td></tr>';
}).join('');
}

/* ===== REGISTER ===== */
async function doRegister() {
const id = document.getElementById('ri').value.trim();
const type = document.getElementById('rtype').value;
const btn = document.getElementById('rbtn');
const res = document.getElementById('rres');
if (!id) { alert('Please enter your phone or email.'); return; }
btn.textContent = 'ACTIVATING...'; btn.disabled = true;
try {
const r = await fetch(API + '/api/register', {
method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ identifier: id, type: type })
});
const d = await r.json();
if (d.success) {
res.className = 'rb show';
res.innerHTML = '<div><span class="rk">STATUS: </span><span class="rv g">✓ FREE ACCESS ACTIVATED</span></div>' +
'<div><span class="rk">USER ID: </span><span class="rv">' + d.userId + '</span></div>' +
'<div><span class="rk">TOKEN: </span><span class="rv" style="font-size:.58rem;word-break:break-all">' + d.token + '</span></div>' +
'<div><span class="rk">NODE: </span><span class="rv">' + (d.assignedNode ? d.assignedNode.city + ', ' + d.assignedNode.country + ' (' + d.assignedNode.latencyMs + 'ms)' : 'London, GB') + '</span></div>' +
'<div><span class="rk">DAILY DATA: </span><span class="rv">' + fmt(d.dailyDataMB || 10240) + ' MB</span></div>' +
'<div><span class="rk">TIER: </span><span class="rv gd">FREE — FOREVER</span></div>';
document.getElementById('rtt').value = d.token;
document.getElementById('puid').value = d.userId;
} else {
res.className = 'rb show';
res.innerHTML = '<span style="color:var(--ac3)">Error: ' + d.error + '</span>';
}
} catch(e) {
var tk = uid();
res.className = 'rb show';
res.innerHTML = '<div><span class="rk">STATUS: </span><span class="rv g">✓ FREE ACCESS ACTIVATED (Demo Mode)</span></div>' +
'<div><span class="rk">IDENTIFIER: </span><span class="rv">' + id + '</span></div>' +
'<div><span class="rk">TOKEN: </span><span class="rv" style="font-size:.58rem">' + tk + '</span></div>' +
'<div><span class="rk">NODE: </span><span class="rv">London, GB — 34ms</span></div>' +
'<div><span class="rk">TIER: </span><span class="rv gd">FREE — FOREVER</span></div>' +
'<div style="margin-top:8px;font-size:.6rem;color:rgba(58,85,112,.7)">Deploy the backend to process real registrations.</div>';
document.getElementById('rtt').value = tk;
document.getElementById('puid').value = 'guest-' + uid().slice(0,8);
}
btn.textContent = 'ACTIVATE FREE ACCESS →'; btn.disabled = false;
}

/* ===== ROUTE ===== */
async function doRoute() {
const token = document.getElementById('rtt').value.trim();
const dest = document.getElementById('rtd').value.trim() || 'google.com';
const service = document.getElementById('rts').value;
const res = document.getElementById('rres2');
res.innerHTML = '<span style="color:var(--mt)">Computing optimal mesh path...</span>';
try {
const r = await fetch(API + '/api/route', {
method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ token: token, destination: dest, service: service })
});
const d = await r.json();
renderRoute(d);
} catch(e) {
renderRoute({
path: [
{ city:'Your Device', country:'--' },
{ city:'London', country:'GB', load:45 },
{ city:'Dubai', country:'AE', load:60 },
{ city: dest, country:'🌐' }
],
hops: 3, estimatedLatencyMs: 112, totalDistanceKm: 9420,
compressed: true, encrypted: true, protocol: 'AIRTIMES/3.2', free: true
});
}
}

function renderRoute(d) {
const res = document.getElementById('rres2');
const hops = d.path || [];
const pathHtml = hops.map(function(h, i) {
return '<div style="display:flex;align-items:center;gap:10px;margin-bottom:6px;font-size:.67rem">' +
'<span style="color:var(--ac);font-size:.58rem">' + String(i).padStart(2,'0') + '</span>' +
'<span style="color:var(--ac)">→</span>' +
'<span style="color:var(--tx)">' + h.city + (h.country && h.country !== '--' ? ' (' + h.country + ')' : '') + '</span>' +
(h.load !== undefined ? '<span style="color:var(--mt);font-size:.56rem">[' + h.load + '% load]</span>' : '') +
'</div>';
}).join('');
res.innerHTML = pathHtml +
'<div style="margin-top:14px;border-top:1px solid rgba(0,255,224,.07);padding-top:14px">' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">HOPS</span><span style="color:var(--ac)">' + (d.hops||3) + '</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">LATENCY</span><span style="color:var(--ac)">' + (d.estimatedLatencyMs||112) + ' ms</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">DISTANCE</span><span style="color:var(--ac)">' + fmt(d.totalDistanceKm||9420) + ' km</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">PROTOCOL</span><span style="color:var(--ac)">' + (d.protocol||'AIRTIMES/3.2') + '</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">COMPRESSED</span><span style="color:var(--ac)">' + (d.compressed?'YES':'NO') + '</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">ENCRYPTED</span><span style="color:var(--ac)">' + (d.encrypted?'YES':'NO') + '</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem"><span style="color:var(--mt)">COST</span><span style="color:var(--gd);font-weight:700">FREE</span></div>' +
'</div>';
}

/* ===== API TESTS ===== */
async function doWeather() {
const city = document.getElementById('wc').value.trim() || 'Lagos';
const res = document.getElementById('apires');
res.innerHTML = '<span style="color:var(--mt)">Fetching weather...</span>'; res.className = 'rb show';
try {
const r = await fetch(API + '/api/airapi/weather?city=' + encodeURIComponent(city));
const d = await r.json();
res.innerHTML = '<div><span class="rk">CITY: </span><span class="rv">' + city + '</span></div>' +
'<div><span class="rk">TEMP: </span><span class="rv">' + d.data.temp_c + '°C</span></div>' +
'<div><span class="rk">CONDITION: </span><span class="rv">' + d.data.condition + '</span></div>' +
'<div><span class="rk">HUMIDITY: </span><span class="rv">' + d.data.humidity + '%</span></div>' +
'<div><span class="rk">WIND: </span><span class="rv">' + d.data.wind_kmh + ' km/h</span></div>' +
'<div><span class="rk">COST: </span><span class="rv gd">FREE</span></div>';
} catch(e) {
var temps = {Lagos:31,Nairobi:22,Jakarta:29,London:12,Tokyo:18,Sydney:24,Dubai:38,Accra:30,Abuja:29};
var t = temps[city] || Math.round(15 + Math.random() * 20);
var conds = ['Clear','Sunny','Cloudy','Partly Cloudy'];
res.innerHTML = '<div><span class="rk">CITY: </span><span class="rv">' + city + '</span></div>' +
'<div><span class="rk">TEMP: </span><span class="rv">' + t + '°C</span></div>' +
'<div><span class="rk">CONDITION: </span><span class="rv">' + conds[Math.floor(Math.random()*conds.length)] + '</span></div>' +
'<div><span class="rk">HUMIDITY: </span><span class="rv">' + Math.round(40+Math.random()*50) + '%</span></div>' +
'<div><span class="rk">COST: </span><span class="rv gd">FREE (Demo)</span></div>';
}
}

async function doExchange() {
var from = document.getElementById('ef').value.trim() || 'USD';
var to = document.getElementById('et').value.trim() || 'NGN';
var res = document.getElementById('apires');
try {
const r = await fetch(API + '/api/airapi/exchange?from=' + from + '&to=' + to);
const d = await r.json();
res.innerHTML = '<div><span class="rk">RATE: </span><span class="rv">1 ' + from + ' = ' + d.rate + ' ' + to + '</span></div><div><span class="rk">COST: </span><span class="rv gd">FREE</span></div>';
} catch(e) {
var rates = {NGN:1580,KES:130,GHS:15,ZAR:18,EUR:0.92,GBP:0.79,JPY:149,BTC:0.0000155,ETH:0.000290};
var rate = rates[to.toUpperCase()] ? rates[to.toUpperCase()] : (0.5+Math.random()*100).toFixed(4);
res.innerHTML = '<div><span class="rk">RATE: </span><span class="rv">1 ' + from + ' = ' + rate + ' ' + to + '</span></div><div><span class="rk">COST: </span><span class="rv gd">FREE (Demo)</span></div>';
}
res.className = 'rb show';
}

/* ===== AIRPAY RENDER ===== */
function renderAirPay() {
// Render wallet grid
var wg = document.getElementById('wallets-grid');
if (wg) {
var coins = ['BTC','ETH','USDT','BNB','LTC'];
wg.innerHTML = coins.map(function(c) {
var addr = WALLETS[c] || '(Not set — enter in Owner Dashboard)';
return '<div class="wc" onclick="selWallet(\'' + c + '\')" id="wcard-' + c + '">' +
'<div class="wi">' + COIN_ICONS[c] + '</div>' +
'<div class="wco">' + c + '</div>' +
'<div class="wna">' + COIN_NAMES[c] + '</div>' +
'<div class="wad">' + addr + '</div>' +
'</div>';
}).join('');
}
// Render bundle grid
var bg = document.getElementById('bundles-grid');
if (bg) {
bg.innerHTML = BUNDLES.map(function(b) {
return '<div class="bc" onclick="selBundle2(\'' + b.id + '\')" id="bc-' + b.id + '">' +
'<div class="bn">' + b.name + '</div>' +
'<div class="bdata">' + (b.gb >= 9999 ? '∞' : b.gb + ' GB') + '</div>' +
'<div class="bprice">$' + b.usd + '</div>' +
'<div class="bbtc">₿ ' + b.btc + '</div>' +
'</div>';
}).join('');
}
// Pre-fill from localStorage
['BTC','ETH','USDT','BNB','LTC'].forEach(function(c) {
var el = document.getElementById('wbtc') || null;
});
}

function selWallet(coin) {
document.querySelectorAll('.wc').forEach(function(c) { c.classList.remove('sel'); });
var el = document.getElementById('wcard-' + coin);
if (el) el.classList.add('sel');
var pc = document.getElementById('pcoin');
if (pc) pc.value = coin;
}

function selBundle2(id) {
document.querySelectorAll('.bc').forEach(function(c) { c.classList.remove('sel'); });
var el = document.getElementById('bc-' + id);
if (el) el.classList.add('sel');
selBundle = id;
}

async function doPayment() {
var bundleId = selBundle;
var coin = document.getElementById('pcoin').value;
var userId = document.getElementById('puid').value.trim();
var res = document.getElementById('pres');
var btn = document.getElementById('pbtn');
if (!bundleId) {
res.className = 'rb gb show';
res.innerHTML = '<span style="color:var(--ac3)">Please select a data bundle above first.</span>';
return;
}
btn.textContent = 'GENERATING...'; btn.disabled = true;
var bundle = BUNDLES.find(function(b) { return b.id === bundleId; });
var rate = COIN_RATES[coin] || 0.0000155;
var amount = (bundle.usd * rate).toFixed(8);
var payId = 'PAY-' + Math.random().toString(36).substr(2,12).toUpperCase();
var walletAddr = WALLETS[coin] || 'SET YOUR ' + coin + ' WALLET IN OWNER DASHBOARD';
try {
const r = await fetch(API + '/api/airpay/pay', {
method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ userId: userId, bundleId: bundleId, coin: coin })
});
const d = await r.json();
if (d.success && d.payment) showPayResult(d.payment);
else throw new Error(d.error || 'API unavailable');
} catch(e) {
showPayResult({ paymentId:payId, bundle:bundle, coin:coin, amount:amount,
walletAddress:walletAddr, amountUSD:bundle.usd,
network: {BTC:'Bitcoin Network',ETH:'Ethereum ERC-20',USDT:'Tron TRC-20',BNB:'BNB Smart Chain',LTC:'Litecoin'}[coin] || coin });
}
btn.textContent = 'GENERATE PAYMENT ADDRESS →'; btn.disabled = false;
}

function showPayResult(p) {
var res = document.getElementById('pres');
res.className = 'rb gb show';
var icon = COIN_ICONS[p.coin] || '₿';
res.innerHTML =
'<div style="text-align:center;margin-bottom:16px">' +
'<div style="font-size:2.5rem">' + icon + '</div>' +
'<div style="font-family:\'Bebas Neue\';font-size:1.8rem;color:var(--gd)">SEND ' + p.amount + ' ' + p.coin + '</div>' +
'<div style="font-size:.62rem;color:var(--mt)">' + (p.network || p.coin) + ' · $' + p.amountUSD + ' USD</div>' +
'</div>' +
'<div style="font-size:.6rem;color:var(--mt);margin-bottom:6px;letter-spacing:.1em;text-transform:uppercase">Send to this wallet address:</div>' +
'<div style="background:rgba(0,0,0,.5);border:1px solid rgba(245,197,24,.2);padding:12px;margin-bottom:12px;word-break:break-all;font-size:.62rem;color:var(--gd);letter-spacing:.05em;font-family:\'Space Mono\'">' + p.walletAddress + '</div>' +
'<div style="display:flex;gap:8px;margin-bottom:14px">' +
'<button class="copy-btn" onclick="navigator.clipboard.writeText(\'' + p.walletAddress.replace(/'/g,"\'") + '\')">COPY ADDRESS</button>' +
'<button class="copy-btn" onclick="navigator.clipboard.writeText(\'' + p.paymentId + '\')">COPY PAY ID</button>' +
'</div>' +
'<div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + p.paymentId + '</span></div>' +
'<div><span class="rk">BUNDLE: </span><span class="rv">' + (p.bundle ? p.bundle.name + ' — ' + (p.bundle.gb >= 9999 ? 'Unlimited' : p.bundle.gb + ' GB') : '') + '</span></div>' +
'<div><span class="rk">AMOUNT: </span><span class="rv gd">' + p.amount + ' ' + p.coin + '</span></div>' +
'<div style="margin-top:10px;font-size:.6rem;color:rgba(245,197,24,.5)">Save your Payment ID, then use it in the Confirm section below after sending.</div>';
var cpid = document.getElementById('cpid');
if (cpid) cpid.value = p.paymentId;
}

async function doConfirm() {
var pid = document.getElementById('cpid').value.trim();
var txh = document.getElementById('ctxh').value.trim();
var res = document.getElementById('cres');
if (!pid) { res.className = 'rb gb show'; res.innerHTML = '<span style="color:var(--ac3)">Please enter your Payment ID.</span>'; return; }
try {
const r = await fetch(API + '/api/airpay/confirm', {
method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ paymentId: pid, txHash: txh })
});
const d = await r.json();
res.className = 'rb gb show';
if (d.success) res.innerHTML = '<div><span class="rk">STATUS: </span><span style="color:#4ade80">✓ CONFIRMED — BUNDLE ACTIVE</span></div><div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + pid + '</span></div>';
else res.innerHTML = '<span style="color:var(--ac3)">Error: ' + d.error + '</span>';
} catch(e) {
res.className = 'rb gb show';
res.innerHTML = '<div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + pid + '</span></div>' +
'<div><span class="rk">STATUS: </span><span style="color:#4ade80">✓ CONFIRMED (Demo)</span></div>' +
'<div style="margin-top:8px;font-size:.6rem;color:rgba(245,197,24,.5)">Deploy backend to process real confirmations and activate bundles automatically.</div>';
}
}

/* ===== AIRBANK ===== */
async function loadVault() {
try {
const r = await fetch(API + '/api/airbank/vault');
const d = await r.json();
var storedMB = parseFloat(d.vault && d.vault.storedMB ? d.vault.storedMB : 842000);
document.getElementById('vstore').textContent = fmt(Math.round(storedMB)) + ' AU';
document.getElementById('vtrans').textContent = parseFloat(d.transmissions && d.transmissions.totalGB ? d.transmissions.totalGB : 4700).toFixed(1) + ' GB';
document.getElementById('vrev').textContent = '$' + parseFloat(d.revenue && d.revenue.totalUSD ? d.revenue.totalUSD : 3.47).toFixed(4);
} catch(e) {
document.getElementById('vstore').textContent = '842,000 AU';
document.getElementById('vtrans').textContent = '4,700 GB';
document.getElementById('vrev').textContent = '$3.4700';
}
}

function calcMoney() {
var amt = parseFloat(document.getElementById('camt').value) || 0;
var unit = document.getElementById('cunit').value || 'TB';
var inGB = unit === 'PB' ? amt * 1024 * 1024 : unit === 'TB' ? amt * 1024 : amt;
var storeMo = inGB * 0.0005;
var transUSD = inGB * 0.002;
var monthly = (storeMo + transUSD).toFixed(4);
var yearly = ((storeMo + transUSD) * 12).toFixed(2);
var btcM = ((storeMo + transUSD) * 0.0000155).toFixed(8);
var disp = document.getElementById('cdisplay');
if (disp) disp.innerHTML = '<div>$' + monthly + '/mo</div><div class="cs">$' + yearly + '/yr · ' + btcM + ' BTC/mo</div>';
var res = document.getElementById('cres2');
if (res) {
res.className = 'rb gb show';
res.innerHTML =
'<div><span class="rk">INPUT: </span><span class="rv">' + amt + ' ' + unit + ' (' + fmt(Math.round(inGB)) + ' GB)</span></div>' +
'<div><span class="rk">STORAGE REV/MONTH: </span><span class="rv gd">$' + storeMo.toFixed(4) + '</span></div>' +
'<div><span class="rk">TRANSMISSION REV: </span><span class="rv gd">$' + transUSD.toFixed(4) + '</span></div>' +
'<div><span class="rk">COMBINED / MONTH: </span><span class="rv gd">$' + monthly + '</span></div>' +
'<div><span class="rk">COMBINED / YEAR: </span><span class="rv gd">$' + yearly + '</span></div>' +
'<div><span class="rk">IN BITCOIN / MONTH: </span><span class="rv gd">' + btcM + ' BTC</span></div>';
}
}

/* ===== OWNER DASHBOARD ===== */
async function loadOwner() {
// Pre-fill wallets from localStorage
var wmap = {wbtc:'BTC', weth:'ETH', wusdt:'USDT', wbnb:'BNB', wltc:'LTC'};
Object.keys(wmap).forEach(function(k) {
var el = document.getElementById(k);
if (el && WALLETS[wmap[k]]) el.value = WALLETS[wmap[k]];
});
try {
const [revR, nodesR, vaultR] = await Promise.all([
fetch(API + '/api/airbank/revenue'),
fetch(API + '/api/nodes'),
fetch(API + '/api/airbank/vault')
]);
const rev = await revR.json();
const nodes = await nodesR.json();
const vault = await vaultR.json();
document.getElementById('ort').textContent = '$' + parseFloat(rev.summary && rev.summary.totalUSD ? rev.summary.totalUSD : '3.47').toFixed(4);
document.getElementById('ortb').textContent = (rev.summary ? rev.summary.totalBTC : '0.00005378') + ' BTC';
document.getElementById('orm').textContent = '$' + (rev.summary ? rev.summary.projectedMonthlyUSD : '104.10');
document.getElementById('ore').textContent = fmt(rev.summary ? rev.summary.totalEvents : 200);
document.getElementById('cn').textContent = nodes.count || 142;
document.getElementById('cu').textContent = fmt(2100000);
document.getElementById('cdg').textContent = parseFloat(vault.transmissions && vault.transmissions.totalGB ? vault.transmissions.totalGB : 4700).toFixed(0) + ' GB';
var src = document.getElementById('rev-src');
if (src && rev.bySource && rev.bySource.length) {
src.innerHTML = rev.bySource.map(function(s) {
return '<div><span style="color:var(--mt)">' + s.source + ': </span><span style="color:var(--gd)">$' + parseFloat(s.usd).toFixed(4) + '</span> <span style="color:var(--mt)">(' + s.count + ' events)</span></div>';
}).join('');
} else { setDemoRevSrc(); }
var day = document.getElementById('rev-day');
if (day && rev.byDay && rev.byDay.length) {
day.innerHTML = rev.byDay.slice(0,7).map(function(d) {
return '<div><span style="color:var(--mt)">' + d.day + ': </span><span style="color:var(--gd)">$' + parseFloat(d.usd).toFixed(4) + '</span></div>';
}).join('');
} else { setDemoRevDay(); }
} catch(e) {
document.getElementById('ort').textContent = '$3.4700';
document.getElementById('ortb').textContent = '0.00005378 BTC';
document.getElementById('orm').textContent = '$104.10';
document.getElementById('ore').textContent = '200';
document.getElementById('cn').textContent = '142';
document.getElementById('cu').textContent = '2,100,000';
document.getElementById('cdg').textContent = '4,700 GB';
setDemoRevSrc(); setDemoRevDay();
}
}

function setDemoRevSrc() {
var src = document.getElementById('rev-src');
if (src) src.innerHTML =
'<div><span style="color:var(--mt)">data_transmission: </span><span style="color:var(--gd)">$1.4500</span> <span style="color:var(--mt)">(100 events)</span></div>' +
'<div><span style="color:var(--mt)">active_user: </span><span style="color:var(--gd)">$0.8400</span> <span style="color:var(--mt)">(84 events)</span></div>' +
'<div><span style="color:var(--mt)">airpay: </span><span style="color:var(--gd)">$0.6200</span> <span style="color:var(--mt)">(8 payments)</span></div>' +
'<div><span style="color:var(--mt)">api_call: </span><span style="color:var(--gd)">$0.3100</span> <span style="color:var(--mt)">(62 events)</span></div>' +
'<div><span style="color:var(--mt)">storage: </span><span style="color:var(--gd)">$0.1800</span> <span style="color:var(--mt)">(36 events)</span></div>' +
'<div><span style="color:var(--mt)">sms: </span><span style="color:var(--gd)">$0.0700</span> <span style="color:var(--mt)">(70 events)</span></div>';
}

function setDemoRevDay() {
var day = document.getElementById('rev-day');
var days = ['2025-12-15','2025-12-14','2025-12-13','2025-12-12','2025-12-11','2025-12-10','2025-12-09'];
if (day) day.innerHTML = days.map(function(d) {
return '<div><span style="color:var(--mt)">' + d + ': </span><span style="color:var(--gd)">$' + (0.08 + Math.random() * 0.4).toFixed(4) + '</span></div>';
}).join('');
}

/* ===== LIVE LOG FEED ===== */
var LOG_EVENTS = [
{c:'lg', m:'<strong>Nairobi Node</strong> — 12,440 users allocated free data bundle'},
{c:'lgd', m:'<strong>AirBank</strong> — $0.0024 revenue logged automatically'},
{c:'lb', m:'<strong>AirAPI Gateway</strong> — 50K requests served to Lagos cluster'},
{c:'lgd', m:'<strong>AirPay</strong> — New payment request: 0.000038 BTC pending'},
{c:'lg', m:'<strong>Jakarta Relay</strong> — bandwidth auto-scaled to 340 Gbps'},
{c:'lb', m:'<strong>AirVault</strong> — 80,000 files synced across 8 geo-regions'},
{c:'lgd', m:'<strong>AirBank Vault</strong> — 842,000 AirUnits stored, earning $0.421/mo'},
{c:'lg', m:'<strong>Mumbai Cluster</strong> — 4 new nodes joined the free mesh grid'},
{c:'lgd', m:'<strong>AirPay</strong> — ETH bundle confirmed: Pro 500 GB activated'},
{c:'lg', m:'<strong>Tokyo Hub</strong> — +12 Gbps from commercial surplus pooled'},
{c:'lb', m:'<strong>AirSMS</strong> — 230,000 encrypted messages routed free'},
{c:'lgd', m:'<strong>AirBank</strong> — Active user revenue: $0.001 x 2,100,000 users'},
{c:'lg', m:'<strong>São Paulo</strong> — failover triggered, rerouting via satellite'},
{c:'lb', m:'<strong>London Hub</strong> — 99.99% uptime milestone reached this quarter'},
{c:'lgd', m:'<strong>AirPay</strong> — USDT payment received: Standard 100 GB bundle'}
];

var logIdx = 0;

function addLogEntry(msg, cls, feed) {
if (!feed) return;
var el = document.createElement('div');
el.className = 'le';
var ts = new Date().toLocaleTimeString();
el.innerHTML = '<div class="ld ' + cls + '"></div><div class="lt">' + msg + '<span class="ltm">just now · ' + ts + '</span></div>';
feed.insertBefore(el, feed.children[1] || null);
while (feed.querySelectorAll('.le').length > 8) {
var last = feed.querySelector('.le:last-child');
if (last) last.remove();
}
}

function startFallbackLog() {
setInterval(function() {
var e = LOG_EVENTS[logIdx % LOG_EVENTS.length]; logIdx++;
var feed = document.getElementById('log-home');
if (feed) addLogEntry(e.m, e.c, feed);
}, 3500);
}

/* ===== INIT ===== */
window.addEventListener('load', function() {
loadStats();
initLogs();
startLiveLog();
});

Frontshop

Gift Trust — Mon, 03 Aug 2026 19:29:15 +0000

Liquid syntax error: Unknown tag 'endraw'

SPACESHOP

Gift Trust — Mon, 03 Aug 2026 19:26:12 +0000

Liquid syntax error: Unknown tag 'endraw'

AIRTIMES

Gift Trust — Fri, 10 Jul 2026 08:01:25 +0000

<!DOCTYPE html> AIRTIMES — Global Network of Data & Free Services :root { --bg: #020508; --sf: #060d14; --sf2: #0a1520; --ac: #00ffe0; --ac2: #0077ff; --ac3: #ff4d6d; --gd: #f5c518; --gd2: #ff9f00; --tx: #c8e8ff; --mt: #3a5570; } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { scroll-behavior: smooth; } body { background: var(--bg); color: var(--tx); font-family: 'Space Mono', monospace; overflow-x: hidden; }</li> </ul> <p>.bg-layer { position: fixed; inset: 0; z-index: 0; pointer-events: none;<br> background: radial-gradient(ellipse 80% 60% at 20% 10%, rgba(0,119,255,.07), transparent 70%),<br> radial-gradient(ellipse 60% 50% at 80% 80%, rgba(0,255,224,.06), transparent 70%),<br> radial-gradient(ellipse 40% 40% at 50% 50%, rgba(245,197,24,.03), transparent 70%); }<br> .grid-overlay { position: fixed; inset: 0; z-index: 0; pointer-events: none;<br> background-image: linear-gradient(rgba(0,255,224,.04) 1px, transparent 1px),<br> linear-gradient(90deg, rgba(0,255,224,.04) 1px, transparent 1px);<br> background-size: 48px 48px; animation: gridDrift 30s linear infinite; }<br> @keyframes gridDrift { to { background-position: 48px 48px; } }<br> .scanline { position: fixed; inset: 0; z-index: 1; pointer-events: none;<br> background: repeating-linear-gradient(to bottom, transparent 0, transparent 3px, rgba(0,0,0,.06) 3px, rgba(0,0,0,.06) 4px); }<br> .shell { position: relative; z-index: 2; }</p> <p>/* NAV */<br> nav { display: flex; align-items: center; justify-content: space-between;<br> padding: 15px 38px; border-bottom: 1px solid rgba(0,255,224,.1);<br> backdrop-filter: blur(14px); position: sticky; top: 0; z-index: 200; background: rgba(2,5,8,.9); }<br> .logo { font-family: 'Bebas Neue'; font-size: 1.85rem; letter-spacing: .25em;<br> color: var(--ac); text-shadow: 0 0 24px rgba(0,255,224,.5); cursor: pointer; position: relative; }<br> .logo::after { content: '●'; font-size: .35em; color: var(--ac3);<br> position: absolute; top: 4px; right: -14px; animation: blink 1.4s step-end infinite; }<br> @keyframes blink { 50% { opacity: 0; } }<br> .nl { display: flex; gap: 22px; list-style: none; }<br> .nl a { color: var(--mt); text-decoration: none; font-size: .65rem; letter-spacing: .14em;<br> text-transform: uppercase; transition: color .2s; cursor: pointer; }<br> .nl a:hover { color: var(--ac); }<br> .nl a.ga { color: var(--gd); }<br> .nl a.ga:hover { color: var(--gd2); }<br> .sp { display: flex; align-items: center; gap: 8px; font-size: .6rem; color: var(--ac); letter-spacing: .12em; }<br> .pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--ac);<br> box-shadow: 0 0 8px var(--ac); animation: blink 1.4s step-end infinite; }</p> <p>/* TABS */<br> .tab-bar { display: flex; border-bottom: 1px solid rgba(0,255,224,.08); background: rgba(2,5,8,.75);<br> position: sticky; top: 61px; z-index: 100; backdrop-filter: blur(10px); overflow-x: auto; }<br> .tab { padding: 13px 22px; font-size: .62rem; letter-spacing: .15em; text-transform: uppercase;<br> color: var(--mt); cursor: pointer; border-bottom: 2px solid transparent; transition: all .25s; white-space: nowrap; flex-shrink: 0; }<br> .tab:hover { color: var(--tx); }<br> .tab.active { color: var(--ac); border-bottom-color: var(--ac); }<br> .tab.gt { color: rgba(245,197,24,.5); }<br> .tab.gt:hover { color: var(--gd); }<br> .tab.gt.active { color: var(--gd); border-bottom-color: var(--gd); }</p> <p>/* PAGES */<br> .page { display: none; animation: pi .3s ease; }<br> .page.active { display: block; }<br> @keyframes pi { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }<br> .sec { max-width: 1300px; margin: 0 auto; padding: 56px 40px; }<br> .sl { font-size: .58rem; color: var(--ac); letter-spacing: .28em; text-transform: uppercase; margin-bottom: 8px; }<br> .sl.gd { color: var(--gd); }<br> .st { font-family: 'Bebas Neue'; font-size: 2.8rem; color: #fff; letter-spacing: .05em; margin-bottom: 28px; line-height: 1; }<br> .sub { font-size: .76rem; color: var(--mt); line-height: 1.9; max-width: 640px; margin-bottom: 36px; }</p> <p>/* HERO */<br> .hero { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center;<br> padding: 76px 40px 56px; max-width: 1300px; margin: 0 auto; }<br> .htag { font-size: .62rem; letter-spacing: .24em; text-transform: uppercase;<br> color: var(--ac2); margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }<br> .htag::before { content: ''; width: 30px; height: 1px; background: var(--ac2); }<br> h1 { font-family: 'Bebas Neue'; font-size: clamp(3.2rem,6.5vw,6rem);<br> line-height: .92; letter-spacing: .05em; color: #fff; margin-bottom: 20px; }<br> h1 .t { color: var(--ac); text-shadow: 0 0 25px rgba(0,255,224,.4); }<br> h1 .r { color: var(--ac3); }<br> h1 .g { color: var(--gd); }<br> .hd { font-size: .78rem; line-height: 1.9; color: var(--mt); max-width: 420px; margin-bottom: 32px; }<br> .ha { display: flex; gap: 10px; flex-wrap: wrap; }</p> <p>/* BUTTONS */<br> .btn { border: none; padding: 12px 24px; font-family: 'Space Mono'; font-size: .68rem;<br> font-weight: 700; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: all .25s; }<br> .bp { background: var(--ac); color: #000; clip-path: polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%); }<br> .bp:hover { box-shadow: 0 0 28px rgba(0,255,224,.3); transform: translateY(-2px); }<br> .bg { background: var(--gd); color: #000; clip-path: polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%); }<br> .bg:hover { box-shadow: 0 0 28px rgba(245,197,24,.3); transform: translateY(-2px); }<br> .bs { background: transparent; color: var(--tx); border: 1px solid var(--mt); }<br> .bs:hover { border-color: var(--ac); color: var(--ac); }<br> .bsm { padding: 8px 16px; font-size: .6rem; }</p> <p>/* GLOBE */<br> .gw { position: relative; display: flex; align-items: center; justify-content: center; height: 400px; }<br> .globe { width: 290px; height: 290px; border-radius: 50%;<br> background: radial-gradient(circle at 35% 35%, rgba(0,119,255,.25), transparent 60%),<br> radial-gradient(circle at 50% 50%, #020d1a 40%, #010608 100%);<br> border: 1px solid rgba(0,255,224,.15);<br> box-shadow: 0 0 80px rgba(0,119,255,.2), inset 0 0 60px rgba(0,119,255,.1);<br> animation: gp 6s ease-in-out infinite; }<br> @keyframes gp { 50% { box-shadow: 0 0 120px rgba(0,119,255,.35), inset 0 0 80px rgba(0,119,255,.15); } }<br> .orb { position: absolute; border-radius: 50%; border: 1px solid rgba(0,255,224,.12); }<br> .o1 { width: 370px; height: 370px; animation: os 12s linear infinite; }<br> .o2 { width: 450px; height: 450px; border-color: rgba(0,119,255,.08); animation: os 20s linear infinite reverse; }<br> @keyframes os { to { transform: rotate(360deg); } }<br> .on { position: absolute; width: 8px; height: 8px; border-radius: 50%;<br> background: var(--ac); box-shadow: 0 0 12px var(--ac); top: -4px; left: 50%; transform: translateX(-50%); }<br> .o2 .on { background: var(--ac2); box-shadow: 0 0 12px var(--ac2); }<br> .sig { position: absolute; top: 50%; left: 50%; height: 1px;<br> background: linear-gradient(90deg, rgba(0,255,224,.5), transparent);<br> transform-origin: left; animation: sp 3s ease-in-out infinite; }<br> @keyframes sp { 0% { opacity: 0; width: 0; } 40% { opacity: 1; } 100% { opacity: 0; width: 150px; } }<br> .s1 { transform: rotate(35deg); }<br> .s2 { transform: rotate(135deg); animation-delay: .8s; }<br> .s3 { transform: rotate(220deg); animation-delay: 1.6s; }<br> .s4 { transform: rotate(310deg); animation-delay: 2.4s; }<br> .db { position: absolute; background: rgba(6,13,20,.92); border: 1px solid rgba(0,255,224,.2);<br> padding: 7px 12px; font-size: .57rem; color: var(--ac); letter-spacing: .1em;<br> backdrop-filter: blur(8px); animation: fu 4s ease-in-out infinite; }<br> .db.b1 { top: 46px; left: 4px; }<br> .db.b2 { bottom: 66px; right: -2px; animation-delay: 1.5s; color: var(--ac2); border-color: rgba(0,119,255,.3); }<br> .db.b3 { top: 166px; right: -4px; animation-delay: .8s; color: var(--gd); border-color: rgba(245,197,24,.3); }<br> @keyframes fu { 50% { transform: translateY(-8px); } }</p> <p>/* TICKER */<br> .tw { overflow: hidden; padding: 10px 0; border-top: 1px solid rgba(0,255,224,.07);<br> border-bottom: 1px solid rgba(0,255,224,.07); background: rgba(0,255,224,.02); }<br> .tt { display: flex; gap: 56px; white-space: nowrap; animation: ts 35s linear infinite; }<br> @keyframes ts { to { transform: translateX(-50%); } }<br> .ti { display: flex; align-items: center; gap: 10px; font-size: .62rem;<br> letter-spacing: .14em; text-transform: uppercase; color: var(--mt); }<br> .dot { width: 5px; height: 5px; border-radius: 50%; background: var(--ac); }<br> .dot.gd { background: var(--gd); }</p> <p>/* STATS ROW */<br> .sr { max-width: 1300px; margin: 50px auto; padding: 0 40px;<br> display: grid; grid-template-columns: repeat(4,1fr); gap: 2px; }<br> .sc { background: var(--sf); border: 1px solid rgba(0,255,224,.08);<br> padding: 26px 22px; position: relative; overflow: hidden; transition: border-color .3s; }<br> .sc:hover { border-color: rgba(0,255,224,.2); }<br> .sc::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;<br> background: linear-gradient(90deg, transparent, var(--ac), transparent); opacity: 0; transition: opacity .3s; }<br> .sc:hover::before { opacity: 1; }<br> .sn { font-family: 'Bebas Neue'; font-size: 2.6rem; color: var(--ac); line-height: 1; margin-bottom: 4px; }<br> .sn.b { color: var(--ac2); } .sn.r { color: var(--ac3); } .sn.gd { color: var(--gd); }<br> .sl2 { font-size: .56rem; color: var(--mt); letter-spacing: .18em; text-transform: uppercase; }</p> <p>/* CARDS */<br> .cg { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; }<br> .card { background: var(--sf); border: 1px solid rgba(0,255,224,.07);<br> padding: 30px 24px; position: relative; overflow: hidden; cursor: pointer; transition: all .3s; }<br> .card:hover { background: var(--sf2); border-color: rgba(0,255,224,.2); transform: translateY(-3px); }<br> .card::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px;<br> background: linear-gradient(90deg, var(--ac2), var(--ac));<br> transform: scaleX(0); transform-origin: left; transition: transform .4s; }<br> .card:hover::after { transform: scaleX(1); }<br> .ci { font-size: 1.7rem; margin-bottom: 16px; }<br> .cn { font-family: 'Syne'; font-size: .95rem; font-weight: 700; color: #fff; margin-bottom: 8px; }<br> .cd { font-size: .68rem; line-height: 1.8; color: var(--mt); }<br> .ctag { display: inline-block; margin-top: 14px; font-size: .54rem; letter-spacing: .17em;<br> text-transform: uppercase; color: var(--ac); border: 1px solid rgba(0,255,224,.2); padding: 3px 9px; }<br> .ctag.b { color: var(--ac2); border-color: rgba(0,119,255,.25); }<br> .ctag.r { color: var(--ac3); border-color: rgba(255,77,109,.25); }<br> .ctag.gd { color: var(--gd); border-color: rgba(245,197,24,.25); }</p> <p>/* FORMS */<br> .fp { background: var(--sf); border: 1px solid rgba(0,255,224,.1); padding: 32px; }<br> .fp.gp { border-color: rgba(245,197,24,.2); }<br> .fg { margin-bottom: 14px; }<br> .fl { font-size: .56rem; color: var(--mt); letter-spacing: .2em; text-transform: uppercase; margin-bottom: 6px; display: block; }<br> .fi { background: rgba(0,255,224,.03); border: 1px solid rgba(0,255,224,.15);<br> color: var(--tx); padding: 10px 14px; font-family: 'Space Mono'; font-size: .7rem;<br> outline: none; width: 100%; transition: border-color .2s; }<br> .fi:focus { border-color: var(--ac); }<br> .fi.gi { border-color: rgba(245,197,24,.2); }<br> .fi.gi:focus { border-color: var(--gd); }<br> .fi::placeholder { color: var(--mt); }<br> select.fi option { background: #020508; }<br> .rb { margin-top: 16px; background: rgba(0,255,224,.03); border: 1px solid rgba(0,255,224,.15);<br> padding: 16px; font-size: .67rem; line-height: 2.2; display: none; }<br> .rb.show { display: block; }<br> .rb.gb { border-color: rgba(245,197,24,.2); background: rgba(245,197,24,.02); }<br> .rk { color: var(--mt); } .rv { color: var(--ac); }<br> .rv.gd { color: var(--gd); } .rv.g { color: #4ade80; }</p> <p>/* WALLET GRID */<br> .wg { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; margin-bottom: 28px; }<br> .wc { background: var(--sf); border: 1px solid rgba(245,197,24,.12);<br> padding: 22px 16px; text-align: center; cursor: pointer; transition: all .3s; position: relative; }<br> .wc:hover { border-color: rgba(245,197,24,.4); background: rgba(245,197,24,.04); }<br> .wc.sel { border-color: var(--gd); background: rgba(245,197,24,.06); }<br> .wc.sel::before { content: '✓'; position: absolute; top: 7px; right: 9px; font-size: .58rem; color: var(--gd); }<br> .wi { font-size: 1.9rem; margin-bottom: 7px; }<br> .wco { font-family: 'Bebas Neue'; font-size: 1.15rem; color: var(--gd); letter-spacing: .1em; }<br> .wna { font-size: .55rem; color: var(--mt); letter-spacing: .1em; margin-top: 2px; }<br> .wad { font-size: .46rem; color: rgba(58,85,112,.55); margin-top: 7px; word-break: break-all; line-height: 1.4; }</p> <p>/* BUNDLE GRID */<br> .bg2 { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; margin-bottom: 22px; }<br> .bc { background: var(--sf); border: 1px solid rgba(0,255,224,.08);<br> padding: 20px 14px; text-align: center; cursor: pointer; transition: all .3s; }<br> .bc:hover { border-color: rgba(0,255,224,.25); }<br> .bc.sel { border-color: var(--ac); background: rgba(0,255,224,.04); }<br> .bn { font-family: 'Bebas Neue'; font-size: 1rem; color: #fff; letter-spacing: .1em; }<br> .bdata { font-size: 1.3rem; color: var(--ac); font-family: 'Bebas Neue'; line-height: 1.1; }<br> .bprice { font-size: .6rem; color: var(--mt); margin-top: 4px; }<br> .bbtc { font-size: .56rem; color: var(--gd); margin-top: 2px; }</p> <p>/* AIRBANK */<br> .vd { background: var(--sf); border: 1px solid rgba(0,255,224,.1); padding: 32px; margin-bottom: 2px; }<br> .vn { font-family: 'Bebas Neue'; font-size: 3.5rem; color: var(--ac); line-height: 1; text-shadow: 0 0 40px rgba(0,255,224,.3); }<br> .vu { font-size: .67rem; color: var(--mt); letter-spacing: .24em; text-transform: uppercase; margin-top: 4px; }<br> .rg { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; margin-bottom: 2px; }<br> .rc { background: var(--sf); border: 1px solid rgba(245,197,24,.1); padding: 26px; position: relative; }<br> .rc::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px;<br> background: linear-gradient(90deg, transparent, var(--gd), transparent); }<br> .rn { font-family: 'Bebas Neue'; font-size: 2.3rem; color: var(--gd); line-height: 1; margin-bottom: 4px; }<br> .rl { font-size: .56rem; color: var(--mt); letter-spacing: .17em; text-transform: uppercase; }<br> .rs { font-size: .6rem; color: rgba(245,197,24,.5); margin-top: 4px; }</p> <p>/* PROGRESS */<br> .pr { margin-bottom: 12px; }<br> .pl { display: flex; justify-content: space-between; font-size: .58rem; color: var(--mt); letter-spacing: .1em; margin-bottom: 5px; }<br> .pb { height: 4px; background: rgba(0,255,224,.08); border-radius: 2px; overflow: hidden; }<br> .pf { height: 100%; border-radius: 2px; background: linear-gradient(90deg, var(--ac2), var(--ac));<br> animation: fb 2s ease forwards; transform-origin: left; }<br> @keyframes fb { from { transform: scaleX(0); } to { transform: scaleX(1); } }<br> .pf.gd { background: linear-gradient(90deg, var(--gd2), var(--gd)); }<br> .pf.r { background: linear-gradient(90deg, var(--ac3), #ff9a6c); }</p> <p>/* TABLE */<br> .dt { width: 100%; border-collapse: collapse; font-size: .64rem; }<br> .dt th { color: var(--mt); letter-spacing: .14em; text-transform: uppercase; font-size: .54rem;<br> padding: 9px 13px; text-align: left; border-bottom: 1px solid rgba(0,255,224,.08); }<br> .dt td { padding: 9px 13px; border-bottom: 1px solid rgba(255,255,255,.03); color: var(--tx); }<br> .dt tr:hover td { background: rgba(0,255,224,.02); }<br> .bdg { display: inline-block; padding: 2px 8px; font-size: .5rem; letter-spacing: .1em;<br> text-transform: uppercase; border-radius: 2px; }<br> .bg3 { background: rgba(0,255,224,.1); color: var(--ac); border: 1px solid rgba(0,255,224,.2); }<br> .bgd { background: rgba(245,197,24,.1); color: var(--gd); border: 1px solid rgba(245,197,24,.2); }<br> .br { background: rgba(255,77,109,.1); color: var(--ac3); border: 1px solid rgba(255,77,109,.2); }</p> <p>/* LOG FEED */<br> .lf { background: var(--sf); border: 1px solid rgba(0,255,224,.08); padding: 20px; min-height: 260px; }<br> .le { display: flex; gap: 12px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.03);<br> animation: fi .4s ease; }<br> @keyframes fi { from { opacity: 0; transform: translateX(-8px); } to { opacity: 1; transform: none; } }<br> .ld { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: 5px; }<br> .lg { background: var(--ac); box-shadow: 0 0 8px var(--ac); }<br> .lb { background: var(--ac2); box-shadow: 0 0 8px var(--ac2); }<br> .lr { background: var(--ac3); box-shadow: 0 0 8px var(--ac3); }<br> .lgd { background: var(--gd); box-shadow: 0 0 8px var(--gd); }<br> .lt { font-size: .62rem; line-height: 1.7; color: var(--mt); }<br> .lt strong { color: var(--tx); font-weight: 400; }<br> .ltm { font-size: .54rem; color: rgba(58,85,112,.5); display: block; margin-top: 1px; }</p> <p>/* SVG MAP */<br> .mc { width: 100%; height: 230px; position: relative; margin-top: 18px; }<br> .ms { width: 100%; height: 100%; }</p> <p>/* HIGHLIGHT BOX */<br> .hb { background: rgba(245,197,24,.04); border: 1px solid rgba(245,197,24,.2);<br> padding: 18px 22px; margin-bottom: 22px; }<br> .hb p { font-size: .7rem; line-height: 1.9; color: var(--tx); }<br> .hb strong { color: var(--gd); }</p> <p>/* CALC DISPLAY */<br> .cd { background: #000; border: 1px solid rgba(245,197,24,.2); padding: 18px;<br> font-family: 'Bebas Neue'; font-size: 1.8rem; color: var(--gd);<br> text-align: right; letter-spacing: .1em; min-height: 64px; margin-bottom: 14px; }<br> .cd .cs { font-size: .76rem; color: rgba(245,197,24,.5); font-family: 'Space Mono'; }</p> <p>.copy-btn { background: rgba(245,197,24,.08); border: 1px solid rgba(245,197,24,.2);<br> color: var(--gd); padding: 4px 12px; font-size: .56rem; cursor: pointer;<br> font-family: 'Space Mono'; letter-spacing: .1em; transition: all .2s; }<br> .copy-btn:hover { background: rgba(245,197,24,.18); }</p> <p>.div { border: none; border-top: 1px solid rgba(0,255,224,.06); margin: 36px 0; }<br> .tc { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }<br> .thc { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2px; }</p> <p>/* FOOTER */<br> footer { border-top: 1px solid rgba(0,255,224,.06); padding: 30px 40px;<br> display: flex; align-items: center; justify-content: space-between;<br> max-width: 1300px; margin: 0 auto; }<br> .fl2 { font-family: 'Bebas Neue'; font-size: 1.2rem; color: var(--mt); letter-spacing: .25em; }<br> .fc { font-size: .54rem; color: rgba(58,85,112,.5); letter-spacing: .1em; }<br> .fs { display: flex; align-items: center; gap: 8px; font-size: .58rem; color: var(--ac); letter-spacing: .15em; }</p> <p>@media (max-width: 900px) {<br> .hero { grid-template-columns: 1fr; }<br> .gw { height: 270px; } .globe { width: 220px; height: 220px; }<br> .o1 { width: 280px; height: 280px; } .o2 { width: 350px; height: 350px; }<br> .sr { grid-template-columns: repeat(2,1fr); }<br> .cg { grid-template-columns: 1fr; }<br> .wg { grid-template-columns: repeat(2,1fr); }<br> .bg2 { grid-template-columns: repeat(2,1fr); }<br> .rg { grid-template-columns: 1fr; }<br> .tc { grid-template-columns: 1fr; }<br> .thc { grid-template-columns: 1fr; }<br> .nl { display: none; }<br> nav { padding: 12px 18px; }<br> .sec { padding: 40px 18px; }<br> }<br> AIRTIMES
- Network
- Services
- Nodes
- ₿ AirPay
- 🏦 AirBank
- 👑 Owner
CONNECTING...

🌐 Home
⚡ Services
🔗 Connect
◯ Nodes
📡 Route
₿ AirPay
🏦 AirBank
👑 Owner Dashboard
```
  Global Data Mesh — v3.2.0
  <h1>FREE<br><span>DATA</span> &amp;<br><span>SERVICE</span><br><span>NETWORK</span></h1>
  <p>AIRTIMES delivers free data, connectivity, and digital services to every node on Earth. Users connect free. Owner earns automatically via AirPay crypto payments and AirBank data revenue — around the clock.</p>

    GET FREE ACCESS
    ₿ BUY DATA BUNDLE
    🏦 AirBank







  ▲ 4,700 Gbps THROUGHPUT
  ◯ 142 ACTIVE NODES
  ₿ AUTO-EARNING ACTIVE





<span></span>AIRDATA FREE TIER ACTIVE
<span></span>AIRBANK — $0.0024 REVENUE LOGGED
<span></span>NAIROBI NODE ONLINE
<span></span>AIRPAY — BTC PAYMENT RECEIVED
<span></span>2.1M USERS CONNECTED
<span></span>AIRBANK VAULT — 842 TB STORED
<span></span>JAKARTA HUB — 340 Gbps
<span></span>AUTO-REVENUE TICKING EVERY SESSION
<span></span>AIRTIMES PROTOCOL v3.2 LIVE
<span></span>AIRPAY — ETH BUNDLE CONFIRMED
<span></span>AIRDATA FREE TIER ACTIVE
<span></span>AIRBANK — $0.0024 REVENUE LOGGED
<span></span>NAIROBI NODE ONLINE
<span></span>AIRPAY — BTC PAYMENT RECEIVED
<span></span>2.1M USERS CONNECTED
<span></span>AIRBANK VAULT — 842 TB STORED
<span></span>JAKARTA HUB — 340 Gbps
<span></span>AUTO-REVENUE TICKING EVERY SESSION
<span></span>AIRTIMES PROTOCOL v3.2 LIVE
<span></span>AIRPAY — ETH BUNDLE CONFIRMED




—Active Nodes Worldwide
—Daily Data Delivered (TB)
—Users Served Free
—Auto Revenue Earned (USD)



// Three Systems · One Network
HOW AIRTIMES WORKS


    🌐
    Free Global Network
    Users connect free worldwide via AirData, AirSMS, AirWeb, AirVault, AirAPI, AirRelay. Zero cost to users forever. Powered by surplus bandwidth redistribution across 142+ global nodes.
    FREE FOR ALL USERS


    ₿
    AirPay — Crypto Payments
    Users buy premium data bundles using Bitcoin, Ethereum, USDT, BNB, or Litecoin. Every payment routes directly to the owner's crypto wallet instantly. No middleman, no processor fees.
    BTC · ETH · USDT · BNB · LTC


    🏦
    AirBank — Auto Revenue Engine
    Every byte transmitted earns the owner automatically. Trillions of AirUnits stored in the vault, converted to direct money on every user session. Earn while you sleep.
    EARN AUTOMATICALLY







    📋 Live Network Events


    💰 Revenue Snapshot
    Loading revenue data...
    VIEW FULL OWNER DASHBOARD →









// All Free + Paid Services
WHAT AIRTIMES PROVIDES

  📡AirData — Free Mobile DataZero-cost mobile internet routing through the AIRTIMES mesh. Any device, any carrier, any country. Bandwidth pooled from surplus commercial nodes globally.FREE · UNLIMITED
  💬AirSMS — Global MessagingEnd-to-end encrypted SMS and voice relay across all 193 countries. Delivered free via spare spectrum on partner networks. Auto-revenue for owner per SMS.FREE · E2E ENCRYPTED
  🌐AirWeb — Open BrowserCompressed web proxy serving the full open internet at zero data cost. Optimized for low-bandwidth environments and offline caching. Up to 70% compression ratio.FREE · COMPRESSED
  🔗AirAPI — Open Data GatewayFree access to global datasets: weather, finance, health, transport. 50,000 requests/day per node. Developer-grade REST and WebSocket access.FREE · 50K RPD
  🛰AirRelay — Satellite FallbackWhen ground infrastructure fails, AIRTIMES auto-routes through low-earth-orbit relay partners to maintain continuous free connectivity globally.RESILIENT · AUTO
  💾AirVault — Distributed Storage5 GB of free distributed cloud storage per user. Sharded across 8+ geo-regions for redundancy. Served at zero cost from network surplus capacity.FREE · 5 GB
  ₿AirPay — Crypto Payment GatewayUsers buy premium data bundles with Bitcoin, Ethereum, USDT, BNB, or Litecoin. Payments go directly to the owner's wallet. No middleman. Instant settlement.BTC · ETH · USDT · BNB · LTC
  🏦AirBank — Auto Revenue EngineEvery user session generates automatic revenue for the owner. Trillions of AirUnits stored and converted to direct money. Revenue from data, SMS, API, storage.AUTO REVENUE
  🗺AirRoute — Smart Mesh RoutingDijkstra mesh routing with Haversine geo-scoring. Auto-failover. Multi-hop path optimization. Load rebalancing every 30 seconds across all nodes.AI ROUTING








// Free Access
JOIN THE NETWORK
<p>Register your phone or email to get a free AIRTIMES token. Instantly connected to 142+ nodes worldwide. No credit card. No contracts. Forever free.</p>


    Phone or Email

    Identifier Type
      EmailPhone
    ACTIVATE FREE ACCESS →
    <span>Fill in your details and click activate.</span>


    What you get FREE:

      ✦ AirData — Unlimited free mobile internet<br>
      ✦ AirSMS — Global encrypted messaging<br>
      ✦ AirWeb — Compressed web proxy<br>
      ✦ AirAPI — 50,000 free API calls/day<br>
      ✦ AirVault — 5 GB free cloud storage<br>
      ✦ AirRelay — Satellite connectivity fallback<br>
      ✦ Assigned to nearest global mesh node<br>
      ✦ 10 GB daily data quota<br>

    <hr>
    Want more data? <span>Buy a premium bundle with crypto via AirPay →</span>


<hr>
// Free API Test
AIRAPI GATEWAY


    City (Free Weather)

    GET FREE WEATHER →
    Exchange Rate



        GET RATE


    <span>Results appear here — all free, no API key needed.</span>


    🌐 AirAPI Specs

      ● <span>50,000</span> free calls/day per node<br>
      ● Weather data for all cities worldwide<br>
      ● Live exchange rates (150+ currencies)<br>
      ● Health, transport, finance datasets<br>
      ● REST + WebSocket endpoints<br>
      ● No API key needed for free tier<br>
      ● Each call auto-earns revenue for owner<br>










// Mesh Routing Engine
TEST YOUR ROUTE
<p>Enter your token and destination to compute the optimal mesh path through AIRTIMES global nodes using Haversine geo-scoring and Dijkstra path finding.</p>


    Your Token (from registration)

    Destination

    Service

        AirDataAirSMSAirWeb
        AirAPIAirVaultAirRelay

    COMPUTE ROUTE →


    Run a route test to see your full mesh path, latency estimate, hop count, and protocol details.









// Global Infrastructure
LIVE NODE MAP

  <svg viewBox="0 0 900 240">
    <line x1="0" y1="80" x2="900" y2="80" stroke="" stroke-width="1"></line>
    <line x1="0" y1="160" x2="900" y2="160" stroke="" stroke-width="1"></line>
    <line x1="225" y1="0" x2="225" y2="240" stroke="" stroke-width="1"></line>
    <line x1="450" y1="0" x2="450" y2="240" stroke="" stroke-width="1"></line>
    <line x1="675" y1="0" x2="675" y2="240" stroke="" stroke-width="1"></line>
    <g stroke="" stroke-width="1" fill="none">
      <line x1="80" y1="90" x2="200" y2="70"></line><line x1="200" y1="70" x2="340" y2="100"></line>
      <line x1="340" y1="100" x2="480" y2="80"></line><line x1="480" y1="80" x2="600" y2="110"></line>
      <line x1="600" y1="110" x2="740" y2="90"></line><line x1="740" y1="90" x2="840" y2="100"></line>
      <line x1="200" y1="70" x2="280" y2="150"></line><line x1="480" y1="80" x2="520" y2="170"></line>
      <line x1="600" y1="110" x2="580" y2="180"></line><line x1="80" y1="90" x2="120" y2="180"></line>
    </g>
    <circle r="3" fill=""></circle>
    <circle r="2.5" fill=""></circle>
    <g>
      <circle cx="80" cy="90" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="80" cy="90" r="3.5" fill="#00ffe0"></circle>
      <circle cx="200" cy="70" r="10" fill="" stroke="" stroke-width="1.5"></circle><circle cx="200" cy="70" r="4" fill="#00ffe0"></circle>
      <circle cx="340" cy="100" r="7" fill="" stroke="" stroke-width="1.5"></circle><circle cx="340" cy="100" r="3" fill="#0077ff"></circle>
      <circle cx="480" cy="80" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="480" cy="80" r="4" fill="#f5c518"></circle>
      <circle cx="600" cy="110" r="8" fill="" stroke="" stroke-width="1.5"></circle><circle cx="600" cy="110" r="3.5" fill="#ff4d6d"></circle>
      <circle cx="740" cy="90" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="740" cy="90" r="4" fill="#00ffe0"></circle>
      <circle cx="840" cy="100" r="7" fill="" stroke="" stroke-width="1"></circle><circle cx="840" cy="100" r="3" fill="#00ffe0"></circle>
      <circle cx="120" cy="180" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="120" cy="180" r="2" fill="#0077ff"></circle>
      <circle cx="520" cy="170" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="520" cy="170" r="2" fill="#0077ff"></circle>
      <circle cx="580" cy="180" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="580" cy="180" r="2" fill="#ff4d6d"></circle>
      <circle cx="660" cy="50" r="6" fill="" stroke="" stroke-width="1"></circle><circle cx="660" cy="50" r="2.5" fill="#0077ff"></circle>
      <circle cx="155" cy="105" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="155" cy="105" r="2" fill="#f5c518"></circle>
    </g>
  </svg>

<table id="nodes-table">
  <thead><tr><th>Node ID</th><th>City</th><th>Country</th><th>Operator</th><th>Capacity (Gbps)</th><th>Load</th><th>Status</th></tr></thead>
  <tbody id="nodes-body"><tr><td colspan="7">Loading nodes...</td></tr></tbody>
</table>







// Bitcoin &amp; Crypto Payment Gateway
₿ AIRPAY

  <p>AirPay lets users buy premium data bundles using <strong>Bitcoin, Ethereum, USDT, BNB, or Litecoin</strong>. Every payment goes <strong>directly to the AIRTIMES owner's crypto wallet</strong> — instantly, no middleman, zero processor fees. Select a bundle, choose your crypto, and send payment to the displayed address.</p>


// Owner Wallet Addresses — All Payments Are Sent Directly Here


<hr>
// Select Your Data Bundle
Choose how much premium data you want to purchase:




    ⚡ Generate Payment Address
    Your User ID (optional)

    Pay With

        ₿ Bitcoin (BTC)
        Ξ Ethereum (ETH)
        ₮ Tether USDT (TRC-20)
        ⬡ BNB Coin
        Ł Litecoin (LTC)

    GENERATE PAYMENT ADDRESS →
    <span>Select a bundle above, then click to generate your payment address.</span>


    📋 How AirPay Works

      <span>Step 1.</span> Select a data bundle above<br>
      <span>Step 2.</span> Choose Bitcoin, ETH, USDT, BNB, or LTC<br>
      <span>Step 3.</span> Click "Generate Payment Address"<br>
      <span>Step 4.</span> Send exact crypto amount shown<br>
      <span>Step 5.</span> Bundle activates in 10–60 minutes<br>
      <span>Step 6.</span> Revenue automatically in owner wallet<br>

    <hr>
    All payments go directly to owner's crypto wallets. No processor. No fees. Direct blockchain settlement.



<hr>
// Confirm Your Payment


    Payment ID

    Transaction Hash (TX Hash from blockchain)

    CONFIRM PAYMENT →
    <span>Enter Payment ID + TX hash to confirm your purchase.</span>


    After sending crypto, paste your <span>Payment ID</span> and the <span>transaction hash</span> from your wallet or blockchain explorer. Data bundle activates immediately upon confirmation.









// Data Storage &amp; Automatic Revenue Engine
🏦 AIRBANK

  <p>AirBank is the <strong>financial backbone of AIRTIMES</strong>. Every byte of data transmitted through the network is stored in the AirBank Vault measured in <strong>Trillions of AirUnits</strong>. When users browse, message, stream, or use any AIRTIMES service — the owner <strong>earns money automatically</strong>, around the clock. Data is the currency. Usage is the revenue. Extract data, convert to direct money.</p>





    Vault Storage
    —
    Total AirUnits Stored


    Data Transmitted
    —
    GB Delivered to Users


    Total Revenue Earned
    —
    USD Earned Automatically






    Per GB Transmitted
    $0.002
    Every 1 GB routed = $0.002 earned by owner


    Per Active User / Day
    $0.001
    Every daily user session earns automatically


    Per API Call
    $0.00005
    Every AirAPI request generates revenue



<hr>
// Data → Money Calculator
Enter any amount of stored/transmitted data to see the revenue it generates for the owner:


    $ 0.00Enter amount below to calculate




          GBTBPB



    <span>Enter data amount above to calculate automatic revenue.</span>


    📈 Revenue Sources Breakdown
    <span>Data Transmission</span><span id="pct1">42%</span>
    <span>Active Users (Daily)</span><span id="pct2">24%</span>
    <span>AirPay Bundles</span><span id="pct3">18%</span>
    <span>API Calls</span><span id="pct4">9%</span>
    <span>Storage Fees</span><span id="pct5">5%</span>
    <span>SMS Revenue</span><span id="pct6">2%</span>









// Private Owner Control Panel
👑 OWNER DASHBOARD

  <p>This is your <strong>private revenue command center</strong>. See every dollar earned, every AirPay payment received, every data unit transmitted. <strong>Set your Bitcoin and crypto wallet addresses below</strong> — all AirPay payments route directly to these wallets instantly. You own the network. You own the revenue.</p>



// ₿ Your Crypto Wallet Addresses
Enter your real wallet addresses here. Users see these when paying via AirPay. All payments land directly in your wallets.


    ₿ Bitcoin (BTC) Wallet Address

    Ξ Ethereum (ETH) Wallet Address

    ₮ USDT Wallet (TRC-20 / Tron Network)

    ⬡ BNB Wallet Address

    Ł Litecoin (LTC) Wallet Address


      SAVE WALLET ADDRESSES →



    <span>Enter your real wallet addresses and click Save. These will be shown to users on the AirPay page. For production, set as environment variables on your backend server.</span>




// Revenue Summary

  Total Earned (USD)$—— BTC
  Projected Monthly$—Based on current daily rate
  Revenue Events Logged—Auto-logged transactions




    Revenue by Source
    Loading...


    Daily Revenue (Last 7 Days)
    Loading...





  AirPay Payment History
  <table>
    <thead><tr><th>Payment ID</th><th>Bundle</th><th>Coin</th><th>Amount</th><th>Status</th><th>Date</th></tr></thead>
    <tbody id="pay-hist"><tr><td colspan="6">No payments yet. Share your AirPay page with users to start receiving crypto payments!</td></tr></tbody>
  </table>


<hr>
// Network Control


    Registered Users
    —
    Total on network


    Active Nodes
    —
    Online globally


    Data Routed Today
    —
    GB transmitted
```
AIRTIMES
© 2025 AIRTIMES GLOBAL NETWORK · AirPay · AirBank · All Services Free · All Rights Universal
ALL SYSTEMS OPERATIONAL

/* ===== CONFIG ===== */
const API = (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1')
? 'http://localhost:3001' : '';

/* ===== WALLET STATE (saved in localStorage) ===== */
let WALLETS = {
BTC: localStorage.getItem('w_BTC') || '',
ETH: localStorage.getItem('w_ETH') || '',
USDT: localStorage.getItem('w_USDT') || '',
BNB: localStorage.getItem('w_BNB') || '',
LTC: localStorage.getItem('w_LTC') || ''
};

const COIN_ICONS = { BTC:'₿', ETH:'Ξ', USDT:'₮', BNB:'⬡', LTC:'Ł' };
const COIN_NAMES = { BTC:'Bitcoin', ETH:'Ethereum', USDT:'Tether TRC-20', BNB:'BNB Coin', LTC:'Litecoin' };
const COIN_RATES = { BTC:0.0000155, ETH:0.000290, USDT:1.0, BNB:0.00310, LTC:0.0120 };

const BUNDLES = [
{ id:'starter', name:'Starter', gb:5, usd:0.50, btc:'0.000010' },
{ id:'basic', name:'Basic', gb:20, usd:1.99, btc:'0.000038' },
{ id:'standard', name:'Standard', gb:100, usd:7.99, btc:'0.000150' },
{ id:'pro', name:'Pro', gb:500, usd:29.99, btc:'0.000600' },
{ id:'unlimited', name:'Unlimited', gb:9999, usd:74.99, btc:'0.001500' }
];

let selBundle = null;

/* ===== PAGE SWITCHER ===== */
function P(id) {
document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
const pg = document.getElementById('page-' + id);
if (pg) pg.classList.add('active');
document.querySelectorAll('.tab').forEach(t => {
if (t.getAttribute('onclick') && t.getAttribute('onclick').includes("'" + id + "'")) t.classList.add('active');
});
window.scrollTo({ top: 0, behavior: 'smooth' });
if (id === 'airpay') renderAirPay();
if (id === 'airbank') loadVault();
if (id === 'owner') loadOwner();
if (id === 'nodes') loadNodes();
}

/* ===== HELPERS ===== */
function fmt(n) { return Number(n).toLocaleString(); }
function ac(el, target, sfx, dur) {
if (!el) return;
sfx = sfx || ''; dur = dur || 2000;
let v = 0; const step = target / (dur / 16);
const t = setInterval(function() {
v += step;
if (v >= target) { v = target; clearInterval(t); }
el.textContent = Math.floor(v).toLocaleString() + sfx;
}, 16);
}
function uid() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
var r = Math.random() * 16 | 0;
return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16);
});
}

/* ===== LOAD STATS ===== */
async function loadStats() {
try {
const r = await fetch(API + '/api/stats');
const d = await r.json();
document.getElementById('nst').textContent = 'ALL SYSTEMS OPERATIONAL';
ac(document.getElementById('s1'), d.activeNodes || 142);
ac(document.getElementById('s2'), d.dataTB || 4700, ' TB');
ac(document.getElementById('s3'), d.totalUsers || 2100000);
try {
const rv = await fetch(API + '/api/airbank/revenue');
const rd = await rv.json();
const tot = parseFloat(rd.summary && rd.summary.totalUSD ? rd.summary.totalUSD : '3.47');
document.getElementById('s4').textContent = '$' + tot.toFixed(2);
const rs = document.getElementById('rev-snap');
if (rs) rs.innerHTML =
'<div><span style="color:var(--mt)">Total USD Earned: </span><span style="color:var(--gd)">$' + (rd.summary ? parseFloat(rd.summary.totalUSD).toFixed(4) : '3.4700') + '</span></div>' +
'<div><span style="color:var(--mt)">In Bitcoin: </span><span style="color:var(--gd)">' + (rd.summary ? rd.summary.totalBTC : '0.00005378') + ' BTC</span></div>' +
'<div><span style="color:var(--mt)">Projected Monthly: </span><span style="color:var(--gd)">$' + (rd.summary ? rd.summary.projectedMonthlyUSD : '104.10') + '</span></div>' +
'<div><span style="color:var(--mt)">Revenue Events: </span><span style="color:var(--ac)">' + fmt(rd.summary ? rd.summary.totalEvents : 200) + '</span></div>';
} catch(e) { setDemoRevSnap(); }
} catch(e) {
document.getElementById('nst').textContent = 'DEMO MODE';
ac(document.getElementById('s1'), 142);
ac(document.getElementById('s2'), 4700, ' TB');
ac(document.getElementById('s3'), 2100000);
document.getElementById('s4').textContent = '$3.47';
setDemoRevSnap();
}
}

function setDemoRevSnap() {
const rs = document.getElementById('rev-snap');
if (!rs) return;
rs.innerHTML = '<div><span style="color:var(--mt)">Total USD: </span><span style="color:var(--gd)">$3.47 (Demo)</span></div>' +
'<div><span style="color:var(--mt)">Bitcoin: </span><span style="color:var(--gd)">0.00005378 BTC</span></div>' +
'<div><span style="color:var(--mt)">Monthly Proj: </span><span style="color:var(--gd)">$104.10</span></div>' +
'<div><span style="color:var(--mt)">Events: </span><span style="color:var(--ac)">200 logged</span></div>';
}

/* ===== LOAD NODES ===== */
const DEMO_NODES = [
{id:'NODE-US-NYC01',city:'New York', country:'US',operator:'AT&T Surplus', capacity_gbps:2100,load_percent:52},
{id:'NODE-GB-LDN01',city:'London', country:'GB',operator:'BT Wholesale', capacity_gbps:3400,load_percent:45},
{id:'NODE-KE-NBI01',city:'Nairobi', country:'KE',operator:'Safaricom', capacity_gbps:880, load_percent:78},
{id:'NODE-AE-DXB01',city:'Dubai', country:'AE',operator:'Etisalat', capacity_gbps:1200,load_percent:60},
{id:'NODE-ID-JKT01',city:'Jakarta', country:'ID',operator:'Telkom ID', capacity_gbps:340, load_percent:88},
{id:'NODE-JP-TYO01',city:'Tokyo', country:'JP',operator:'NTT Com', capacity_gbps:2900,load_percent:41},
{id:'NODE-AU-SYD01',city:'Sydney', country:'AU',operator:'Telstra', capacity_gbps:760, load_percent:33},
{id:'NODE-BR-GRU01',city:'Sao Paulo', country:'BR',operator:'Vivo', capacity_gbps:640, load_percent:55},
{id:'NODE-ZA-CPT01',city:'Cape Town', country:'ZA',operator:'MTN SA', capacity_gbps:420, load_percent:29},
{id:'NODE-IN-BOM01',city:'Mumbai', country:'IN',operator:'Airtel', capacity_gbps:980, load_percent:71},
{id:'NODE-SG-SIN01',city:'Singapore', country:'SG',operator:'Singtel', capacity_gbps:1800,load_percent:66},
{id:'NODE-NG-LOS01',city:'Lagos', country:'NG',operator:'MTN Nigeria', capacity_gbps:320, load_percent:82},
{id:'NODE-DE-BER01',city:'Berlin', country:'DE',operator:'Deutsche Telekom', capacity_gbps:1600,load_percent:38},
{id:'NODE-CN-SHA01',city:'Shanghai', country:'CN',operator:'China Telecom', capacity_gbps:2200,load_percent:59},
{id:'NODE-MX-MEX01',city:'Mexico City',country:'MX',operator:'Telmex', capacity_gbps:560, load_percent:44}
];

async function loadNodes() {
try {
const r = await fetch(API + '/api/nodes');
const d = await r.json();
renderNodes(d.nodes || DEMO_NODES);
} catch(e) { renderNodes(DEMO_NODES); }
}

function renderNodes(nodes) {
const tb = document.getElementById('nodes-body');
if (!tb) return;
tb.innerHTML = nodes.map(function(n) {
const hi = n.load_percent > 80;
const bar = '<span style="display:inline-block;width:50px;height:4px;background:rgba(0,255,224,.08);border-radius:2px;vertical-align:middle;margin-left:4px;overflow:hidden"><span style="display:block;height:100%;width:' + n.load_percent + '%;background:' + (hi ? '#ff4d6d' : '#00ffe0') + ';border-radius:2px"></span></span>';
return '<tr><td style="color:var(--ac);font-size:.58rem">' + n.id + '</td><td>' + n.city + '</td><td>' + n.country + '</td><td style="color:var(--mt)">' + n.operator + '</td><td>' + fmt(n.capacity_gbps) + '</td><td>' + n.load_percent + '% ' + bar + '</td><td><span class="bdg bg3">ONLINE</span></td></tr>';
}).join('');
}

/* ===== REGISTER ===== */
async function doRegister() {
const id = document.getElementById('ri').value.trim();
const type = document.getElementById('rtype').value;
const btn = document.getElementById('rbtn');
const res = document.getElementById('rres');
if (!id) { alert('Please enter your phone or email.'); return; }
btn.textContent = 'ACTIVATING...'; btn.disabled = true;
try {
const r = await fetch(API + '/api/register', {
method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ identifier: id, type: type })
});
const d = await r.json();
if (d.success) {
res.className = 'rb show';
res.innerHTML = '<div><span class="rk">STATUS: </span><span class="rv g">✓ FREE ACCESS ACTIVATED</span></div>' +
'<div><span class="rk">USER ID: </span><span class="rv">' + d.userId + '</span></div>' +
'<div><span class="rk">TOKEN: </span><span class="rv" style="font-size:.58rem;word-break:break-all">' + d.token + '</span></div>' +
'<div><span class="rk">NODE: </span><span class="rv">' + (d.assignedNode ? d.assignedNode.city + ', ' + d.assignedNode.country + ' (' + d.assignedNode.latencyMs + 'ms)' : 'London, GB') + '</span></div>' +
'<div><span class="rk">DAILY DATA: </span><span class="rv">' + fmt(d.dailyDataMB || 10240) + ' MB</span></div>' +
'<div><span class="rk">TIER: </span><span class="rv gd">FREE — FOREVER</span></div>';
document.getElementById('rtt').value = d.token;
document.getElementById('puid').value = d.userId;
} else {
res.className = 'rb show';
res.innerHTML = '<span style="color:var(--ac3)">Error: ' + d.error + '</span>';
}
} catch(e) {
var tk = uid();
res.className = 'rb show';
res.innerHTML = '<div><span class="rk">STATUS: </span><span class="rv g">✓ FREE ACCESS ACTIVATED (Demo Mode)</span></div>' +
'<div><span class="rk">IDENTIFIER: </span><span class="rv">' + id + '</span></div>' +
'<div><span class="rk">TOKEN: </span><span class="rv" style="font-size:.58rem">' + tk + '</span></div>' +
'<div><span class="rk">NODE: </span><span class="rv">London, GB — 34ms</span></div>' +
'<div><span class="rk">TIER: </span><span class="rv gd">FREE — FOREVER</span></div>' +
'<div style="margin-top:8px;font-size:.6rem;color:rgba(58,85,112,.7)">Deploy the backend to process real registrations.</div>';
document.getElementById('rtt').value = tk;
document.getElementById('puid').value = 'guest-' + uid().slice(0,8);
}
btn.textContent = 'ACTIVATE FREE ACCESS →'; btn.disabled = false;
}

/* ===== ROUTE ===== */
async function doRoute() {
const token = document.getElementById('rtt').value.trim();
const dest = document.getElementById('rtd').value.trim() || 'google.com';
const service = document.getElementById('rts').value;
const res = document.getElementById('rres2');
res.innerHTML = '<span style="color:var(--mt)">Computing optimal mesh path...</span>';
try {
const r = await fetch(API + '/api/route', {
method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ token: token, destination: dest, service: service })
});
const d = await r.json();
renderRoute(d);
} catch(e) {
renderRoute({
path: [
{ city:'Your Device', country:'--' },
{ city:'London', country:'GB', load:45 },
{ city:'Dubai', country:'AE', load:60 },
{ city: dest, country:'🌐' }
],
hops: 3, estimatedLatencyMs: 112, totalDistanceKm: 9420,
compressed: true, encrypted: true, protocol: 'AIRTIMES/3.2', free: true
});
}
}

function renderRoute(d) {
const res = document.getElementById('rres2');
const hops = d.path || [];
const pathHtml = hops.map(function(h, i) {
return '<div style="display:flex;align-items:center;gap:10px;margin-bottom:6px;font-size:.67rem">' +
'<span style="color:var(--ac);font-size:.58rem">' + String(i).padStart(2,'0') + '</span>' +
'<span style="color:var(--ac)">→</span>' +
'<span style="color:var(--tx)">' + h.city + (h.country && h.country !== '--' ? ' (' + h.country + ')' : '') + '</span>' +
(h.load !== undefined ? '<span style="color:var(--mt);font-size:.56rem">[' + h.load + '% load]</span>' : '') +
'</div>';
}).join('');
res.innerHTML = pathHtml +
'<div style="margin-top:14px;border-top:1px solid rgba(0,255,224,.07);padding-top:14px">' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">HOPS</span><span style="color:var(--ac)">' + (d.hops||3) + '</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">LATENCY</span><span style="color:var(--ac)">' + (d.estimatedLatencyMs||112) + ' ms</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">DISTANCE</span><span style="color:var(--ac)">' + fmt(d.totalDistanceKm||9420) + ' km</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">PROTOCOL</span><span style="color:var(--ac)">' + (d.protocol||'AIRTIMES/3.2') + '</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">COMPRESSED</span><span style="color:var(--ac)">' + (d.compressed?'YES':'NO') + '</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">ENCRYPTED</span><span style="color:var(--ac)">' + (d.encrypted?'YES':'NO') + '</span></div>' +
'<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem"><span style="color:var(--mt)">COST</span><span style="color:var(--gd);font-weight:700">FREE</span></div>' +
'</div>';
}

/* ===== API TESTS ===== */
async function doWeather() {
const city = document.getElementById('wc').value.trim() || 'Lagos';
const res = document.getElementById('apires');
res.innerHTML = '<span style="color:var(--mt)">Fetching weather...</span>'; res.className = 'rb show';
try {
const r = await fetch(API + '/api/airapi/weather?city=' + encodeURIComponent(city));
const d = await r.json();
res.innerHTML = '<div><span class="rk">CITY: </span><span class="rv">' + city + '</span></div>' +
'<div><span class="rk">TEMP: </span><span class="rv">' + d.data.temp_c + '°C</span></div>' +
'<div><span class="rk">CONDITION: </span><span class="rv">' + d.data.condition + '</span></div>' +
'<div><span class="rk">HUMIDITY: </span><span class="rv">' + d.data.humidity + '%</span></div>' +
'<div><span class="rk">WIND: </span><span class="rv">' + d.data.wind_kmh + ' km/h</span></div>' +
'<div><span class="rk">COST: </span><span class="rv gd">FREE</span></div>';
} catch(e) {
var temps = {Lagos:31,Nairobi:22,Jakarta:29,London:12,Tokyo:18,Sydney:24,Dubai:38,Accra:30,Abuja:29};
var t = temps[city] || Math.round(15 + Math.random() * 20);
var conds = ['Clear','Sunny','Cloudy','Partly Cloudy'];
res.innerHTML = '<div><span class="rk">CITY: </span><span class="rv">' + city + '</span></div>' +
'<div><span class="rk">TEMP: </span><span class="rv">' + t + '°C</span></div>' +
'<div><span class="rk">CONDITION: </span><span class="rv">' + conds[Math.floor(Math.random()*conds.length)] + '</span></div>' +
'<div><span class="rk">HUMIDITY: </span><span class="rv">' + Math.round(40+Math.random()*50) + '%</span></div>' +
'<div><span class="rk">COST: </span><span class="rv gd">FREE (Demo)</span></div>';
}
}

async function doExchange() {
var from = document.getElementById('ef').value.trim() || 'USD';
var to = document.getElementById('et').value.trim() || 'NGN';
var res = document.getElementById('apires');
try {
const r = await fetch(API + '/api/airapi/exchange?from=' + from + '&to=' + to);
const d = await r.json();
res.innerHTML = '<div><span class="rk">RATE: </span><span class="rv">1 ' + from + ' = ' + d.rate + ' ' + to + '</span></div><div><span class="rk">COST: </span><span class="rv gd">FREE</span></div>';
} catch(e) {
var rates = {NGN:1580,KES:130,GHS:15,ZAR:18,EUR:0.92,GBP:0.79,JPY:149,BTC:0.0000155,ETH:0.000290};
var rate = rates[to.toUpperCase()] ? rates[to.toUpperCase()] : (0.5+Math.random()*100).toFixed(4);
res.innerHTML = '<div><span class="rk">RATE: </span><span class="rv">1 ' + from + ' = ' + rate + ' ' + to + '</span></div><div><span class="rk">COST: </span><span class="rv gd">FREE (Demo)</span></div>';
}
res.className = 'rb show';
}

/* ===== AIRPAY RENDER ===== */
function renderAirPay() {
// Render wallet grid
var wg = document.getElementById('wallets-grid');
if (wg) {
var coins = ['BTC','ETH','USDT','BNB','LTC'];
wg.innerHTML = coins.map(function(c) {
var addr = WALLETS[c] || '(Not set — enter in Owner Dashboard)';
return '<div class="wc" onclick="selWallet(\'' + c + '\')" id="wcard-' + c + '">' +
'<div class="wi">' + COIN_ICONS[c] + '</div>' +
'<div class="wco">' + c + '</div>' +
'<div class="wna">' + COIN_NAMES[c] + '</div>' +
'<div class="wad">' + addr + '</div>' +
'</div>';
}).join('');
}
// Render bundle grid
var bg = document.getElementById('bundles-grid');
if (bg) {
bg.innerHTML = BUNDLES.map(function(b) {
return '<div class="bc" onclick="selBundle2(\'' + b.id + '\')" id="bc-' + b.id + '">' +
'<div class="bn">' + b.name + '</div>' +
'<div class="bdata">' + (b.gb >= 9999 ? '∞' : b.gb + ' GB') + '</div>' +
'<div class="bprice">$' + b.usd + '</div>' +
'<div class="bbtc">₿ ' + b.btc + '</div>' +
'</div>';
}).join('');
}
// Pre-fill from localStorage
['BTC','ETH','USDT','BNB','LTC'].forEach(function(c) {
var el = document.getElementById('wbtc') || null;
});
}

function selWallet(coin) {
document.querySelectorAll('.wc').forEach(function(c) { c.classList.remove('sel'); });
var el = document.getElementById('wcard-' + coin);
if (el) el.classList.add('sel');
var pc = document.getElementById('pcoin');
if (pc) pc.value = coin;
}

function selBundle2(id) {
document.querySelectorAll('.bc').forEach(function(c) { c.classList.remove('sel'); });
var el = document.getElementById('bc-' + id);
if (el) el.classList.add('sel');
selBundle = id;
}

async function doPayment() {
var bundleId = selBundle;
var coin = document.getElementById('pcoin').value;
var userId = document.getElementById('puid').value.trim();
var res = document.getElementById('pres');
var btn = document.getElementById('pbtn');
if (!bundleId) {
res.className = 'rb gb show';
res.innerHTML = '<span style="color:var(--ac3)">Please select a data bundle above first.</span>';
return;
}
btn.textContent = 'GENERATING...'; btn.disabled = true;
var bundle = BUNDLES.find(function(b) { return b.id === bundleId; });
var rate = COIN_RATES[coin] || 0.0000155;
var amount = (bundle.usd * rate).toFixed(8);
var payId = 'PAY-' + Math.random().toString(36).substr(2,12).toUpperCase();
var walletAddr = WALLETS[coin] || 'SET YOUR ' + coin + ' WALLET IN OWNER DASHBOARD';
try {
const r = await fetch(API + '/api/airpay/pay', {
method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ userId: userId, bundleId: bundleId, coin: coin })
});
const d = await r.json();
if (d.success && d.payment) showPayResult(d.payment);
else throw new Error(d.error || 'API unavailable');
} catch(e) {
showPayResult({ paymentId:payId, bundle:bundle, coin:coin, amount:amount,
walletAddress:walletAddr, amountUSD:bundle.usd,
network: {BTC:'Bitcoin Network',ETH:'Ethereum ERC-20',USDT:'Tron TRC-20',BNB:'BNB Smart Chain',LTC:'Litecoin'}[coin] || coin });
}
btn.textContent = 'GENERATE PAYMENT ADDRESS →'; btn.disabled = false;
}

function showPayResult(p) {
var res = document.getElementById('pres');
res.className = 'rb gb show';
var icon = COIN_ICONS[p.coin] || '₿';
res.innerHTML =
'<div style="text-align:center;margin-bottom:16px">' +
'<div style="font-size:2.5rem">' + icon + '</div>' +
'<div style="font-family:\'Bebas Neue\';font-size:1.8rem;color:var(--gd)">SEND ' + p.amount + ' ' + p.coin + '</div>' +
'<div style="font-size:.62rem;color:var(--mt)">' + (p.network || p.coin) + ' · $' + p.amountUSD + ' USD</div>' +
'</div>' +
'<div style="font-size:.6rem;color:var(--mt);margin-bottom:6px;letter-spacing:.1em;text-transform:uppercase">Send to this wallet address:</div>' +
'<div style="background:rgba(0,0,0,.5);border:1px solid rgba(245,197,24,.2);padding:12px;margin-bottom:12px;word-break:break-all;font-size:.62rem;color:var(--gd);letter-spacing:.05em;font-family:\'Space Mono\'">' + p.walletAddress + '</div>' +
'<div style="display:flex;gap:8px;margin-bottom:14px">' +
'<button class="copy-btn" onclick="navigator.clipboard.writeText(\'' + p.walletAddress.replace(/'/g,"\'") + '\')">COPY ADDRESS</button>' +
'<button class="copy-btn" onclick="navigator.clipboard.writeText(\'' + p.paymentId + '\')">COPY PAY ID</button>' +
'</div>' +
'<div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + p.paymentId + '</span></div>' +
'<div><span class="rk">BUNDLE: </span><span class="rv">' + (p.bundle ? p.bundle.name + ' — ' + (p.bundle.gb >= 9999 ? 'Unlimited' : p.bundle.gb + ' GB') : '') + '</span></div>' +
'<div><span class="rk">AMOUNT: </span><span class="rv gd">' + p.amount + ' ' + p.coin + '</span></div>' +
'<div style="margin-top:10px;font-size:.6rem;color:rgba(245,197,24,.5)">Save your Payment ID, then use it in the Confirm section below after sending.</div>';
var cpid = document.getElementById('cpid');
if (cpid) cpid.value = p.paymentId;
}

async function doConfirm() {
var pid = document.getElementById('cpid').value.trim();
var txh = document.getElementById('ctxh').value.trim();
var res = document.getElementById('cres');
if (!pid) { res.className = 'rb gb show'; res.innerHTML = '<span style="color:var(--ac3)">Please enter your Payment ID.</span>'; return; }
try {
const r = await fetch(API + '/api/airpay/confirm', {
method: 'POST', headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ paymentId: pid, txHash: txh })
});
const d = await r.json();
res.className = 'rb gb show';
if (d.success) res.innerHTML = '<div><span class="rk">STATUS: </span><span style="color:#4ade80">✓ CONFIRMED — BUNDLE ACTIVE</span></div><div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + pid + '</span></div>';
else res.innerHTML = '<span style="color:var(--ac3)">Error: ' + d.error + '</span>';
} catch(e) {
res.className = 'rb gb show';
res.innerHTML = '<div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + pid + '</span></div>' +
'<div><span class="rk">STATUS: </span><span style="color:#4ade80">✓ CONFIRMED (Demo)</span></div>' +
'<div style="margin-top:8px;font-size:.6rem;color:rgba(245,197,24,.5)">Deploy backend to process real confirmations and activate bundles automatically.</div>';
}
}

/* ===== AIRBANK ===== */
async function loadVault() {
try {
const r = await fetch(API + '/api/airbank/vault');
const d = await r.json();
var storedMB = parseFloat(d.vault && d.vault.storedMB ? d.vault.storedMB : 842000);
document.getElementById('vstore').textContent = fmt(Math.round(storedMB)) + ' AU';
document.getElementById('vtrans').textContent = parseFloat(d.transmissions && d.transmissions.totalGB ? d.transmissions.totalGB : 4700).toFixed(1) + ' GB';
document.getElementById('vrev').textContent = '$' + parseFloat(d.revenue && d.revenue.totalUSD ? d.revenue.totalUSD : 3.47).toFixed(4);
} catch(e) {
document.getElementById('vstore').textContent = '842,000 AU';
document.getElementById('vtrans').textContent = '4,700 GB';
document.getElementById('vrev').textContent = '$3.4700';
}
}

function calcMoney() {
var amt = parseFloat(document.getElementById('camt').value) || 0;
var unit = document.getElementById('cunit').value || 'TB';
var inGB = unit === 'PB' ? amt * 1024 * 1024 : unit === 'TB' ? amt * 1024 : amt;
var storeMo = inGB * 0.0005;
var transUSD = inGB * 0.002;
var monthly = (storeMo + transUSD).toFixed(4);
var yearly = ((storeMo + transUSD) * 12).toFixed(2);
var btcM = ((storeMo + transUSD) * 0.0000155).toFixed(8);
var disp = document.getElementById('cdisplay');
if (disp) disp.innerHTML = '<div>$' + monthly + '/mo</div><div class="cs">$' + yearly + '/yr · ' + btcM + ' BTC/mo</div>';
var res = document.getElementById('cres2');
if (res) {
res.className = 'rb gb show';
res.innerHTML =
'<div><span class="rk">INPUT: </span><span class="rv">' + amt + ' ' + unit + ' (' + fmt(Math.round(inGB)) + ' GB)</span></div>' +
'<div><span class="rk">STORAGE REV/MONTH: </span><span class="rv gd">$' + storeMo.toFixed(4) + '</span></div>' +
'<div><span class="rk">TRANSMISSION REV: </span><span class="rv gd">$' + transUSD.toFixed(4) + '</span></div>' +
'<div><span class="rk">COMBINED / MONTH: </span><span class="rv gd">$' + monthly + '</span></div>' +
'<div><span class="rk">COMBINED / YEAR: </span><span class="rv gd">$' + yearly + '</span></div>' +
'<div><span class="rk">IN BITCOIN / MONTH: </span><span class="rv gd">' + btcM + ' BTC</span></div>';
}
}

/* ===== OWNER DASHBOARD ===== */
async function loadOwner() {
// Pre-fill wallets from localStorage
var wmap = {wbtc:'BTC', weth:'ETH', wusdt:'USDT', wbnb:'BNB', wltc:'LTC'};
Object.keys(wmap).forEach(function(k) {
var el = document.getElementById(k);
if (el && WALLETS[wmap[k]]) el.value = WALLETS[wmap[k]];
});
try {
const [revR, nodesR, vaultR] = await Promise.all([
fetch(API + '/api/airbank/revenue'),
fetch(API + '/api/nodes'),
fetch(API + '/api/airbank/vault')
]);
const rev = await revR.json();
const nodes = await nodesR.json();
const vault = await vaultR.json();
document.getElementById('ort').textContent = '$' + parseFloat(rev.summary && rev.summary.totalUSD ? rev.summary.totalUSD : '3.47').toFixed(4);
document.getElementById('ortb').textContent = (rev.summary ? rev.summary.totalBTC : '0.00005378') + ' BTC';
document.getElementById('orm').textContent = '$' + (rev.summary ? rev.summary.projectedMonthlyUSD : '104.10');
document.getElementById('ore').textContent = fmt(rev.summary ? rev.summary.totalEvents : 200);
document.getElementById('cn').textContent = nodes.count || 142;
document.getElementById('cu').textContent = fmt(2100000);
document.getElementById('cdg').textContent = parseFloat(vault.transmissions && vault.transmissions.totalGB ? vault.transmissions.totalGB : 4700).toFixed(0) + ' GB';
var src = document.getElementById('rev-src');
if (src && rev.bySource && rev.bySource.length) {
src.innerHTML = rev.bySource.map(function(s) {
return '<div><span style="color:var(--mt)">' + s.source + ': </span><span style="color:var(--gd)">$' + parseFloat(s.usd).toFixed(4) + '</span> <span style="color:var(--mt)">(' + s.count + ' events)</span></div>';
}).join('');
} else { setDemoRevSrc(); }
var day = document.getElementById('rev-day');
if (day && rev.byDay && rev.byDay.length) {
day.innerHTML = rev.byDay.slice(0,7).map(function(d) {
return '<div><span style="color:var(--mt)">' + d.day + ': </span><span style="color:var(--gd)">$' + parseFloat(d.usd).toFixed(4) + '</span></div>';
}).join('');
} else { setDemoRevDay(); }
} catch(e) {
document.getElementById('ort').textContent = '$3.4700';
document.getElementById('ortb').textContent = '0.00005378 BTC';
document.getElementById('orm').textContent = '$104.10';
document.getElementById('ore').textContent = '200';
document.getElementById('cn').textContent = '142';
document.getElementById('cu').textContent = '2,100,000';
document.getElementById('cdg').textContent = '4,700 GB';
setDemoRevSrc(); setDemoRevDay();
}
}

function setDemoRevSrc() {
var src = document.getElementById('rev-src');
if (src) src.innerHTML =
'<div><span style="color:var(--mt)">data_transmission: </span><span style="color:var(--gd)">$1.4500</span> <span style="color:var(--mt)">(100 events)</span></div>' +
'<div><span style="color:var(--mt)">active_user: </span><span style="color:var(--gd)">$0.8400</span> <span style="color:var(--mt)">(84 events)</span></div>' +
'<div><span style="color:var(--mt)">airpay: </span><span style="color:var(--gd)">$0.6200</span> <span style="color:var(--mt)">(8 payments)</span></div>' +
'<div><span style="color:var(--mt)">api_call: </span><span style="color:var(--gd)">$0.3100</span> <span style="color:var(--mt)">(62 events)</span></div>' +
'<div><span style="color:var(--mt)">storage: </span><span style="color:var(--gd)">$0.1800</span> <span style="color:var(--mt)">(36 events)</span></div>' +
'<div><span style="color:var(--mt)">sms: </span><span style="color:var(--gd)">$0.0700</span> <span style="color:var(--mt)">(70 events)</span></div>';
}

function setDemoRevDay() {
var day = document.getElementById('rev-day');
var days = ['2025-12-15','2025-12-14','2025-12-13','2025-12-12','2025-12-11','2025-12-10','2025-12-09'];
if (day) day.innerHTML = days.map(function(d) {
return '<div><span style="color:var(--mt)">' + d + ': </span><span style="color:var(--gd)">$' + (0.08 + Math.random() * 0.4).toFixed(4) + '</span></div>';
}).join('');
}

function saveWallets() {
var map = {wbtc:'BTC', weth:'ETH', wusdt:'USDT', wbnb:'BNB', wltc:'LTC'};
var saved = [];
Object.keys(map).forEach(function(k) {
var el = document.getElementById(k);
if (el && el.value.trim()) {
WALLETS[map[k]] = el.value.trim();
localStorage.setItem('w_' + map[k], el.value.trim());
saved.push(map[k]);
}
});
var res = document.getElementById('wsres');
if (res) {
res.className = 'rb gb show';
res.innerHTML = '<div><span class="rk">STATUS: </span><span style="color:#4ade80">✓ WALLET ADDRESSES SAVED</span></div>' +
saved.map(function(c) { return '<div><span class="rk">' + c + ': </span><span class="rv gd">' + WALLETS[c] + '</span></div>'; }).join('') +
'<div style="margin-top:10px;font-size:.6rem;color:rgba(245,197,24,.5)">Addresses saved locally and displayed on AirPay page. For production backend, set as OWNER_BTC_WALLET etc. environment variables.</div>';
}
renderAirPay();
}

/* ===== LIVE LOG FEED ===== */
var LOG_EVENTS = [
{c:'lg', m:'<strong>Nairobi Node</strong> — 12,440 users allocated free data bundle'},
{c:'lgd', m:'<strong>AirBank</strong> — $0.0024 revenue logged automatically'},
{c:'lb', m:'<strong>AirAPI Gateway</strong> — 50K requests served to Lagos cluster'},
{c:'lgd', m:'<strong>AirPay</strong> — New payment request: 0.000038 BTC pending'},
{c:'lg', m:'<strong>Jakarta Relay</strong> — bandwidth auto-scaled to 340 Gbps'},
{c:'lb', m:'<strong>AirVault</strong> — 80,000 files synced across 8 geo-regions'},
{c:'lgd', m:'<strong>AirBank Vault</strong> — 842,000 AirUnits stored, earning $0.421/mo'},
{c:'lg', m:'<strong>Mumbai Cluster</strong> — 4 new nodes joined the free mesh grid'},
{c:'lgd', m:'<strong>AirPay</strong> — ETH bundle confirmed: Pro 500 GB activated'},
{c:'lg', m:'<strong>Tokyo Hub</strong> — +12 Gbps from commercial surplus pooled'},
{c:'lb', m:'<strong>AirSMS</strong> — 230,000 encrypted messages routed free'},
{c:'lgd', m:'<strong>AirBank</strong> — Active user revenue: $0.001 x 2,100,000 users'},
{c:'lg', m:'<strong>São Paulo</strong> — failover triggered, rerouting via satellite'},
{c:'lb', m:'<strong>London Hub</strong> — 99.99% uptime milestone reached this quarter'},
{c:'lgd', m:'<strong>AirPay</strong> — USDT payment received: Standard 100 GB bundle'}
];

var logIdx = 0;

function addLogEntry(msg, cls, feed) {
if (!feed) return;
var el = document.createElement('div');
el.className = 'le';
var ts = new Date().toLocaleTimeString();
el.innerHTML = '<div class="ld ' + cls + '"></div><div class="lt">' + msg + '<span class="ltm">just now · ' + ts + '</span></div>';
feed.insertBefore(el, feed.children[1] || null);
while (feed.querySelectorAll('.le').length > 8) {
var last = feed.querySelector('.le:last-child');
if (last) last.remove();
}
}

function initLogs() {
var feed = document.getElementById('log-home');
if (feed) {
LOG_EVENTS.slice(0, 6).forEach(function(e, i) {
setTimeout(function() { addLogEntry(e.m, e.c, feed); }, i * 120);
});
logIdx = 6;
}
}

function startLiveLog() {
try {
var es = new EventSource(API + '/api/events');
es.onmessage = function(ev) {
var d = JSON.parse(ev.data);
var cls = d.type === 'revenue' ? 'lgd' : d.type === 'warning' ? 'lr' : d.type === 'info' ? 'lb' : 'lg';
var feed = document.getElementById('log-home');
if (feed) addLogEntry('<strong>LIVE</strong> — ' + d.message, cls, feed);
};
es.onerror = function() { es.close(); startFallbackLog(); };
} catch(e) { startFallbackLog(); }
}

function startFallbackLog() {
setInterval(function() {
var e = LOG_EVENTS[logIdx % LOG_EVENTS.length]; logIdx++;
var feed = document.getElementById('log-home');
if (feed) addLogEntry(e.m, e.c, feed);
}, 3500);
}

/* ===== INIT ===== */
window.addEventListener('load', function() {
loadStats();
initLogs();
startLiveLog();
});

is a submission for Weekend Challenge: Passion Edition*

What I Built

Demo

Code

How I Built It

Prize Categories

AIRTIMES GLOBAL NETWORK

Gift Trust — Mon, 01 Jun 2026 12:51:56 +0000

<!DOCTYPE html>

AIRTIMES — Global Network of Data & Free Services
:root { --bg: #020508; --sf: #060d14; --sf2: #0a1520; --ac: #00ffe0; --ac2: #0077ff; --ac3: #ff4d6d; --gd: #f5c518; --gd2: #ff9f00; --tx: #c8e8ff; --mt: #3a5570; } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { scroll-behavior: smooth; } body { background: var(--bg); color: var(--tx); font-family: 'Space Mono', monospace; overflow-x: hidden; } .bg-layer { position: fixed; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(ellipse 80% 60% at 20% 10%, rgba(0,119,255,.07), transparent 70%), radial-gradient(ellipse 60% 50% at 80% 80%, rgba(0,255,224,.06), transparent 70%), radial-gradient(ellipse 40% 40% at 50% 50%, rgba(245,197,24,.03), transparent 70%); } .grid-overlay { position: fixed; inset: 0; z-index: 0; pointer-events: none; background-image: linear-gradient(rgba(0,255,224,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(0,255,224,.04) 1px, transparent 1px); background-size: 48px 48px; animation: gridDrift 30s linear infinite; } @keyframes gridDrift { to { background-position: 48px 48px; } } .scanline { position: fixed; inset: 0; z-index: 1; pointer-events: none; background: repeating-linear-gradient(to bottom, transparent 0, transparent 3px, rgba(0,0,0,.06) 3px, rgba(0,0,0,.06) 4px); } .shell { position: relative; z-index: 2; } /* NAV */ nav { display: flex; align-items: center; justify-content: space-between; padding: 15px 38px; border-bottom: 1px solid rgba(0,255,224,.1); backdrop-filter: blur(14px); position: sticky; top: 0; z-index: 200; background: rgba(2,5,8,.9); } .logo { font-family: 'Bebas Neue'; font-size: 1.85rem; letter-spacing: .25em; color: var(--ac); text-shadow: 0 0 24px rgba(0,255,224,.5); cursor: pointer; position: relative; } .logo::after { content: '●'; font-size: .35em; color: var(--ac3); position: absolute; top: 4px; right: -14px; animation: blink 1.4s step-end infinite; } @keyframes blink { 50% { opacity: 0; } } .nl { display: flex; gap: 22px; list-style: none; } .nl a { color: var(--mt); text-decoration: none; font-size: .65rem; letter-spacing: .14em; text-transform: uppercase; transition: color .2s; cursor: pointer; } .nl a:hover { color: var(--ac); } .nl a.ga { color: var(--gd); } .nl a.ga:hover { color: var(--gd2); } .sp { display: flex; align-items: center; gap: 8px; font-size: .6rem; color: var(--ac); letter-spacing: .12em; } .pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--ac); box-shadow: 0 0 8px var(--ac); animation: blink 1.4s step-end infinite; } /* TABS */ .tab-bar { display: flex; border-bottom: 1px solid rgba(0,255,224,.08); background: rgba(2,5,8,.75); position: sticky; top: 61px; z-index: 100; backdrop-filter: blur(10px); overflow-x: auto; } .tab { padding: 13px 22px; font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: var(--mt); cursor: pointer; border-bottom: 2px solid transparent; transition: all .25s; white-space: nowrap; flex-shrink: 0; } .tab:hover { color: var(--tx); } .tab.active { color: var(--ac); border-bottom-color: var(--ac); } .tab.gt { color: rgba(245,197,24,.5); } .tab.gt:hover { color: var(--gd); } .tab.gt.active { color: var(--gd); border-bottom-color: var(--gd); } /* PAGES */ .page { display: none; animation: pi .3s ease; } .page.active { display: block; } @keyframes pi { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } } .sec { max-width: 1300px; margin: 0 auto; padding: 56px 40px; } .sl { font-size: .58rem; color: var(--ac); letter-spacing: .28em; text-transform: uppercase; margin-bottom: 8px; } .sl.gd { color: var(--gd); } .st { font-family: 'Bebas Neue'; font-size: 2.8rem; color: #fff; letter-spacing: .05em; margin-bottom: 28px; line-height: 1; } .sub { font-size: .76rem; color: var(--mt); line-height: 1.9; max-width: 640px; margin-bottom: 36px; } /* HERO */ .hero { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; padding: 76px 40px 56px; max-width: 1300px; margin: 0 auto; } .htag { font-size: .62rem; letter-spacing: .24em; text-transform: uppercase; color: var(--ac2); margin-bottom: 12px; display: flex; align-items: center; gap: 10px; } .htag::before { content: ''; width: 30px; height: 1px; background: var(--ac2); } h1 { font-family: 'Bebas Neue'; font-size: clamp(3.2rem,6.5vw,6rem); line-height: .92; letter-spacing: .05em; color: #fff; margin-bottom: 20px; } h1 .t { color: var(--ac); text-shadow: 0 0 25px rgba(0,255,224,.4); } h1 .r { color: var(--ac3); } h1 .g { color: var(--gd); } .hd { font-size: .78rem; line-height: 1.9; color: var(--mt); max-width: 420px; margin-bottom: 32px; } .ha { display: flex; gap: 10px; flex-wrap: wrap; } /* BUTTONS */ .btn { border: none; padding: 12px 24px; font-family: 'Space Mono'; font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; transition: all .25s; } .bp { background: var(--ac); color: #000; clip-path: polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%); } .bp:hover { box-shadow: 0 0 28px rgba(0,255,224,.3); transform: translateY(-2px); } .bg { background: var(--gd); color: #000; clip-path: polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%); } .bg:hover { box-shadow: 0 0 28px rgba(245,197,24,.3); transform: translateY(-2px); } .bs { background: transparent; color: var(--tx); border: 1px solid var(--mt); } .bs:hover { border-color: var(--ac); color: var(--ac); } .bsm { padding: 8px 16px; font-size: .6rem; } /* GLOBE */ .gw { position: relative; display: flex; align-items: center; justify-content: center; height: 400px; } .globe { width: 290px; height: 290px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, rgba(0,119,255,.25), transparent 60%), radial-gradient(circle at 50% 50%, #020d1a 40%, #010608 100%); border: 1px solid rgba(0,255,224,.15); box-shadow: 0 0 80px rgba(0,119,255,.2), inset 0 0 60px rgba(0,119,255,.1); animation: gp 6s ease-in-out infinite; } @keyframes gp { 50% { box-shadow: 0 0 120px rgba(0,119,255,.35), inset 0 0 80px rgba(0,119,255,.15); } } .orb { position: absolute; border-radius: 50%; border: 1px solid rgba(0,255,224,.12); } .o1 { width: 370px; height: 370px; animation: os 12s linear infinite; } .o2 { width: 450px; height: 450px; border-color: rgba(0,119,255,.08); animation: os 20s linear infinite reverse; } @keyframes os { to { transform: rotate(360deg); } } .on { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: var(--ac); box-shadow: 0 0 12px var(--ac); top: -4px; left: 50%; transform: translateX(-50%); } .o2 .on { background: var(--ac2); box-shadow: 0 0 12px var(--ac2); } .sig { position: absolute; top: 50%; left: 50%; height: 1px; background: linear-gradient(90deg, rgba(0,255,224,.5), transparent); transform-origin: left; animation: sp 3s ease-in-out infinite; } @keyframes sp { 0% { opacity: 0; width: 0; } 40% { opacity: 1; } 100% { opacity: 0; width: 150px; } } .s1 { transform: rotate(35deg); } .s2 { transform: rotate(135deg); animation-delay: .8s; } .s3 { transform: rotate(220deg); animation-delay: 1.6s; } .s4 { transform: rotate(310deg); animation-delay: 2.4s; } .db { position: absolute; background: rgba(6,13,20,.92); border: 1px solid rgba(0,255,224,.2); padding: 7px 12px; font-size: .57rem; color: var(--ac); letter-spacing: .1em; backdrop-filter: blur(8px); animation: fu 4s ease-in-out infinite; } .db.b1 { top: 46px; left: 4px; } .db.b2 { bottom: 66px; right: -2px; animation-delay: 1.5s; color: var(--ac2); border-color: rgba(0,119,255,.3); } .db.b3 { top: 166px; right: -4px; animation-delay: .8s; color: var(--gd); border-color: rgba(245,197,24,.3); } @keyframes fu { 50% { transform: translateY(-8px); } } /* TICKER */ .tw { overflow: hidden; padding: 10px 0; border-top: 1px solid rgba(0,255,224,.07); border-bottom: 1px solid rgba(0,255,224,.07); background: rgba(0,255,224,.02); } .tt { display: flex; gap: 56px; white-space: nowrap; animation: ts 35s linear infinite; } @keyframes ts { to { transform: translateX(-50%); } } .ti { display: flex; align-items: center; gap: 10px; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--mt); } .dot { width: 5px; height: 5px; border-radius: 50%; background: var(--ac); } .dot.gd { background: var(--gd); } /* STATS ROW */ .sr { max-width: 1300px; margin: 50px auto; padding: 0 40px; display: grid; grid-template-columns: repeat(4,1fr); gap: 2px; } .sc { background: var(--sf); border: 1px solid rgba(0,255,224,.08); padding: 26px 22px; position: relative; overflow: hidden; transition: border-color .3s; } .sc:hover { border-color: rgba(0,255,224,.2); } .sc::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--ac), transparent); opacity: 0; transition: opacity .3s; } .sc:hover::before { opacity: 1; } .sn { font-family: 'Bebas Neue'; font-size: 2.6rem; color: var(--ac); line-height: 1; margin-bottom: 4px; } .sn.b { color: var(--ac2); } .sn.r { color: var(--ac3); } .sn.gd { color: var(--gd); } .sl2 { font-size: .56rem; color: var(--mt); letter-spacing: .18em; text-transform: uppercase; } /* CARDS */ .cg { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; } .card { background: var(--sf); border: 1px solid rgba(0,255,224,.07); padding: 30px 24px; position: relative; overflow: hidden; cursor: pointer; transition: all .3s; } .card:hover { background: var(--sf2); border-color: rgba(0,255,224,.2); transform: translateY(-3px); } .card::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, var(--ac2), var(--ac)); transform: scaleX(0); transform-origin: left; transition: transform .4s; } .card:hover::after { transform: scaleX(1); } .ci { font-size: 1.7rem; margin-bottom: 16px; } .cn { font-family: 'Syne'; font-size: .95rem; font-weight: 700; color: #fff; margin-bottom: 8px; } .cd { font-size: .68rem; line-height: 1.8; color: var(--mt); } .ctag { display: inline-block; margin-top: 14px; font-size: .54rem; letter-spacing: .17em; text-transform: uppercase; color: var(--ac); border: 1px solid rgba(0,255,224,.2); padding: 3px 9px; } .ctag.b { color: var(--ac2); border-color: rgba(0,119,255,.25); } .ctag.r { color: var(--ac3); border-color: rgba(255,77,109,.25); } .ctag.gd { color: var(--gd); border-color: rgba(245,197,24,.25); } /* FORMS */ .fp { background: var(--sf); border: 1px solid rgba(0,255,224,.1); padding: 32px; } .fp.gp { border-color: rgba(245,197,24,.2); } .fg { margin-bottom: 14px; } .fl { font-size: .56rem; color: var(--mt); letter-spacing: .2em; text-transform: uppercase; margin-bottom: 6px; display: block; } .fi { background: rgba(0,255,224,.03); border: 1px solid rgba(0,255,224,.15); color: var(--tx); padding: 10px 14px; font-family: 'Space Mono'; font-size: .7rem; outline: none; width: 100%; transition: border-color .2s; } .fi:focus { border-color: var(--ac); } .fi.gi { border-color: rgba(245,197,24,.2); } .fi.gi:focus { border-color: var(--gd); } .fi::placeholder { color: var(--mt); } select.fi option { background: #020508; } .rb { margin-top: 16px; background: rgba(0,255,224,.03); border: 1px solid rgba(0,255,224,.15); padding: 16px; font-size: .67rem; line-height: 2.2; display: none; } .rb.show { display: block; } .rb.gb { border-color: rgba(245,197,24,.2); background: rgba(245,197,24,.02); } .rk { color: var(--mt); } .rv { color: var(--ac); } .rv.gd { color: var(--gd); } .rv.g { color: #4ade80; } /* WALLET GRID */ .wg { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; margin-bottom: 28px; } .wc { background: var(--sf); border: 1px solid rgba(245,197,24,.12); padding: 22px 16px; text-align: center; cursor: pointer; transition: all .3s; position: relative; } .wc:hover { border-color: rgba(245,197,24,.4); background: rgba(245,197,24,.04); } .wc.sel { border-color: var(--gd); background: rgba(245,197,24,.06); } .wc.sel::before { content: '✓'; position: absolute; top: 7px; right: 9px; font-size: .58rem; color: var(--gd); } .wi { font-size: 1.9rem; margin-bottom: 7px; } .wco { font-family: 'Bebas Neue'; font-size: 1.15rem; color: var(--gd); letter-spacing: .1em; } .wna { font-size: .55rem; color: var(--mt); letter-spacing: .1em; margin-top: 2px; } .wad { font-size: .46rem; color: rgba(58,85,112,.55); margin-top: 7px; word-break: break-all; line-height: 1.4; } /* BUNDLE GRID */ .bg2 { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; margin-bottom: 22px; } .bc { background: var(--sf); border: 1px solid rgba(0,255,224,.08); padding: 20px 14px; text-align: center; cursor: pointer; transition: all .3s; } .bc:hover { border-color: rgba(0,255,224,.25); } .bc.sel { border-color: var(--ac); background: rgba(0,255,224,.04); } .bn { font-family: 'Bebas Neue'; font-size: 1rem; color: #fff; letter-spacing: .1em; } .bdata { font-size: 1.3rem; color: var(--ac); font-family: 'Bebas Neue'; line-height: 1.1; } .bprice { font-size: .6rem; color: var(--mt); margin-top: 4px; } .bbtc { font-size: .56rem; color: var(--gd); margin-top: 2px; } /* AIRBANK */ .vd { background: var(--sf); border: 1px solid rgba(0,255,224,.1); padding: 32px; margin-bottom: 2px; } .vn { font-family: 'Bebas Neue'; font-size: 3.5rem; color: var(--ac); line-height: 1; text-shadow: 0 0 40px rgba(0,255,224,.3); } .vu { font-size: .67rem; color: var(--mt); letter-spacing: .24em; text-transform: uppercase; margin-top: 4px; } .rg { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; margin-bottom: 2px; } .rc { background: var(--sf); border: 1px solid rgba(245,197,24,.1); padding: 26px; position: relative; } .rc::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--gd), transparent); } .rn { font-family: 'Bebas Neue'; font-size: 2.3rem; color: var(--gd); line-height: 1; margin-bottom: 4px; } .rl { font-size: .56rem; color: var(--mt); letter-spacing: .17em; text-transform: uppercase; } .rs { font-size: .6rem; color: rgba(245,197,24,.5); margin-top: 4px; } /* PROGRESS */ .pr { margin-bottom: 12px; } .pl { display: flex; justify-content: space-between; font-size: .58rem; color: var(--mt); letter-spacing: .1em; margin-bottom: 5px; } .pb { height: 4px; background: rgba(0,255,224,.08); border-radius: 2px; overflow: hidden; } .pf { height: 100%; border-radius: 2px; background: linear-gradient(90deg, var(--ac2), var(--ac)); animation: fb 2s ease forwards; transform-origin: left; } @keyframes fb { from { transform: scaleX(0); } to { transform: scaleX(1); } } .pf.gd { background: linear-gradient(90deg, var(--gd2), var(--gd)); } .pf.r { background: linear-gradient(90deg, var(--ac3), #ff9a6c); } /* TABLE */ .dt { width: 100%; border-collapse: collapse; font-size: .64rem; } .dt th { color: var(--mt); letter-spacing: .14em; text-transform: uppercase; font-size: .54rem; padding: 9px 13px; text-align: left; border-bottom: 1px solid rgba(0,255,224,.08); } .dt td { padding: 9px 13px; border-bottom: 1px solid rgba(255,255,255,.03); color: var(--tx); } .dt tr:hover td { background: rgba(0,255,224,.02); } .bdg { display: inline-block; padding: 2px 8px; font-size: .5rem; letter-spacing: .1em; text-transform: uppercase; border-radius: 2px; } .bg3 { background: rgba(0,255,224,.1); color: var(--ac); border: 1px solid rgba(0,255,224,.2); } .bgd { background: rgba(245,197,24,.1); color: var(--gd); border: 1px solid rgba(245,197,24,.2); } .br { background: rgba(255,77,109,.1); color: var(--ac3); border: 1px solid rgba(255,77,109,.2); } /* LOG FEED */ .lf { background: var(--sf); border: 1px solid rgba(0,255,224,.08); padding: 20px; min-height: 260px; } .le { display: flex; gap: 12px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.03); animation: fi .4s ease; } @keyframes fi { from { opacity: 0; transform: translateX(-8px); } to { opacity: 1; transform: none; } } .ld { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: 5px; } .lg { background: var(--ac); box-shadow: 0 0 8px var(--ac); } .lb { background: var(--ac2); box-shadow: 0 0 8px var(--ac2); } .lr { background: var(--ac3); box-shadow: 0 0 8px var(--ac3); } .lgd { background: var(--gd); box-shadow: 0 0 8px var(--gd); } .lt { font-size: .62rem; line-height: 1.7; color: var(--mt); } .lt strong { color: var(--tx); font-weight: 400; } .ltm { font-size: .54rem; color: rgba(58,85,112,.5); display: block; margin-top: 1px; } /* SVG MAP */ .mc { width: 100%; height: 230px; position: relative; margin-top: 18px; } .ms { width: 100%; height: 100%; } /* HIGHLIGHT BOX */ .hb { background: rgba(245,197,24,.04); border: 1px solid rgba(245,197,24,.2); padding: 18px 22px; margin-bottom: 22px; } .hb p { font-size: .7rem; line-height: 1.9; color: var(--tx); } .hb strong { color: var(--gd); } /* CALC DISPLAY */ .cd { background: #000; border: 1px solid rgba(245,197,24,.2); padding: 18px; font-family: 'Bebas Neue'; font-size: 1.8rem; color: var(--gd); text-align: right; letter-spacing: .1em; min-height: 64px; margin-bottom: 14px; } .cd .cs { font-size: .76rem; color: rgba(245,197,24,.5); font-family: 'Space Mono'; } .copy-btn { background: rgba(245,197,24,.08); border: 1px solid rgba(245,197,24,.2); color: var(--gd); padding: 4px 12px; font-size: .56rem; cursor: pointer; font-family: 'Space Mono'; letter-spacing: .1em; transition: all .2s; } .copy-btn:hover { background: rgba(245,197,24,.18); } .div { border: none; border-top: 1px solid rgba(0,255,224,.06); margin: 36px 0; } .tc { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; } .thc { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 2px; } /* FOOTER */ footer { border-top: 1px solid rgba(0,255,224,.06); padding: 30px 40px; display: flex; align-items: center; justify-content: space-between; max-width: 1300px; margin: 0 auto; } .fl2 { font-family: 'Bebas Neue'; font-size: 1.2rem; color: var(--mt); letter-spacing: .25em; } .fc { font-size: .54rem; color: rgba(58,85,112,.5); letter-spacing: .1em; } .fs { display: flex; align-items: center; gap: 8px; font-size: .58rem; color: var(--ac); letter-spacing: .15em; } @media (max-width: 900px) { .hero { grid-template-columns: 1fr; } .gw { height: 270px; } .globe { width: 220px; height: 220px; } .o1 { width: 280px; height: 280px; } .o2 { width: 350px; height: 350px; } .sr { grid-template-columns: repeat(2,1fr); } .cg { grid-template-columns: 1fr; } .wg { grid-template-columns: repeat(2,1fr); } .bg2 { grid-template-columns: repeat(2,1fr); } .rg { grid-template-columns: 1fr; } .tc { grid-template-columns: 1fr; } .thc { grid-template-columns: 1fr; } .nl { display: none; } nav { padding: 12px 18px; } .sec { padding: 40px 18px; } }

AIRTIMES

Network
Services
Nodes
₿ AirPay
🏦 AirBank
👑 Owner

CONNECTING...

🌐 Home
⚡ Services
🔗 Connect
◯ Nodes
📡 Route
₿ AirPay
🏦 AirBank
👑 Owner Dashboard

  Global Data Mesh — v3.2.0
  <h1>FREE<br><span>DATA</span> &amp;<br><span>SERVICE</span><br><span>NETWORK</span>

AIRTIMES delivers free data, connectivity, and digital services to every node on Earth. Users connect free. Owner earns automatically via AirPay crypto payments and AirBank data revenue — around the clock.

    GET FREE ACCESS
    ₿ BUY DATA BUNDLE
    🏦 AirBank







  ▲ 4,700 Gbps THROUGHPUT
  ◯ 142 ACTIVE NODES
  ₿ AUTO-EARNING ACTIVE





<span></span>AIRDATA FREE TIER ACTIVE
<span></span>AIRBANK — $0.0024 REVENUE LOGGED
<span></span>NAIROBI NODE ONLINE
<span></span>AIRPAY — BTC PAYMENT RECEIVED
<span></span>2.1M USERS CONNECTED
<span></span>AIRBANK VAULT — 842 TB STORED
<span></span>JAKARTA HUB — 340 Gbps
<span></span>AUTO-REVENUE TICKING EVERY SESSION
<span></span>AIRTIMES PROTOCOL v3.2 LIVE
<span></span>AIRPAY — ETH BUNDLE CONFIRMED
<span></span>AIRDATA FREE TIER ACTIVE
<span></span>AIRBANK — $0.0024 REVENUE LOGGED
<span></span>NAIROBI NODE ONLINE
<span></span>AIRPAY — BTC PAYMENT RECEIVED
<span></span>2.1M USERS CONNECTED
<span></span>AIRBANK VAULT — 842 TB STORED
<span></span>JAKARTA HUB — 340 Gbps
<span></span>AUTO-REVENUE TICKING EVERY SESSION
<span></span>AIRTIMES PROTOCOL v3.2 LIVE
<span></span>AIRPAY — ETH BUNDLE CONFIRMED




—Active Nodes Worldwide
—Daily Data Delivered (TB)
—Users Served Free
—Auto Revenue Earned (USD)



// Three Systems · One Network
HOW AIRTIMES WORKS


    🌐
    Free Global Network
    Users connect free worldwide via AirData, AirSMS, AirWeb, AirVault, AirAPI, AirRelay. Zero cost to users forever. Powered by surplus bandwidth redistribution across 142+ global nodes.
    FREE FOR ALL USERS


    ₿
    AirPay — Crypto Payments
    Users buy premium data bundles using Bitcoin, Ethereum, USDT, BNB, or Litecoin. Every payment routes directly to the owner's crypto wallet instantly. No middleman, no processor fees.
    BTC · ETH · USDT · BNB · LTC


    🏦
    AirBank — Auto Revenue Engine
    Every byte transmitted earns the owner automatically. Trillions of AirUnits stored in the vault, converted to direct money on every user session. Earn while you sleep.
    EARN AUTOMATICALLY







    📋 Live Network Events


    💰 Revenue Snapshot
    Loading revenue data...
    VIEW FULL OWNER DASHBOARD →









// All Free + Paid Services
WHAT AIRTIMES PROVIDES

  📡AirData — Free Mobile DataZero-cost mobile internet routing through the AIRTIMES mesh. Any device, any carrier, any country. Bandwidth pooled from surplus commercial nodes globally.FREE · UNLIMITED
  💬AirSMS — Global MessagingEnd-to-end encrypted SMS and voice relay across all 193 countries. Delivered free via spare spectrum on partner networks. Auto-revenue for owner per SMS.FREE · E2E ENCRYPTED
  🌐AirWeb — Open BrowserCompressed web proxy serving the full open internet at zero data cost. Optimized for low-bandwidth environments and offline caching. Up to 70% compression ratio.FREE · COMPRESSED
  🔗AirAPI — Open Data GatewayFree access to global datasets: weather, finance, health, transport. 50,000 requests/day per node. Developer-grade REST and WebSocket access.FREE · 50K RPD
  🛰AirRelay — Satellite FallbackWhen ground infrastructure fails, AIRTIMES auto-routes through low-earth-orbit relay partners to maintain continuous free connectivity globally.RESILIENT · AUTO
  💾AirVault — Distributed Storage5 GB of free distributed cloud storage per user. Sharded across 8+ geo-regions for redundancy. Served at zero cost from network surplus capacity.FREE · 5 GB
  ₿AirPay — Crypto Payment GatewayUsers buy premium data bundles with Bitcoin, Ethereum, USDT, BNB, or Litecoin. Payments go directly to the owner's wallet. No middleman. Instant settlement.BTC · ETH · USDT · BNB · LTC
  🏦AirBank — Auto Revenue EngineEvery user session generates automatic revenue for the owner. Trillions of AirUnits stored and converted to direct money. Revenue from data, SMS, API, storage.AUTO REVENUE
  🗺AirRoute — Smart Mesh RoutingDijkstra mesh routing with Haversine geo-scoring. Auto-failover. Multi-hop path optimization. Load rebalancing every 30 seconds across all nodes.AI ROUTING








// Free Access
JOIN THE NETWORK
<p>Register your phone or email to get a free AIRTIMES token. Instantly connected to 142+ nodes worldwide. No credit card. No contracts. Forever free.</p>


    Phone or Email

    Identifier Type
      EmailPhone
    ACTIVATE FREE ACCESS →
    <span>Fill in your details and click activate.</span>


    What you get FREE:

      ✦ AirData — Unlimited free mobile internet<br>
      ✦ AirSMS — Global encrypted messaging<br>
      ✦ AirWeb — Compressed web proxy<br>
      ✦ AirAPI — 50,000 free API calls/day<br>
      ✦ AirVault — 5 GB free cloud storage<br>
      ✦ AirRelay — Satellite connectivity fallback<br>
      ✦ Assigned to nearest global mesh node<br>
      ✦ 10 GB daily data quota<br>

    <hr>
    Want more data? <span>Buy a premium bundle with crypto via AirPay →</span>


<hr>
// Free API Test
AIRAPI GATEWAY


    City (Free Weather)

    GET FREE WEATHER →
    Exchange Rate



        GET RATE


    <span>Results appear here — all free, no API key needed.</span>


    🌐 AirAPI Specs

      ● <span>50,000</span> free calls/day per node<br>
      ● Weather data for all cities worldwide<br>
      ● Live exchange rates (150+ currencies)<br>
      ● Health, transport, finance datasets<br>
      ● REST + WebSocket endpoints<br>
      ● No API key needed for free tier<br>
      ● Each call auto-earns revenue for owner<br>










// Mesh Routing Engine
TEST YOUR ROUTE
<p>Enter your token and destination to compute the optimal mesh path through AIRTIMES global nodes using Haversine geo-scoring and Dijkstra path finding.</p>


    Your Token (from registration)

    Destination

    Service

        AirDataAirSMSAirWeb
        AirAPIAirVaultAirRelay

    COMPUTE ROUTE →


    Run a route test to see your full mesh path, latency estimate, hop count, and protocol details.









// Global Infrastructure
LIVE NODE MAP

  <svg>
    <line x1="0" y1="80" x2="900" y2="80" stroke="" stroke-width="1"></line>
    <line x1="0" y1="160" x2="900" y2="160" stroke="" stroke-width="1"></line>
    <line x1="225" y1="0" x2="225" y2="240" stroke="" stroke-width="1"></line>
    <line x1="450" y1="0" x2="450" y2="240" stroke="" stroke-width="1"></line>
    <line x1="675" y1="0" x2="675" y2="240" stroke="" stroke-width="1"></line>
    <g stroke="" stroke-width="1" fill="none">
      <line x1="80" y1="90" x2="200" y2="70"></line><line x1="200" y1="70" x2="340" y2="100"></line>
      <line x1="340" y1="100" x2="480" y2="80"></line><line x1="480" y1="80" x2="600" y2="110"></line>
      <line x1="600" y1="110" x2="740" y2="90"></line><line x1="740" y1="90" x2="840" y2="100"></line>
      <line x1="200" y1="70" x2="280" y2="150"></line><line x1="480" y1="80" x2="520" y2="170"></line>
      <line x1="600" y1="110" x2="580" y2="180"></line><line x1="80" y1="90" x2="120" y2="180"></line>
    </g>
    <circle r="3" fill=""><path d="M80,90 L200,70 L340,100 L480,80 L600,110 L740,90 L840,100"></path></circle>
    <circle r="2.5" fill=""><path d="M840,100 L740,90 L600,110 L480,80 L340,100 L200,70 L80,90"></path></circle>
    <g>
      <circle cx="80" cy="90" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="80" cy="90" r="3.5" fill="#00ffe0"></circle>NYC
      <circle cx="200" cy="70" r="10" fill="" stroke="" stroke-width="1.5"></circle><circle cx="200" cy="70" r="4" fill="#00ffe0"></circle>LDN
      <circle cx="340" cy="100" r="7" fill="" stroke="" stroke-width="1.5"></circle><circle cx="340" cy="100" r="3" fill="#0077ff"></circle>NBI
      <circle cx="480" cy="80" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="480" cy="80" r="4" fill="#f5c518"></circle>DXB
      <circle cx="600" cy="110" r="8" fill="" stroke="" stroke-width="1.5"></circle><circle cx="600" cy="110" r="3.5" fill="#ff4d6d"></circle>JKT
      <circle cx="740" cy="90" r="9" fill="" stroke="" stroke-width="1.5"></circle><circle cx="740" cy="90" r="4" fill="#00ffe0"></circle>TYO
      <circle cx="840" cy="100" r="7" fill="" stroke="" stroke-width="1"></circle><circle cx="840" cy="100" r="3" fill="#00ffe0"></circle>SYD
      <circle cx="120" cy="180" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="120" cy="180" r="2" fill="#0077ff"></circle>GRU
      <circle cx="520" cy="170" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="520" cy="170" r="2" fill="#0077ff"></circle>BOM
      <circle cx="580" cy="180" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="580" cy="180" r="2" fill="#ff4d6d"></circle>SIN
      <circle cx="660" cy="50" r="6" fill="" stroke="" stroke-width="1"></circle><circle cx="660" cy="50" r="2.5" fill="#0077ff"></circle>SHA
      <circle cx="155" cy="105" r="5" fill="" stroke="" stroke-width="1"></circle><circle cx="155" cy="105" r="2" fill="#f5c518"></circle>LOS
    </g>
  </svg>

<table id="nodes-table">
  <thead><tr>

Node ID
City
Country
Operator
Capacity (Gbps)
Load
Status

Loading nodes...

// Bitcoin &amp; Crypto Payment Gateway
₿ AIRPAY

  <p>AirPay lets users buy premium data bundles using <strong>Bitcoin, Ethereum, USDT, BNB, or Litecoin</strong>. Every payment goes <strong>directly to the AIRTIMES owner's crypto wallet</strong> — instantly, no middleman, zero processor fees. Select a bundle, choose your crypto, and send payment to the displayed address.</p>


// Owner Wallet Addresses — All Payments Are Sent Directly Here


<hr>
// Select Your Data Bundle
Choose how much premium data you want to purchase:




    ⚡ Generate Payment Address
    Your User ID (optional)

    Pay With

        ₿ Bitcoin (BTC)
        Ξ Ethereum (ETH)
        ₮ Tether USDT (TRC-20)
        ⬡ BNB Coin
        Ł Litecoin (LTC)

    GENERATE PAYMENT ADDRESS →
    <span>Select a bundle above, then click to generate your payment address.</span>


    📋 How AirPay Works

      <span>Step 1.</span> Select a data bundle above<br>
      <span>Step 2.</span> Choose Bitcoin, ETH, USDT, BNB, or LTC<br>
      <span>Step 3.</span> Click "Generate Payment Address"<br>
      <span>Step 4.</span> Send exact crypto amount shown<br>
      <span>Step 5.</span> Bundle activates in 10–60 minutes<br>
      <span>Step 6.</span> Revenue automatically in owner wallet<br>

    <hr>
    All payments go directly to owner's crypto wallets. No processor. No fees. Direct blockchain settlement.



<hr>
// Confirm Your Payment


    Payment ID

    Transaction Hash (TX Hash from blockchain)

    CONFIRM PAYMENT →
    <span>Enter Payment ID + TX hash to confirm your purchase.</span>


    After sending crypto, paste your <span>Payment ID</span> and the <span>transaction hash</span> from your wallet or blockchain explorer. Data bundle activates immediately upon confirmation.









// Data Storage &amp; Automatic Revenue Engine
🏦 AIRBANK

  <p>AirBank is the <strong>financial backbone of AIRTIMES</strong>. Every byte of data transmitted through the network is stored in the AirBank Vault measured in <strong>Trillions of AirUnits</strong>. When users browse, message, stream, or use any AIRTIMES service — the owner <strong>earns money automatically</strong>, around the clock. Data is the currency. Usage is the revenue. Extract data, convert to direct money.</p>





    Vault Storage
    —
    Total AirUnits Stored


    Data Transmitted
    —
    GB Delivered to Users


    Total Revenue Earned
    —
    USD Earned Automatically






    Per GB Transmitted
    $0.002
    Every 1 GB routed = $0.002 earned by owner


    Per Active User / Day
    $0.001
    Every daily user session earns automatically


    Per API Call
    $0.00005
    Every AirAPI request generates revenue



<hr>
// Data → Money Calculator
Enter any amount of stored/transmitted data to see the revenue it generates for the owner:


    $ 0.00Enter amount below to calculate




          GBTBPB



    <span>Enter data amount above to calculate automatic revenue.</span>


    📈 Revenue Sources Breakdown
    <span>Data Transmission</span><span id="pct1">42%</span>
    <span>Active Users (Daily)</span><span id="pct2">24%</span>
    <span>AirPay Bundles</span><span id="pct3">18%</span>
    <span>API Calls</span><span id="pct4">9%</span>
    <span>Storage Fees</span><span id="pct5">5%</span>
    <span>SMS Revenue</span><span id="pct6">2%</span>









// Private Owner Control Panel
👑 OWNER DASHBOARD

  <p>This is your <strong>private revenue command center</strong>. See every dollar earned, every AirPay payment received, every data unit transmitted. <strong>Set your Bitcoin and crypto wallet addresses below</strong> — all AirPay payments route directly to these wallets instantly. You own the network. You own the revenue.</p>



// ₿ Your Crypto Wallet Addresses
Enter your real wallet addresses here. Users see these when paying via AirPay. All payments land directly in your wallets.


    ₿ Bitcoin (BTC) Wallet Address

    Ξ Ethereum (ETH) Wallet Address

    ₮ USDT Wallet (TRC-20 / Tron Network)

    ⬡ BNB Wallet Address

    Ł Litecoin (LTC) Wallet Address


      SAVE WALLET ADDRESSES →



    <span>Enter your real wallet addresses and click Save. These will be shown to users on the AirPay page. For production, set as environment variables on your backend server.</span>




// Revenue Summary

  Total Earned (USD)$—— BTC
  Projected Monthly$—Based on current daily rate
  Revenue Events Logged—Auto-logged transactions




    Revenue by Source
    Loading...


    Daily Revenue (Last 7 Days)
    Loading...





  AirPay Payment History
  <table>
    <thead><tr>

Payment ID
Bundle
Coin
Amount
Status
Date

No payments yet. Share your AirPay page with users to start receiving crypto payments!

<hr>
// Network Control


    Registered Users
    —
    Total on network


    Active Nodes
    —
    Online globally


    Data Routed Today
    —
    GB transmitted

AIRTIMES
© 2025 AIRTIMES GLOBAL NETWORK · AirPay · AirBank · All Services Free · All Rights Universal
ALL SYSTEMS OPERATIONAL

/* ===== CONFIG ===== */ const API = (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1') ? 'http://localhost:3001' : ''; /* ===== WALLET STATE (saved in localStorage) ===== */ let WALLETS = { BTC: localStorage.getItem('w_BTC') || '', ETH: localStorage.getItem('w_ETH') || '', USDT: localStorage.getItem('w_USDT') || '', BNB: localStorage.getItem('w_BNB') || '', LTC: localStorage.getItem('w_LTC') || '' }; const COIN_ICONS = { BTC:'₿', ETH:'Ξ', USDT:'₮', BNB:'⬡', LTC:'Ł' }; const COIN_NAMES = { BTC:'Bitcoin', ETH:'Ethereum', USDT:'Tether TRC-20', BNB:'BNB Coin', LTC:'Litecoin' }; const COIN_RATES = { BTC:0.0000155, ETH:0.000290, USDT:1.0, BNB:0.00310, LTC:0.0120 }; const BUNDLES = [ { id:'starter', name:'Starter', gb:5, usd:0.50, btc:'0.000010' }, { id:'basic', name:'Basic', gb:20, usd:1.99, btc:'0.000038' }, { id:'standard', name:'Standard', gb:100, usd:7.99, btc:'0.000150' }, { id:'pro', name:'Pro', gb:500, usd:29.99, btc:'0.000600' }, { id:'unlimited', name:'Unlimited', gb:9999, usd:74.99, btc:'0.001500' } ]; let selBundle = null; /* ===== PAGE SWITCHER ===== */ function P(id) { document.querySelectorAll('.page').forEach(p => p.classList.remove('active')); document.querySelectorAll('.tab').forEach(t => t.classList.remove('active')); const pg = document.getElementById('page-' + id); if (pg) pg.classList.add('active'); document.querySelectorAll('.tab').forEach(t => { if (t.getAttribute('onclick') && t.getAttribute('onclick').includes("'" + id + "'")) t.classList.add('active'); }); window.scrollTo({ top: 0, behavior: 'smooth' }); if (id === 'airpay') renderAirPay(); if (id === 'airbank') loadVault(); if (id === 'owner') loadOwner(); if (id === 'nodes') loadNodes(); } /* ===== HELPERS ===== */ function fmt(n) { return Number(n).toLocaleString(); } function ac(el, target, sfx, dur) { if (!el) return; sfx = sfx || ''; dur = dur || 2000; let v = 0; const step = target / (dur / 16); const t = setInterval(function() { v += step; if (v >= target) { v = target; clearInterval(t); } el.textContent = Math.floor(v).toLocaleString() + sfx; }, 16); } function uid() { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { var r = Math.random() * 16 | 0; return (c === 'x' ? r : (r & 0x3 | 0x8)).toString(16); }); } /* ===== LOAD STATS ===== */ async function loadStats() { try { const r = await fetch(API + '/api/stats'); const d = await r.json(); document.getElementById('nst').textContent = 'ALL SYSTEMS OPERATIONAL'; ac(document.getElementById('s1'), d.activeNodes || 142); ac(document.getElementById('s2'), d.dataTB || 4700, ' TB'); ac(document.getElementById('s3'), d.totalUsers || 2100000); try { const rv = await fetch(API + '/api/airbank/revenue'); const rd = await rv.json(); const tot = parseFloat(rd.summary && rd.summary.totalUSD ? rd.summary.totalUSD : '3.47'); document.getElementById('s4').textContent = '$' + tot.toFixed(2); const rs = document.getElementById('rev-snap'); if (rs) rs.innerHTML = '<div><span style="color:var(--mt)">Total USD Earned: </span><span style="color:var(--gd)">$' + (rd.summary ? parseFloat(rd.summary.totalUSD).toFixed(4) : '3.4700') + '</span></div>' + '<div><span style="color:var(--mt)">In Bitcoin: </span><span style="color:var(--gd)">' + (rd.summary ? rd.summary.totalBTC : '0.00005378') + ' BTC</span></div>' + '<div><span style="color:var(--mt)">Projected Monthly: </span><span style="color:var(--gd)">$' + (rd.summary ? rd.summary.projectedMonthlyUSD : '104.10') + '</span></div>' + '<div><span style="color:var(--mt)">Revenue Events: </span><span style="color:var(--ac)">' + fmt(rd.summary ? rd.summary.totalEvents : 200) + '</span></div>'; } catch(e) { setDemoRevSnap(); } } catch(e) { document.getElementById('nst').textContent = 'DEMO MODE'; ac(document.getElementById('s1'), 142); ac(document.getElementById('s2'), 4700, ' TB'); ac(document.getElementById('s3'), 2100000); document.getElementById('s4').textContent = '$3.47'; setDemoRevSnap(); } } function setDemoRevSnap() { const rs = document.getElementById('rev-snap'); if (!rs) return; rs.innerHTML = '<div><span style="color:var(--mt)">Total USD: </span><span style="color:var(--gd)">$3.47 (Demo)</span></div>' + '<div><span style="color:var(--mt)">Bitcoin: </span><span style="color:var(--gd)">0.00005378 BTC</span></div>' + '<div><span style="color:var(--mt)">Monthly Proj: </span><span style="color:var(--gd)">$104.10</span></div>' + '<div><span style="color:var(--mt)">Events: </span><span style="color:var(--ac)">200 logged</span></div>'; } /* ===== LOAD NODES ===== */ const DEMO_NODES = [ {id:'NODE-US-NYC01',city:'New York', country:'US',operator:'AT&T Surplus', capacity_gbps:2100,load_percent:52}, {id:'NODE-GB-LDN01',city:'London', country:'GB',operator:'BT Wholesale', capacity_gbps:3400,load_percent:45}, {id:'NODE-KE-NBI01',city:'Nairobi', country:'KE',operator:'Safaricom', capacity_gbps:880, load_percent:78}, {id:'NODE-AE-DXB01',city:'Dubai', country:'AE',operator:'Etisalat', capacity_gbps:1200,load_percent:60}, {id:'NODE-ID-JKT01',city:'Jakarta', country:'ID',operator:'Telkom ID', capacity_gbps:340, load_percent:88}, {id:'NODE-JP-TYO01',city:'Tokyo', country:'JP',operator:'NTT Com', capacity_gbps:2900,load_percent:41}, {id:'NODE-AU-SYD01',city:'Sydney', country:'AU',operator:'Telstra', capacity_gbps:760, load_percent:33}, {id:'NODE-BR-GRU01',city:'Sao Paulo', country:'BR',operator:'Vivo', capacity_gbps:640, load_percent:55}, {id:'NODE-ZA-CPT01',city:'Cape Town', country:'ZA',operator:'MTN SA', capacity_gbps:420, load_percent:29}, {id:'NODE-IN-BOM01',city:'Mumbai', country:'IN',operator:'Airtel', capacity_gbps:980, load_percent:71}, {id:'NODE-SG-SIN01',city:'Singapore', country:'SG',operator:'Singtel', capacity_gbps:1800,load_percent:66}, {id:'NODE-NG-LOS01',city:'Lagos', country:'NG',operator:'MTN Nigeria', capacity_gbps:320, load_percent:82}, {id:'NODE-DE-BER01',city:'Berlin', country:'DE',operator:'Deutsche Telekom', capacity_gbps:1600,load_percent:38}, {id:'NODE-CN-SHA01',city:'Shanghai', country:'CN',operator:'China Telecom', capacity_gbps:2200,load_percent:59}, {id:'NODE-MX-MEX01',city:'Mexico City',country:'MX',operator:'Telmex', capacity_gbps:560, load_percent:44} ]; async function loadNodes() { try { const r = await fetch(API + '/api/nodes'); const d = await r.json(); renderNodes(d.nodes || DEMO_NODES); } catch(e) { renderNodes(DEMO_NODES); } } function renderNodes(nodes) { const tb = document.getElementById('nodes-body'); if (!tb) return; tb.innerHTML = nodes.map(function(n) { const hi = n.load_percent > 80; const bar = '<span style="display:inline-block;width:50px;height:4px;background:rgba(0,255,224,.08);border-radius:2px;vertical-align:middle;margin-left:4px;overflow:hidden"><span style="display:block;height:100%;width:' + n.load_percent + '%;background:' + (hi ? '#ff4d6d' : '#00ffe0') + ';border-radius:2px"></span></span>'; return '<tr><td style="color:var(--ac);font-size:.58rem">' + n.id + '</td><td>' + n.city + '</td><td>' + n.country + '</td><td style="color:var(--mt)">' + n.operator + '</td><td>' + fmt(n.capacity_gbps) + '</td><td>' + n.load_percent + '% ' + bar + '</td><td><span class="bdg bg3">ONLINE</span></td></tr>'; }).join(''); } /* ===== REGISTER ===== */ async function doRegister() { const id = document.getElementById('ri').value.trim(); const type = document.getElementById('rtype').value; const btn = document.getElementById('rbtn'); const res = document.getElementById('rres'); if (!id) { alert('Please enter your phone or email.'); return; } btn.textContent = 'ACTIVATING...'; btn.disabled = true; try { const r = await fetch(API + '/api/register', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ identifier: id, type: type }) }); const d = await r.json(); if (d.success) { res.className = 'rb show'; res.innerHTML = '<div><span class="rk">STATUS: </span><span class="rv g">✓ FREE ACCESS ACTIVATED</span></div>' + '<div><span class="rk">USER ID: </span><span class="rv">' + d.userId + '</span></div>' + '<div><span class="rk">TOKEN: </span><span class="rv" style="font-size:.58rem;word-break:break-all">' + d.token + '</span></div>' + '<div><span class="rk">NODE: </span><span class="rv">' + (d.assignedNode ? d.assignedNode.city + ', ' + d.assignedNode.country + ' (' + d.assignedNode.latencyMs + 'ms)' : 'London, GB') + '</span></div>' + '<div><span class="rk">DAILY DATA: </span><span class="rv">' + fmt(d.dailyDataMB || 10240) + ' MB</span></div>' + '<div><span class="rk">TIER: </span><span class="rv gd">FREE — FOREVER</span></div>'; document.getElementById('rtt').value = d.token; document.getElementById('puid').value = d.userId; } else { res.className = 'rb show'; res.innerHTML = '<span style="color:var(--ac3)">Error: ' + d.error + '</span>'; } } catch(e) { var tk = uid(); res.className = 'rb show'; res.innerHTML = '<div><span class="rk">STATUS: </span><span class="rv g">✓ FREE ACCESS ACTIVATED (Demo Mode)</span></div>' + '<div><span class="rk">IDENTIFIER: </span><span class="rv">' + id + '</span></div>' + '<div><span class="rk">TOKEN: </span><span class="rv" style="font-size:.58rem">' + tk + '</span></div>' + '<div><span class="rk">NODE: </span><span class="rv">London, GB — 34ms</span></div>' + '<div><span class="rk">TIER: </span><span class="rv gd">FREE — FOREVER</span></div>' + '<div style="margin-top:8px;font-size:.6rem;color:rgba(58,85,112,.7)">Deploy the backend to process real registrations.</div>'; document.getElementById('rtt').value = tk; document.getElementById('puid').value = 'guest-' + uid().slice(0,8); } btn.textContent = 'ACTIVATE FREE ACCESS →'; btn.disabled = false; } /* ===== ROUTE ===== */ async function doRoute() { const token = document.getElementById('rtt').value.trim(); const dest = document.getElementById('rtd').value.trim() || 'google.com'; const service = document.getElementById('rts').value; const res = document.getElementById('rres2'); res.innerHTML = '<span style="color:var(--mt)">Computing optimal mesh path...</span>'; try { const r = await fetch(API + '/api/route', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ token: token, destination: dest, service: service }) }); const d = await r.json(); renderRoute(d); } catch(e) { renderRoute({ path: [ { city:'Your Device', country:'--' }, { city:'London', country:'GB', load:45 }, { city:'Dubai', country:'AE', load:60 }, { city: dest, country:'🌐' } ], hops: 3, estimatedLatencyMs: 112, totalDistanceKm: 9420, compressed: true, encrypted: true, protocol: 'AIRTIMES/3.2', free: true }); } } function renderRoute(d) { const res = document.getElementById('rres2'); const hops = d.path || []; const pathHtml = hops.map(function(h, i) { return '<div style="display:flex;align-items:center;gap:10px;margin-bottom:6px;font-size:.67rem">' + '<span style="color:var(--ac);font-size:.58rem">' + String(i).padStart(2,'0') + '</span>' + '<span style="color:var(--ac)">→</span>' + '<span style="color:var(--tx)">' + h.city + (h.country && h.country !== '--' ? ' (' + h.country + ')' : '') + '</span>' + (h.load !== undefined ? '<span style="color:var(--mt);font-size:.56rem">[' + h.load + '% load]</span>' : '') + '</div>'; }).join(''); res.innerHTML = pathHtml + '<div style="margin-top:14px;border-top:1px solid rgba(0,255,224,.07);padding-top:14px">' + '<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">HOPS</span><span style="color:var(--ac)">' + (d.hops||3) + '</span></div>' + '<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">LATENCY</span><span style="color:var(--ac)">' + (d.estimatedLatencyMs||112) + ' ms</span></div>' + '<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">DISTANCE</span><span style="color:var(--ac)">' + fmt(d.totalDistanceKm||9420) + ' km</span></div>' + '<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">PROTOCOL</span><span style="color:var(--ac)">' + (d.protocol||'AIRTIMES/3.2') + '</span></div>' + '<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">COMPRESSED</span><span style="color:var(--ac)">' + (d.compressed?'YES':'NO') + '</span></div>' + '<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem;border-bottom:1px solid rgba(255,255,255,.03)"><span style="color:var(--mt)">ENCRYPTED</span><span style="color:var(--ac)">' + (d.encrypted?'YES':'NO') + '</span></div>' + '<div style="display:flex;justify-content:space-between;padding:6px 0;font-size:.66rem"><span style="color:var(--mt)">COST</span><span style="color:var(--gd);font-weight:700">FREE</span></div>' + '</div>'; } /* ===== API TESTS ===== */ async function doWeather() { const city = document.getElementById('wc').value.trim() || 'Lagos'; const res = document.getElementById('apires'); res.innerHTML = '<span style="color:var(--mt)">Fetching weather...</span>'; res.className = 'rb show'; try { const r = await fetch(API + '/api/airapi/weather?city=' + encodeURIComponent(city)); const d = await r.json(); res.innerHTML = '<div><span class="rk">CITY: </span><span class="rv">' + city + '</span></div>' + '<div><span class="rk">TEMP: </span><span class="rv">' + d.data.temp_c + '°C</span></div>' + '<div><span class="rk">CONDITION: </span><span class="rv">' + d.data.condition + '</span></div>' + '<div><span class="rk">HUMIDITY: </span><span class="rv">' + d.data.humidity + '%</span></div>' + '<div><span class="rk">WIND: </span><span class="rv">' + d.data.wind_kmh + ' km/h</span></div>' + '<div><span class="rk">COST: </span><span class="rv gd">FREE</span></div>'; } catch(e) { var temps = {Lagos:31,Nairobi:22,Jakarta:29,London:12,Tokyo:18,Sydney:24,Dubai:38,Accra:30,Abuja:29}; var t = temps[city] || Math.round(15 + Math.random() * 20); var conds = ['Clear','Sunny','Cloudy','Partly Cloudy']; res.innerHTML = '<div><span class="rk">CITY: </span><span class="rv">' + city + '</span></div>' + '<div><span class="rk">TEMP: </span><span class="rv">' + t + '°C</span></div>' + '<div><span class="rk">CONDITION: </span><span class="rv">' + conds[Math.floor(Math.random()*conds.length)] + '</span></div>' + '<div><span class="rk">HUMIDITY: </span><span class="rv">' + Math.round(40+Math.random()*50) + '%</span></div>' + '<div><span class="rk">COST: </span><span class="rv gd">FREE (Demo)</span></div>'; } } async function doExchange() { var from = document.getElementById('ef').value.trim() || 'USD'; var to = document.getElementById('et').value.trim() || 'NGN'; var res = document.getElementById('apires'); try { const r = await fetch(API + '/api/airapi/exchange?from=' + from + '&to=' + to); const d = await r.json(); res.innerHTML = '<div><span class="rk">RATE: </span><span class="rv">1 ' + from + ' = ' + d.rate + ' ' + to + '</span></div><div><span class="rk">COST: </span><span class="rv gd">FREE</span></div>'; } catch(e) { var rates = {NGN:1580,KES:130,GHS:15,ZAR:18,EUR:0.92,GBP:0.79,JPY:149,BTC:0.0000155,ETH:0.000290}; var rate = rates[to.toUpperCase()] ? rates[to.toUpperCase()] : (0.5+Math.random()*100).toFixed(4); res.innerHTML = '<div><span class="rk">RATE: </span><span class="rv">1 ' + from + ' = ' + rate + ' ' + to + '</span></div><div><span class="rk">COST: </span><span class="rv gd">FREE (Demo)</span></div>'; } res.className = 'rb show'; } /* ===== AIRPAY RENDER ===== */ function renderAirPay() { // Render wallet grid var wg = document.getElementById('wallets-grid'); if (wg) { var coins = ['BTC','ETH','USDT','BNB','LTC']; wg.innerHTML = coins.map(function(c) { var addr = WALLETS[c] || '(Not set — enter in Owner Dashboard)'; return '<div class="wc" onclick="selWallet(\'' + c + '\')" id="wcard-' + c + '">' + '<div class="wi">' + COIN_ICONS[c] + '</div>' + '<div class="wco">' + c + '</div>' + '<div class="wna">' + COIN_NAMES[c] + '</div>' + '<div class="wad">' + addr + '</div>' + '</div>'; }).join(''); } // Render bundle grid var bg = document.getElementById('bundles-grid'); if (bg) { bg.innerHTML = BUNDLES.map(function(b) { return '<div class="bc" onclick="selBundle2(\'' + b.id + '\')" id="bc-' + b.id + '">' + '<div class="bn">' + b.name + '</div>' + '<div class="bdata">' + (b.gb >= 9999 ? '∞' : b.gb + ' GB') + '</div>' + '<div class="bprice">$' + b.usd + '</div>' + '<div class="bbtc">₿ ' + b.btc + '</div>' + '</div>'; }).join(''); } // Pre-fill from localStorage ['BTC','ETH','USDT','BNB','LTC'].forEach(function(c) { var el = document.getElementById('wbtc') || null; }); } function selWallet(coin) { document.querySelectorAll('.wc').forEach(function(c) { c.classList.remove('sel'); }); var el = document.getElementById('wcard-' + coin); if (el) el.classList.add('sel'); var pc = document.getElementById('pcoin'); if (pc) pc.value = coin; } function selBundle2(id) { document.querySelectorAll('.bc').forEach(function(c) { c.classList.remove('sel'); }); var el = document.getElementById('bc-' + id); if (el) el.classList.add('sel'); selBundle = id; } async function doPayment() { var bundleId = selBundle; var coin = document.getElementById('pcoin').value; var userId = document.getElementById('puid').value.trim(); var res = document.getElementById('pres'); var btn = document.getElementById('pbtn'); if (!bundleId) { res.className = 'rb gb show'; res.innerHTML = '<span style="color:var(--ac3)">Please select a data bundle above first.</span>'; return; } btn.textContent = 'GENERATING...'; btn.disabled = true; var bundle = BUNDLES.find(function(b) { return b.id === bundleId; }); var rate = COIN_RATES[coin] || 0.0000155; var amount = (bundle.usd * rate).toFixed(8); var payId = 'PAY-' + Math.random().toString(36).substr(2,12).toUpperCase(); var walletAddr = WALLETS[coin] || 'SET YOUR ' + coin + ' WALLET IN OWNER DASHBOARD'; try { const r = await fetch(API + '/api/airpay/pay', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ userId: userId, bundleId: bundleId, coin: coin }) }); const d = await r.json(); if (d.success && d.payment) showPayResult(d.payment); else throw new Error(d.error || 'API unavailable'); } catch(e) { showPayResult({ paymentId:payId, bundle:bundle, coin:coin, amount:amount, walletAddress:walletAddr, amountUSD:bundle.usd, network: {BTC:'Bitcoin Network',ETH:'Ethereum ERC-20',USDT:'Tron TRC-20',BNB:'BNB Smart Chain',LTC:'Litecoin'}[coin] || coin }); } btn.textContent = 'GENERATE PAYMENT ADDRESS →'; btn.disabled = false; } function showPayResult(p) { var res = document.getElementById('pres'); res.className = 'rb gb show'; var icon = COIN_ICONS[p.coin] || '₿'; res.innerHTML = '<div style="text-align:center;margin-bottom:16px">' + '<div style="font-size:2.5rem">' + icon + '</div>' + '<div style="font-family:\'Bebas Neue\';font-size:1.8rem;color:var(--gd)">SEND ' + p.amount + ' ' + p.coin + '</div>' + '<div style="font-size:.62rem;color:var(--mt)">' + (p.network || p.coin) + ' · $' + p.amountUSD + ' USD</div>' + '</div>' + '<div style="font-size:.6rem;color:var(--mt);margin-bottom:6px;letter-spacing:.1em;text-transform:uppercase">Send to this wallet address:</div>' + '<div style="background:rgba(0,0,0,.5);border:1px solid rgba(245,197,24,.2);padding:12px;margin-bottom:12px;word-break:break-all;font-size:.62rem;color:var(--gd);letter-spacing:.05em;font-family:\'Space Mono\'">' + p.walletAddress + '</div>' + '<div style="display:flex;gap:8px;margin-bottom:14px">' + '<button class="copy-btn" onclick="navigator.clipboard.writeText(\'' + p.walletAddress.replace(/'/g,"\\'") + '\')">COPY ADDRESS</button>' + '<button class="copy-btn" onclick="navigator.clipboard.writeText(\'' + p.paymentId + '\')">COPY PAY ID</button>' + '</div>' + '<div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + p.paymentId + '</span></div>' + '<div><span class="rk">BUNDLE: </span><span class="rv">' + (p.bundle ? p.bundle.name + ' — ' + (p.bundle.gb >= 9999 ? 'Unlimited' : p.bundle.gb + ' GB') : '') + '</span></div>' + '<div><span class="rk">AMOUNT: </span><span class="rv gd">' + p.amount + ' ' + p.coin + '</span></div>' + '<div style="margin-top:10px;font-size:.6rem;color:rgba(245,197,24,.5)">Save your Payment ID, then use it in the Confirm section below after sending.</div>'; var cpid = document.getElementById('cpid'); if (cpid) cpid.value = p.paymentId; } async function doConfirm() { var pid = document.getElementById('cpid').value.trim(); var txh = document.getElementById('ctxh').value.trim(); var res = document.getElementById('cres'); if (!pid) { res.className = 'rb gb show'; res.innerHTML = '<span style="color:var(--ac3)">Please enter your Payment ID.</span>'; return; } try { const r = await fetch(API + '/api/airpay/confirm', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ paymentId: pid, txHash: txh }) }); const d = await r.json(); res.className = 'rb gb show'; if (d.success) res.innerHTML = '<div><span class="rk">STATUS: </span><span style="color:#4ade80">✓ CONFIRMED — BUNDLE ACTIVE</span></div><div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + pid + '</span></div>'; else res.innerHTML = '<span style="color:var(--ac3)">Error: ' + d.error + '</span>'; } catch(e) { res.className = 'rb gb show'; res.innerHTML = '<div><span class="rk">PAYMENT ID: </span><span class="rv gd">' + pid + '</span></div>' + '<div><span class="rk">STATUS: </span><span style="color:#4ade80">✓ CONFIRMED (Demo)</span></div>' + '<div style="margin-top:8px;font-size:.6rem;color:rgba(245,197,24,.5)">Deploy backend to process real confirmations and activate bundles automatically.</div>'; } } /* ===== AIRBANK ===== */ async function loadVault() { try { const r = await fetch(API + '/api/airbank/vault'); const d = await r.json(); var storedMB = parseFloat(d.vault && d.vault.storedMB ? d.vault.storedMB : 842000); document.getElementById('vstore').textContent = fmt(Math.round(storedMB)) + ' AU'; document.getElementById('vtrans').textContent = parseFloat(d.transmissions && d.transmissions.totalGB ? d.transmissions.totalGB : 4700).toFixed(1) + ' GB'; document.getElementById('vrev').textContent = '$' + parseFloat(d.revenue && d.revenue.totalUSD ? d.revenue.totalUSD : 3.47).toFixed(4); } catch(e) { document.getElementById('vstore').textContent = '842,000 AU'; document.getElementById('vtrans').textContent = '4,700 GB'; document.getElementById('vrev').textContent = '$3.4700'; } } function calcMoney() { var amt = parseFloat(document.getElementById('camt').value) || 0; var unit = document.getElementById('cunit').value || 'TB'; var inGB = unit === 'PB' ? amt * 1024 * 1024 : unit === 'TB' ? amt * 1024 : amt; var storeMo = inGB * 0.0005; var transUSD = inGB * 0.002; var monthly = (storeMo + transUSD).toFixed(4); var yearly = ((storeMo + transUSD) * 12).toFixed(2); var btcM = ((storeMo + transUSD) * 0.0000155).toFixed(8); var disp = document.getElementById('cdisplay'); if (disp) disp.innerHTML = '<div>$' + monthly + '/mo</div><div class="cs">$' + yearly + '/yr · ' + btcM + ' BTC/mo</div>'; var res = document.getElementById('cres2'); if (res) { res.className = 'rb gb show'; res.innerHTML = '<div><span class="rk">INPUT: </span><span class="rv">' + amt + ' ' + unit + ' (' + fmt(Math.round(inGB)) + ' GB)</span></div>' + '<div><span class="rk">STORAGE REV/MONTH: </span><span class="rv gd">$' + storeMo.toFixed(4) + '</span></div>' + '<div><span class="rk">TRANSMISSION REV: </span><span class="rv gd">$' + transUSD.toFixed(4) + '</span></div>' + '<div><span class="rk">COMBINED / MONTH: </span><span class="rv gd">$' + monthly + '</span></div>' + '<div><span class="rk">COMBINED / YEAR: </span><span class="rv gd">$' + yearly + '</span></div>' + '<div><span class="rk">IN BITCOIN / MONTH: </span><span class="rv gd">' + btcM + ' BTC</span></div>'; } } /* ===== OWNER DASHBOARD ===== */ async function loadOwner() { // Pre-fill wallets from localStorage var wmap = {wbtc:'BTC', weth:'ETH', wusdt:'USDT', wbnb:'BNB', wltc:'LTC'}; Object.keys(wmap).forEach(function(k) { var el = document.getElementById(k); if (el && WALLETS[wmap[k]]) el.value = WALLETS[wmap[k]]; }); try { const [revR, nodesR, vaultR] = await Promise.all([ fetch(API + '/api/airbank/revenue'), fetch(API + '/api/nodes'), fetch(API + '/api/airbank/vault') ]); const rev = await revR.json(); const nodes = await nodesR.json(); const vault = await vaultR.json(); document.getElementById('ort').textContent = '$' + parseFloat(rev.summary && rev.summary.totalUSD ? rev.summary.totalUSD : '3.47').toFixed(4); document.getElementById('ortb').textContent = (rev.summary ? rev.summary.totalBTC : '0.00005378') + ' BTC'; document.getElementById('orm').textContent = '$' + (rev.summary ? rev.summary.projectedMonthlyUSD : '104.10'); document.getElementById('ore').textContent = fmt(rev.summary ? rev.summary.totalEvents : 200); document.getElementById('cn').textContent = nodes.count || 142; document.getElementById('cu').textContent = fmt(2100000); document.getElementById('cdg').textContent = parseFloat(vault.transmissions && vault.transmissions.totalGB ? vault.transmissions.totalGB : 4700).toFixed(0) + ' GB'; var src = document.getElementById('rev-src'); if (src && rev.bySource && rev.bySource.length) { src.innerHTML = rev.bySource.map(function(s) { return '<div><span style="color:var(--mt)">' + s.source + ': </span><span style="color:var(--gd)">$' + parseFloat(s.usd).toFixed(4) + '</span> <span style="color:var(--mt)">(' + s.count + ' events)</span></div>'; }).join(''); } else { setDemoRevSrc(); } var day = document.getElementById('rev-day'); if (day && rev.byDay && rev.byDay.length) { day.innerHTML = rev.byDay.slice(0,7).map(function(d) { return '<div><span style="color:var(--mt)">' + d.day + ': </span><span style="color:var(--gd)">$' + parseFloat(d.usd).toFixed(4) + '</span></div>'; }).join(''); } else { setDemoRevDay(); } } catch(e) { document.getElementById('ort').textContent = '$3.4700'; document.getElementById('ortb').textContent = '0.00005378 BTC'; document.getElementById('orm').textContent = '$104.10'; document.getElementById('ore').textContent = '200'; document.getElementById('cn').textContent = '142'; document.getElementById('cu').textContent = '2,100,000'; document.getElementById('cdg').textContent = '4,700 GB'; setDemoRevSrc(); setDemoRevDay(); } } function setDemoRevSrc() { var src = document.getElementById('rev-src'); if (src) src.innerHTML = '<div><span style="color:var(--mt)">data_transmission: </span><span style="color:var(--gd)">$1.4500</span> <span style="color:var(--mt)">(100 events)</span></div>' + '<div><span style="color:var(--mt)">active_user: </span><span style="color:var(--gd)">$0.8400</span> <span style="color:var(--mt)">(84 events)</span></div>' + '<div><span style="color:var(--mt)">airpay: </span><span style="color:var(--gd)">$0.6200</span> <span style="color:var(--mt)">(8 payments)</span></div>' + '<div><span style="color:var(--mt)">api_call: </span><span style="color:var(--gd)">$0.3100</span> <span style="color:var(--mt)">(62 events)</span></div>' + '<div><span style="color:var(--mt)">storage: </span><span style="color:var(--gd)">$0.1800</span> <span style="color:var(--mt)">(36 events)</span></div>' + '<div><span style="color:var(--mt)">sms: </span><span style="color:var(--gd)">$0.0700</span> <span style="color:var(--mt)">(70 events)</span></div>'; } function setDemoRevDay() { var day = document.getElementById('rev-day'); var days = ['2025-12-15','2025-12-14','2025-12-13','2025-12-12','2025-12-11','2025-12-10','2025-12-09']; if (day) day.innerHTML = days.map(function(d) { return '<div><span style="color:var(--mt)">' + d + ': </span><span style="color:var(--gd)">$' + (0.08 + Math.random() * 0.4).toFixed(4) + '</span></div>'; }).join(''); } function saveWallets() { var map = {wbtc:'BTC', weth:'ETH', wusdt:'USDT', wbnb:'BNB', wltc:'LTC'}; var saved = []; Object.keys(map).forEach(function(k) { var el = document.getElementById(k); if (el && el.value.trim()) { WALLETS[map[k]] = el.value.trim(); localStorage.setItem('w_' + map[k], el.value.trim()); saved.push(map[k]); } }); var res = document.getElementById('wsres'); if (res) { res.className = 'rb gb show'; res.innerHTML = '<div><span class="rk">STATUS: </span><span style="color:#4ade80">✓ WALLET ADDRESSES SAVED</span></div>' + saved.map(function(c) { return '<div><span class="rk">' + c + ': </span><span class="rv gd">' + WALLETS[c] + '</span></div>'; }).join('') + '<div style="margin-top:10px;font-size:.6rem;color:rgba(245,197,24,.5)">Addresses saved locally and displayed on AirPay page. For production backend, set as OWNER_BTC_WALLET etc. environment variables.</div>'; } renderAirPay(); } /* ===== LIVE LOG FEED ===== */ var LOG_EVENTS = [ {c:'lg', m:'<strong>Nairobi Node</strong> — 12,440 users allocated free data bundle'}, {c:'lgd', m:'<strong>AirBank</strong> — $0.0024 revenue logged automatically'}, {c:'lb', m:'<strong>AirAPI Gateway</strong> — 50K requests served to Lagos cluster'}, {c:'lgd', m:'<strong>AirPay</strong> — New payment request: 0.000038 BTC pending'}, {c:'lg', m:'<strong>Jakarta Relay</strong> — bandwidth auto-scaled to 340 Gbps'}, {c:'lb', m:'<strong>AirVault</strong> — 80,000 files synced across 8 geo-regions'}, {c:'lgd', m:'<strong>AirBank Vault</strong> — 842,000 AirUnits stored, earning $0.421/mo'}, {c:'lg', m:'<strong>Mumbai Cluster</strong> — 4 new nodes joined the free mesh grid'}, {c:'lgd', m:'<strong>AirPay</strong> — ETH bundle confirmed: Pro 500 GB activated'}, {c:'lg', m:'<strong>Tokyo Hub</strong> — +12 Gbps from commercial surplus pooled'}, {c:'lb', m:'<strong>AirSMS</strong> — 230,000 encrypted messages routed free'}, {c:'lgd', m:'<strong>AirBank</strong> — Active user revenue: $0.001 x 2,100,000 users'}, {c:'lg', m:'<strong>São Paulo</strong> — failover triggered, rerouting via satellite'}, {c:'lb', m:'<strong>London Hub</strong> — 99.99% uptime milestone reached this quarter'}, {c:'lgd', m:'<strong>AirPay</strong> — USDT payment received: Standard 100 GB bundle'} ]; var logIdx = 0; function addLogEntry(msg, cls, feed) { if (!feed) return; var el = document.createElement('div'); el.className = 'le'; var ts = new Date().toLocaleTimeString(); el.innerHTML = '<div class="ld ' + cls + '"></div><div class="lt">' + msg + '<span class="ltm">just now · ' + ts + '</span></div>'; feed.insertBefore(el, feed.children[1] || null); while (feed.querySelectorAll('.le').length > 8) { var last = feed.querySelector('.le:last-child'); if (last) last.remove(); } } function initLogs() { var feed = document.getElementById('log-home'); if (feed) { LOG_EVENTS.slice(0, 6).forEach(function(e, i) { setTimeout(function() { addLogEntry(e.m, e.c, feed); }, i * 120); }); logIdx = 6; } } function startLiveLog() { try { var es = new EventSource(API + '/api/events'); es.onmessage = function(ev) { var d = JSON.parse(ev.data); var cls = d.type === 'revenue' ? 'lgd' : d.type === 'warning' ? 'lr' : d.type === 'info' ? 'lb' : 'lg'; var feed = document.getElementById('log-home'); if (feed) addLogEntry('<strong>LIVE</strong> — ' + d.message, cls, feed); }; es.onerror = function() { es.close(); startFallbackLog(); }; } catch(e) { startFallbackLog(); } } function startFallbackLog() { setInterval(function() { var e = LOG_EVENTS[logIdx % LOG_EVENTS.length]; logIdx++; var feed = document.getElementById('log-home'); if (feed) addLogEntry(e.m, e.c, feed); }, 3500); } /* ===== INIT ===== */ window.addEventListener('load', function() { loadStats(); initLogs(); startLiveLog(); });

MODAC GLOBAL AIRTIMES

Gift Trust — Mon, 01 Jun 2026 12:46:44 +0000

!/bin/bash

============================================================

MODAC GLOBAL SYSTEM - COMPLETE INTEGRATED DEPLOYMENT

Includes: Transaction Blocking, Agent Verification, Wallet System

One script deploys everything

============================================================

set -e

echo "╔══════════════════════════════════════════════════════════════════════╗"
echo "║ ║"
echo "║ MODAC GLOBAL SYSTEM - FULL DEPLOYMENT ║"
echo "║ Complete Security Framework with Transaction Blocking ║"
echo "║ ║"
echo "╚══════════════════════════════════════════════════════════════════════╝"
echo ""

==================== PHASE 1: DIRECTORY STRUCTURE ====================

echo "Phase 1/7: Creating Complete Directory Structure..."
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"

mkdir -p backend/{security_beacon,payment_system,shared,config,api,middleware}
mkdir -p frontend/{src,public,dist}
mkdir -p config/{agent,wallet,autopilot,security}
mkdir -p data/{registry,intercepted,blocked,approved}
mkdir -p logs/{api,security,payments,transactions}
mkdir -p scripts/{setup,maintenance,backup}
mkdir -p monitoring/{prometheus,grafana}
mkdir -p nginx
mkdir -p database

echo "✓ Directory structure created"

==================== PHASE 2: CORE SECURITY FILES ====================

echo ""
echo "Phase 2/7: Creating Core Security System..."
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"

Create main security module

cat > backend/security_beacon/transaction_blocker.py << 'EOFPYTHON'
"""
MODAC Security Beacon - Transaction Blocker
Blocks ALL transactions until agents are verified
"""
from enum import Enum
from datetime import datetime
from typing import Dict, Tuple, Optional
import json
import uuid

class AgentStatus(Enum):
UNREGISTERED = "unregistered"
PENDING = "pending"
VERIFIED = "verified"
BLOCKED = "blocked"

class TransactionBlocker:
"""Blocks all unverified transactions"""

def __init__(self):
    self.intercepted = []
    self.blocked = []
    self.approved = []

def check_transaction(self, buyer_id: str, seller_id: str) -> Tuple[bool, str]:
    """Check if transaction should be allowed"""
    # Load registry
    try:
        with open('data/registry/agents.json', 'r') as f:
            registry = json.load(f)
    except:
        registry = {}

    # Check buyer
    buyer = registry.get(buyer_id, {})
    if not buyer or buyer.get('status') != 'verified':
        return False, f"Buyer agent not verified"

    # Check seller
    seller = registry.get(seller_id, {})
    if not seller or seller.get('status') != 'verified':
        return False, f"Seller agent not verified"

    return True, "Both agents verified"

blocker = TransactionBlocker()
EOFPYTHON

echo "✓ Transaction blocker created"

Create agent registry

cat > backend/security_beacon/agent_registry.py << 'EOFPYTHON'
"""
MODAC Agent Registry
Central registry of all agents
"""
import json
import os
from datetime import datetime

class AgentRegistry:
def init(self):
self.registry_file = 'data/registry/agents.json'
os.makedirs(os.path.dirname(self.registry_file), exist_ok=True)

def load_registry(self):
    try:
        with open(self.registry_file, 'r') as f:
            return json.load(f)
    except:
        return {}

def save_registry(self, registry):
    with open(self.registry_file, 'w') as f:
        json.dump(registry, f, indent=2, default=str)

def register_agent(self, agent_data):
    registry = self.load_registry()
    agent_id = agent_data['agent_id']
    agent_data['status'] = 'pending'
    agent_data['registered_at'] = datetime.now().isoformat()
    registry[agent_id] = agent_data
    self.save_registry(registry)
    return agent_id

def verify_agent(self, agent_id):
    registry = self.load_registry()
    if agent_id in registry:
        registry[agent_id]['status'] = 'verified'
        registry[agent_id]['verified_at'] = datetime.now().isoformat()
        self.save_registry(registry)
        return True
    return False

registry = AgentRegistry()
EOFPYTHON

echo "✓ Agent registry created"

==================== PHASE 3: API WITH BLOCKING ====================

echo ""
echo "Phase 3/7: Creating API with Transaction Blocking..."
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"

Create main API

cat > backend/main.py << 'EOFPYTHON'
"""
MODAC API with Transaction Blocking
Every transaction goes through verification
"""
from fastapi import FastAPI, HTTPException
from fastapi.middleware.cors import CORSMiddleware
from pydantic import BaseModel
from typing import Optional
import sys
import os

Add security beacon to path

sys.path.append(os.path.join(os.path.dirname(file), 'security_beacon'))

from transaction_blocker import blocker
from agent_registry import registry

app = FastAPI(title="MODAC Global System", version="1.0.0")

app.add_middleware(
CORSMiddleware,
allow_origins=[""],
allow_credentials=True,
allow_methods=[""],
allow_headers=["*"],
)

class AgentRegistration(BaseModel):
agent_name: str
owner_entity: str
agent_type: str
public_key: Optional[str] = None

class TransactionRequest(BaseModel):
buyer_agent_id: str
seller_agent_id: str
amount: float
currency: str = "USD"

@app.get("/")
def root():
return {
"system": "MODAC Global System",
"version": "1.0.0",
"status": "operational",
"security": "transaction_blocking_enabled"
}

@app.get("/health")
def health():
return {"status": "healthy", "blocking_active": True}

@app.post("/api/v1/agents/register")
def register_agent(agent: AgentRegistration):
"""Register new agent - starts in PENDING status"""
import uuid

agent_data = agent.dict()
agent_data['agent_id'] = str(uuid.uuid4())

agent_id = registry.register_agent(agent_data)

return {
    "success": True,
    "agent_id": agent_id,
    "status": "pending",
    "message": "Agent registered. Complete verification to transact.",
    "can_transact": False
}

@app.post("/api/v1/agents/{agent_id}/verify")
def verify_agent(agent_id: str):
"""Verify agent - enables transactions"""
success = registry.verify_agent(agent_id)

if success:
    return {
        "success": True,
        "agent_id": agent_id,
        "status": "verified",
        "message": "Agent verified. Can now transact.",
        "can_transact": True
    }
else:
    raise HTTPException(status_code=404, detail="Agent not found")

@app.post("/api/v1/transactions/execute")
def execute_transaction(txn: TransactionRequest):
"""
Execute transaction - BLOCKS if agents not verified
This is the core security enforcement
"""
# CHECK: Are both agents verified?
allowed, reason = blocker.check_transaction(
txn.buyer_agent_id,
txn.seller_agent_id
)

if not allowed:
    # BLOCK THE TRANSACTION
    return {
        "success": False,
        "status": "blocked",
        "reason": reason,
        "message": "Transaction blocked by MODAC security",
        "action_required": "Verify both agents before transacting"
    }

# APPROVED - Transaction can proceed
import uuid
transaction_id = str(uuid.uuid4())

return {
    "success": True,
    "status": "approved",
    "transaction_id": transaction_id,
    "amount": txn.amount,
    "currency": txn.currency,
    "message": "Transaction approved and processing"
}

@app.get("/api/v1/system/status")
def system_status():
"""Get system security status"""
agents = registry.load_registry()

verified_count = sum(1 for a in agents.values() if a.get('status') == 'verified')
pending_count = sum(1 for a in agents.values() if a.get('status') == 'pending')

return {
    "system": "MODAC Global System",
    "security_mode": "strict",
    "transaction_blocking": "enabled",
    "agents": {
        "total": len(agents),
        "verified": verified_count,
        "pending": pending_count
    },
    "transactions": {
        "intercepted": len(blocker.intercepted),
        "blocked": len(blocker.blocked),
        "approved": len(blocker.approved)
    }
}

if name == "main":
import uvicorn
uvicorn.run(app, host="0.0.0.0", port=8000)
EOFPYTHON

echo "✓ API with blocking created"

==================== PHASE 4: REQUIREMENTS ====================

echo ""
echo "Phase 4/7: Creating Requirements Files..."
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"

cat > backend/requirements.txt << 'EOF'
fastapi==0.104.1
uvicorn[standard]==0.24.0
pydantic==2.5.0
python-multipart==0.0.6
python-dotenv==1.0.0
EOF

echo "✓ Requirements created"

==================== PHASE 5: DOCKER CONFIGURATION ====================

echo ""
echo "Phase 5/7: Creating Docker Configuration..."
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"

Create Dockerfile

cat > backend/Dockerfile << 'EOF'
FROM python:3.11-slim

WORKDIR /app

RUN apt-get update && apt-get install -y curl && rm -rf /var/lib/apt/lists/*

COPY requirements.txt .
RUN pip install --no-cache-dir -r requirements.txt

COPY . .

RUN useradd -m -u 1000 modac && chown -R modac:modac /app
USER modac

EXPOSE 8000

CMD ["python", "-m", "uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"]
EOF

Create docker-compose

cat > docker-compose.yml << 'EOF'
version: '3.8'

services:
modac-api:
build:
context: ./backend
dockerfile: Dockerfile
container_name: modac-api
ports:
- "8000:8000"
volumes:
- ./data:/app/data
- ./logs:/app/logs
- ./config:/app/config
environment:
- MODAC_ENV=production
- BLOCKING_ENABLED=true
restart: unless-stopped
healthcheck:
test: ["CMD", "curl", "-f", "http://localhost:8000/health"]
interval: 30s
timeout: 10s
retries: 3

modac-dashboard:
image: nginx:alpine
container_name: modac-dashboard
ports:
- "80:80"
volumes:
- ./frontend/dist:/usr/share/nginx/html:ro
- ./nginx/nginx.conf:/etc/nginx/nginx.conf:ro
depends_on:
- modac-api
restart: unless-stopped

volumes:
data:
logs:
config:

networks:
default:
name: modac-network
EOF

echo "✓ Docker configuration created"

==================== PHASE 6: FRONTEND DASHBOARD ====================

echo ""
echo "Phase 6/7: Creating Security Dashboard..."
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"

cat > frontend/dist/index.html << 'EOF'
<!DOCTYPE html>

MODAC Security Dashboard
<br> * { margin: 0; padding: 0; box-sizing: border-box; }<br> body {<br> font-family: 'Segoe UI', sans-serif;<br> background: linear-gradient(135deg, #0a0e27 0%, #1a1f3a 100%);<br> color: white;<br> padding: 20px;<br> }<br> .header {<br> text-align: center;<br> padding: 40px 20px;<br> background: linear-gradient(135deg, #1e2749 0%, #2d3561 100%);<br> border-radius: 20px;<br> margin-bottom: 30px;<br> border: 2px solid rgba(0, 255, 255, 0.3);<br> }<br> h1 { font-size: 42px; margin-bottom: 10px; }<br> .subtitle { color: #00ffff; font-size: 18px; }<br> .alert {<br> background: rgba(255, 51, 102, 0.2);<br> border: 2px solid #ff3366;<br> padding: 20px;<br> border-radius: 15px;<br> margin: 20px 0;<br> text-align: center;<br> font-size: 18px;<br> font-weight: bold;<br> }<br> .stats {<br> display: grid;<br> grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));<br> gap: 20px;<br> margin-bottom: 30px;<br> }<br> .stat-card {<br> background: linear-gradient(135deg, #1e2749 0%, #2d3561 100%);<br> padding: 30px;<br> border-radius: 15px;<br> border: 2px solid rgba(0, 255, 255, 0.2);<br> text-align: center;<br> }<br> .stat-value {<br> font-size: 48px;<br> font-weight: bold;<br> color: #00ffff;<br> margin: 15px 0;<br> }<br> .stat-label {<br> color: #888;<br> font-size: 14px;<br> text-transform: uppercase;<br> }<br> .status-indicator {<br> display: inline-block;<br> padding: 10px 20px;<br> background: rgba(0, 255, 0, 0.2);<br> border: 2px solid #00ff00;<br> border-radius: 20px;<br> margin: 20px 0;<br> }<br> .btn {<br> padding: 15px 30px;<br> background: linear-gradient(135deg, #00ffff 0%, #00ccff 100%);<br> border: none;<br> border-radius: 10px;<br> color: #0a0e27;<br> font-size: 16px;<br> font-weight: bold;<br> cursor: pointer;<br> margin: 10px;<br> }<br> .btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0, 255, 255, 0.5); }<br>

🛡️ MODAC SECURITY DASHBOARD

Transaction Blocking & Agent Verification System

● SYSTEM ACTIVE - Transaction Blocking Enabled

<div class="alert">
    🚫 DEFAULT MODE: ALL TRANSACTIONS BLOCKED UNTIL AGENTS VERIFIED
</div>

<div class="stats" id="stats">
    <div class="stat-card">
        <div class="stat-label">Total Agents</div>
        <div class="stat-value" id="total-agents">-</div>
        <div style="font-size: 12px; color: #888;">Registered in system</div>
    </div>
    <div class="stat-card">
        <div class="stat-label">Verified Agents</div>
        <div class="stat-value" style="color: #00ff00;" id="verified-agents">-</div>
        <div style="font-size: 12px; color: #888;">Can transact</div>
    </div>
    <div class="stat-card">
        <div class="stat-label">Transactions Blocked</div>
        <div class="stat-value" style="color: #ff3366;" id="blocked-txns">-</div>
        <div style="font-size: 12px; color: #888;">Unverified agents</div>
    </div>
    <div class="stat-card">
        <div class="stat-label">Transactions Approved</div>
        <div class="stat-value" style="color: #00ff00;" id="approved-txns">-</div>
        <div style="font-size: 12px; color: #888;">Verified agents only</div>
    </div>
</div>

<div style="text-align: center; padding: 30px;">
    <button class="btn" onclick="registerAgent()">➕ Register Agent</button>
    <button class="btn" onclick="viewRegistry()">📋 View Registry</button>
    <button class="btn" onclick="viewBlocked()">🚫 View Blocked</button>
    <button class="btn" onclick="window.location.href='/api/v1/system/status'">📊 API Status</button>
</div>

<script>
    async function loadStats() {
        try {
            const response = await fetch('/api/v1/system/status');
            const data = await response.json();

            document.getElementById('total-agents').textContent = data.agents.total;
            document.getElementById('verified-agents').textContent = data.agents.verified;
            document.getElementById('blocked-txns').textContent = data.transactions.blocked;
            document.getElementById('approved-txns').textContent = data.transactions.approved;
        } catch (error) {
            console.error('Error loading stats:', error);
        }
    }

    function registerAgent() {
        alert('Agent Registration:\n\n1. Submit agent details\n2. Provide identity proof\n3. Complete KYC verification\n4. Security screening\n5. Get VERIFIED status\n\nOnly then can agent transact!');
    }

    function viewRegistry() {
        window.open('/api/v1/system/status', '_blank');
    }

    function viewBlocked() {
        alert('Blocked Transactions:\n\nAll transactions from unverified agents are automatically blocked.\n\nAgents must complete verification before any transactions are allowed.');
    }

    // Load stats on page load and refresh every 10 seconds
    loadStats();
    setInterval(loadStats, 10000);
</script>

EOF

Create NGINX config

mkdir -p nginx
cat > nginx/nginx.conf << 'EOF'
events { worker_connections 1024; }

http {
upstream api {
server modac-api:8000;
}

server {
    listen 80;
    server_name localhost;

    location / {
        root /usr/share/nginx/html;
        index index.html;
        try_files $uri $uri/ /index.html;
    }

    location /api/ {
        proxy_pass http://api;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }

    location /health {
        proxy_pass http://api/health;
    }
}

}
EOF

echo "✓ Dashboard created"

==================== PHASE 7: DEPLOYMENT SCRIPTS ====================

echo ""
echo "Phase 7/7: Creating Deployment Scripts..."
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"

Create start script

cat > start.sh << 'EOF'

!/bin/bash

echo "🚀 Starting MODAC Global System..."
echo ""

Build and start

docker-compose up -d --build

echo ""
echo "Waiting for services..."
sleep 10

Health check

if curl -f http://localhost:8000/health > /dev/null 2>&1; then
echo "✅ API is healthy"
else
echo "❌ API health check failed"
fi

echo ""
echo "╔══════════════════════════════════════════════════════════════════╗"
echo "║ MODAC SYSTEM DEPLOYED! ║"
echo "╠══════════════════════════════════════════════════════════════════╣"
echo "║ Dashboard: http://localhost ║"
echo "║ API: http://localhost:8000 ║"
echo "║ API Docs: http://localhost:8000/docs ║"
echo "║ Status: http://localhost:8000/api/v1/system/status ║"
echo "╠══════════════════════════════════════════════════════════════════╣"
echo "║ 🛡️ TRANSACTION BLOCKING: ENABLED ║"
echo "║ 🚫 DEFAULT: Block all unverified agents ║"
echo "╚══════════════════════════════════════════════════════════════════╝"
EOF

chmod +x start.sh

Create stop script

cat > stop.sh << 'EOF'

!/bin/bash

echo "Stopping MODAC..."
docker-compose down
echo "✓ MODAC stopped"
EOF

chmod +x stop.sh

Create test script

cat > test_blocking.sh << 'EOF'

!/bin/bash

echo "Testing Transaction Blocking..."
echo ""

API="http://localhost:8000"

echo "Test 1: Attempt transaction with unverified agents"
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
curl -X POST "$API/api/v1/transactions/execute" \
-H "Content-Type: application/json" \
-d '{
"buyer_agent_id": "unverified_001",
"seller_agent_id": "unverified_002",
"amount": 1000,
"currency": "USD"
}' | jq .

echo ""
echo ""
echo "Expected: Transaction BLOCKED ❌"
echo ""
EOF

chmod +x test_blocking.sh

echo "✓ Deployment scripts created"

==================== FINAL SETUP ====================

echo ""
echo "Final Setup..."
echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"

Create empty registry

mkdir -p data/registry
echo "{}" > data/registry/agents.json

Create README

cat > README.md << 'EOF'

MODAC GLOBAL SYSTEM

Complete deployment with transaction blocking and agent verification.

Quick Start

# Start system
./start.sh

# View dashboard
http://localhost

# Test blocking
./test_blocking.sh

# Stop system
./stop.sh

Security Features

✅ Transaction blocking enabled by default
✅ All agents must register and verify
✅ Real-time monitoring of all transactions
✅ Automatic blocking of unverified agents

API Endpoints

POST /api/v1/agents/register - Register new agent
POST /api/v1/agents/{id}/verify - Verify agent
POST /api/v1/transactions/execute - Execute transaction (blocked if unverified)
GET /api/v1/system/status - System status

How It Works

Agent attempts transaction
MODAC intercepts transaction
Checks if both agents are verified
If NOT verified → BLOCKS transaction
If verified → APPROVES transaction

DEFAULT: Everything is BLOCKED until verified!
EOF

echo "✓ Setup complete"

==================== DEPLOYMENT COMPLETE ====================

echo ""
echo "╔══════════════════════════════════════════════════════════════════════╗"
echo "║ ║"
echo "║ 🎉 MODAC DEPLOYMENT COMPLETE! 🎉 ║"
echo "║ ║"
echo "╚══════════════════════════════════════════════════════════════════════╝"
echo ""
echo "✅ All components installed:"
echo " • Transaction Blocking System"
echo " • Agent Registry"
echo " • Verification System"
echo " • Security Dashboard"
echo " • API with blocking enforcement"
echo ""
echo "🚀 Ready to deploy! Run:"
echo " ./start.sh"
echo ""
echo "📊 Then visit:"
echo " http://localhost - Security Dashboard"
echo " http://localhost:8000/docs - API Documentation"
echo ""
echo "🛡️ SECURITY STATUS:"
echo " ✓ Transaction blocking: ENABLED"
echo " ✓ Agent verification: REQUIRED"
echo " ✓ Default mode: BLOCK ALL"
echo ""This is a submission for the GitHub Finish-Up-A-Thon Challenge*

What I Built

Demo

The Comeback Story

My Experience with GitHub Copilot

HERMES AGENT SUMMISSIO

Gift Trust — Wed, 20 May 2026 06:35:40 +0000

*# How I Built an Agentic Layer on AIRTIMES Using Hermes Agent

A submission for the Hermes Agent Challenge

What is AIRTIMES?

AIRTIMES is a zero-dependency global data and service network I built from scratch — a full-stack Node.js backend featuring AirPay (a crypto payment module) and AirBank (a revenue tracking engine). No external libraries. No cloud lock-in. Every byte of it runs on infrastructure I control.

It's the kind of platform that's always generating data — transactions, node health events, revenue streams — but has no brain to interpret that data in real time. That's exactly the gap I wanted to close.

The Problem: Infrastructure Without Intelligence

AIRTIMES processes payments and tracks revenue across nodes. But monitoring it meant either:

Staring at logs manually
Writing one-off scripts that break and never improve
Paying for a SaaS dashboard that doesn't understand my custom data model

None of those felt right. What I needed was an agent that could live inside the platform, understand its data, react to events, and — crucially — get smarter the longer it ran.

That's when I found Hermes Agent by Nous Research.

Why Hermes?

Most agent frameworks are graphs you design ahead of time. You wire the nodes, define the flows, and ship. The agent's capability is permanently bounded by what you prompted into it on day one.

Hermes is different. It has a built-in learning loop:

After completing a complex task, it automatically writes a reusable skill
Skills self-improve every time they're used
It builds a persistent memory of your projects across sessions
It runs unattended automations via natural language cron scheduling

For AIRTIMES — a platform that runs 24/7 — this is exactly the right architecture.

What I Built: The AIRTIMES Agentic Layer

I installed Hermes directly on the AIRTIMES server and gave it three jobs.

1. AirPay Transaction Monitor

Hermes watches the AirPay transaction stream continuously. When a payment fails, it:

Diagnoses the failure (network timeout? invalid address? insufficient funds?)
Triggers the retry logic
Logs a structured incident report
Sends a Telegram alert to my phone

The first time it did this, it wrote a skill called airpay_failure_diagnosis.skill automatically. The next failure? It handled in seconds — no manual input.

2. AirBank Daily Revenue Briefing

Every morning at 8am, Hermes pulls from the AirBank revenue engine and delivers a plain-language summary:

📊 AIRBANK DAILY BRIEF — May 20, 2026
Revenue: $4,820 (+12% vs yesterday)
Top node: Node 3 ($1,240)
Anomaly: Node 7 — 0 transactions since 03:00 UTC
Action: Pinging Node 7 now...

Set up with one command:

hermes cron "every day at 8am run airbank_daily_brief"

No dashboard. No manual query. Just a brief, every morning, in my Telegram.

3. Multi-Platform Command Surface

I connected Hermes to Telegram so I can command the entire AIRTIMES infrastructure in plain language from my phone:

"What's total AirPay revenue this week?"
"Is Node 7 online?"
"How many transactions failed in the last 24 hours?"

Hermes fetches, reasons, and responds. It works on Telegram, Discord, Slack, and CLI — all from a single gateway process.

The Self-Improving Loop in Action

This is what separates Hermes from every other agent I've used.

After three days of running on AIRTIMES, Hermes had automatically generated 6 custom skills:

Skill	Trigger
`airpay_failure_diagnosis.skill`	First payment failure investigation
`node_health_check.skill`	First uptime check across nodes
`revenue_anomaly_alert.skill`	First time it spotted a revenue dip
`airbank_daily_brief.skill`	After the first manual briefing request
`multi_node_ping.skill`	After diagnosing Node 7 offline
`tx_retry_handler.skill`	After the second payment retry sequence

I didn't write any of these. Hermes wrote them itself — and every subsequent run of the same task was faster and more accurate because the skill had been refined.

Installation (60 seconds)

# Install Hermes
curl -fsSL https://hermes-agent.nousresearch.com/install.sh | bash

# Run setup wizard
hermes setup

# Connect Telegram
hermes setup --gateway telegram

# Point it at your project
hermes chat "I have a Node.js server running AIRTIMES on port 3000. 
Monitor transaction health and report anomalies."

What This Changes

AIRTIMES used to be infrastructure I managed. Now it's infrastructure that manages itself — with me as the oversight layer, not the execution layer.

Hermes doesn't just execute tasks. It accumulates operational knowledge about AIRTIMES: which nodes fail most often, what payment patterns precede failures, which revenue anomalies are noise vs. signal. That knowledge compounds.

Six months from now, the version of Hermes running on AIRTIMES will be meaningfully smarter than the version I installed today — without me touching a line of code.

That's the promise of a self-improving agent. And for a global infrastructure platform like AIRTIMES, that's not a nice-to-have. It's the only architecture that makes sense.

What's Next

Expanding Hermes to manage AIREXPRESS (EV mesh connectivity dashboard)
Building a public agentskills.io skill pack for AIRTIMES operators
Exploring batch trajectory generation for training a domain-specific AIRTIMES model

Links

Built with Hermes Agent by Nous Research · MIT License

Tags: #hermesagentchallenge #devchallenge #agents #opensource
is a submission for the Hermes Agent Challenge*

HERMES AGENT WRITE UP SUMMISSIO

Gift Trust — Wed, 20 May 2026 06:33:50 +0000

*# How I Built an Agentic Layer on AIRTIMES Using Hermes Agent

A submission for the Hermes Agent Challenge

What is AIRTIMES?

The Problem: Infrastructure Without Intelligence

AIRTIMES processes payments and tracks revenue across nodes. But monitoring it meant either:

Staring at logs manually
Writing one-off scripts that break and never improve
Paying for a SaaS dashboard that doesn't understand my custom data model

None of those felt right. What I needed was an agent that could live inside the platform, understand its data, react to events, and — crucially — get smarter the longer it ran.

That's when I found Hermes Agent by Nous Research.

Why Hermes?

Most agent frameworks are graphs you design ahead of time. You wire the nodes, define the flows, and ship. The agent's capability is permanently bounded by what you prompted into it on day one.

Hermes is different. It has a built-in learning loop:

After completing a complex task, it automatically writes a reusable skill
Skills self-improve every time they're used
It builds a persistent memory of your projects across sessions
It runs unattended automations via natural language cron scheduling

For AIRTIMES — a platform that runs 24/7 — this is exactly the right architecture.

What I Built: The AIRTIMES Agentic Layer

I installed Hermes directly on the AIRTIMES server and gave it three jobs.

1. AirPay Transaction Monitor

Hermes watches the AirPay transaction stream continuously. When a payment fails, it:

Diagnoses the failure (network timeout? invalid address? insufficient funds?)
Triggers the retry logic
Logs a structured incident report
Sends a Telegram alert to my phone

The first time it did this, it wrote a skill called airpay_failure_diagnosis.skill automatically. The next failure? It handled in seconds — no manual input.

2. AirBank Daily Revenue Briefing

Every morning at 8am, Hermes pulls from the AirBank revenue engine and delivers a plain-language summary:

📊 AIRBANK DAILY BRIEF — May 20, 2026
Revenue: $4,820 (+12% vs yesterday)
Top node: Node 3 ($1,240)
Anomaly: Node 7 — 0 transactions since 03:00 UTC
Action: Pinging Node 7 now...

Set up with one command:

hermes cron "every day at 8am run airbank_daily_brief"

No dashboard. No manual query. Just a brief, every morning, in my Telegram.

3. Multi-Platform Command Surface

I connected Hermes to Telegram so I can command the entire AIRTIMES infrastructure in plain language from my phone:

"What's total AirPay revenue this week?"
"Is Node 7 online?"
"How many transactions failed in the last 24 hours?"

Hermes fetches, reasons, and responds. It works on Telegram, Discord, Slack, and CLI — all from a single gateway process.

The Self-Improving Loop in Action

This is what separates Hermes from every other agent I've used.

After three days of running on AIRTIMES, Hermes had automatically generated 6 custom skills:

Skill	Trigger
`airpay_failure_diagnosis.skill`	First payment failure investigation
`node_health_check.skill`	First uptime check across nodes
`revenue_anomaly_alert.skill`	First time it spotted a revenue dip
`airbank_daily_brief.skill`	After the first manual briefing request
`multi_node_ping.skill`	After diagnosing Node 7 offline
`tx_retry_handler.skill`	After the second payment retry sequence

I didn't write any of these. Hermes wrote them itself — and every subsequent run of the same task was faster and more accurate because the skill had been refined.

Installation (60 seconds)

# Install Hermes
curl -fsSL https://hermes-agent.nousresearch.com/install.sh | bash

# Run setup wizard
hermes setup

# Connect Telegram
hermes setup --gateway telegram

# Point it at your project
hermes chat "I have a Node.js server running AIRTIMES on port 3000. 
Monitor transaction health and report anomalies."

What This Changes

AIRTIMES used to be infrastructure I managed. Now it's infrastructure that manages itself — with me as the oversight layer, not the execution layer.

Six months from now, the version of Hermes running on AIRTIMES will be meaningfully smarter than the version I installed today — without me touching a line of code.

That's the promise of a self-improving agent. And for a global infrastructure platform like AIRTIMES, that's not a nice-to-have. It's the only architecture that makes sense.

What's Next

Expanding Hermes to manage AIREXPRESS (EV mesh connectivity dashboard)
Building a public agentskills.io skill pack for AIRTIMES operators
Exploring batch trajectory generation for training a domain-specific AIRTIMES model

Links

Built with Hermes Agent by Nous Research · MIT License

Tags: #hermesagentchallenge #devchallenge #agents #opensource
is a submission for the Hermes Agent Challenge*

DEV Community: Gift Trust

CONTINENTAL EPICTURE

CONTINETAL EPICTURE

CONTINENTAL EPICTURE

SPACESHOP

AIRTIMES GLOBAL

Frontshop

SPACESHOP

AIRTIMES

What I Built

Demo

Code

How I Built It

Prize Categories

AIRTIMES GLOBAL NETWORK

MODAC GLOBAL AIRTIMES

!/bin/bash

============================================================

MODAC GLOBAL SYSTEM - COMPLETE INTEGRATED DEPLOYMENT

Includes: Transaction Blocking, Agent Verification, Wallet System

One script deploys everything

============================================================

==================== PHASE 1: DIRECTORY STRUCTURE ====================

==================== PHASE 2: CORE SECURITY FILES ====================

Create main security module

Create agent registry

==================== PHASE 3: API WITH BLOCKING ====================

Create main API

Add security beacon to path

==================== PHASE 4: REQUIREMENTS ====================

==================== PHASE 5: DOCKER CONFIGURATION ====================

Create Dockerfile

Create docker-compose

==================== PHASE 6: FRONTEND DASHBOARD ====================

🛡️ MODAC SECURITY DASHBOARD

Create NGINX config

==================== PHASE 7: DEPLOYMENT SCRIPTS ====================

Create start script

!/bin/bash

Build and start

Health check

Create stop script

!/bin/bash

Create test script

!/bin/bash

==================== FINAL SETUP ====================

Create empty registry

Create README

MODAC GLOBAL SYSTEM

Quick Start

Security Features

API Endpoints

How It Works

==================== DEPLOYMENT COMPLETE ====================

What I Built

Demo

The Comeback Story

My Experience with GitHub Copilot

HERMES AGENT SUMMISSIO

What is AIRTIMES?

The Problem: Infrastructure Without Intelligence

Why Hermes?

What I Built: The AIRTIMES Agentic Layer

1. AirPay Transaction Monitor

2. AirBank Daily Revenue Briefing

3. Multi-Platform Command Surface

The Self-Improving Loop in Action

Installation (60 seconds)

What This Changes

What's Next

Links

HERMES AGENT WRITE UP SUMMISSIO

What is AIRTIMES?

The Problem: Infrastructure Without Intelligence

Why Hermes?

What I Built: The AIRTIMES Agentic Layer

1. AirPay Transaction Monitor

2. AirBank Daily Revenue Briefing

3. Multi-Platform Command Surface

The Self-Improving Loop in Action