Site Builder
Editing:
indexok.php
writable 0666
<!doctype html> <html lang="en" data-theme="amber"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width,initial-scale=1" /> <title>TruthCase™ — The Case for Truth About “Anti‑Radiation” Phone Cases | RF SAFE</title> <meta name="description" content="TruthCase™ teaches first principles—design, usage, policy, procedure—to reduce everyday microwave exposure. Choose your phone. Two buttons: Buy on Amazon or Buy Now. Everything else is truth." /> <style> /* ---------------- AMBER (LOW-BLUE) THEME ---------------- */ :root{ --brand:#ffb020; --brand-ink:#ffe1a6; --ink:#ffe8c8; --muted:#d7c9ad; --ring: rgba(255,176,32,.35); --ok:#f0cf6a; --warn:#ff9a5c; --bg:linear-gradient(180deg,#0e0b06 0%, #171208 100%); --card:#151109; --border:#372b1a; --shadow:0 14px 36px rgba(0,0,0,.45); --soft:rgba(255,176,32,.12); --soft2:rgba(255,176,32,.08); --accent:#f8d79a; --radius:22px; } *{box-sizing:border-box} html,body{ margin:0;background:var(--bg);color:var(--ink); font:16px/1.75 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","DejaVu Sans Mono","Courier New",monospace; letter-spacing:.2px; } a{color:var(--brand);text-decoration:none} a:hover{text-decoration:underline} .wrap{max-width:1200px;margin:0 auto;padding:28px 18px 120px} /* NAV */ .nav{position:sticky;top:0;z-index:40;backdrop-filter:saturate(1.1) blur(8px); background:rgba(24,18,10,.68);border-bottom:1px solid var(--border)} .navin{max-width:1200px;margin:0 auto;display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 18px} .brand{display:flex;gap:10px;align-items:center;font-weight:900;color:var(--brand-ink)} .dot{width:12px;height:12px;border-radius:50%;background:var(--brand);box-shadow:0 0 18px var(--ring)} .row{display:flex;gap:8px;align-items:center;flex-wrap:wrap} .btn{display:inline-flex;align-items:center;gap:10px;border-radius:999px;padding:11px 16px;font-weight:900;border:2px solid var(--brand); background:transparent;color:var(--brand);box-shadow:0 8px 20px var(--ring);transition:.2s;cursor:pointer} .btn:hover{transform:translateY(-1px)} .btn.primary{background:var(--brand);color:#1a1309} .btn.ghost{border-color:var(--border);color:var(--brand)} .btn.small{padding:8px 12px;font-size:.92rem} /* HERO */ .hero{ margin-top:18px;background: radial-gradient(900px 320px at 10% -20%, var(--soft), transparent 60%), radial-gradient(900px 320px at 90% -40%, var(--soft), transparent 60%), var(--card); border-radius:28px;box-shadow:var(--shadow);padding:28px } .eyebrow{display:inline-flex;align-items:center;gap:8px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--brand); border:1px solid var(--border);background:var(--soft2);border-radius:999px;padding:6px 12px} h1{margin:10px 0 8px;font-size:clamp(28px,4.9vw,56px);line-height:1.06;color:var(--brand-ink)} .subtitle{color:var(--muted);max-width:980px} .badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px} .badge{font-size:12px;font-weight:900;border:1px solid var(--border);background:var(--soft2);color:var(--brand); border-radius:999px;padding:6px 10px} .cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px} /* CONTENT */ .section{margin-top:44px} .card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;border:1px solid var(--border)} .grid{display:grid;gap:18px} @media(min-width:980px){.cols-2{grid-template-columns:1fr 1fr}.cols-3{grid-template-columns:1fr 1fr 1fr}} .muted{color:var(--muted)} .lead{font-size:1.05rem;color:var(--accent)} .slogan{border-left:4px solid var(--brand);padding-left:12px;margin:6px 0;font-weight:900;color:var(--brand-ink)} .callout{background:var(--soft2);border:1px solid var(--border);border-radius:16px;padding:14px} /* DETAILS (accordion) */ details{border:1px solid var(--border);border-radius:14px;background:rgba(255,176,32,.05);padding:10px} summary{cursor:pointer;font-weight:900;color:var(--brand-ink)} summary::-webkit-details-marker{display:none} details[open]{background:rgba(255,176,32,.08)} /* TABLE */ .table{overflow:auto;border-radius:14px;border:1px solid var(--border)} table{width:100%;border-collapse:separate;border-spacing:0;min-width:820px} th,td{padding:12px 14px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top} thead th{background:var(--soft2);font-size:14px;color:var(--brand)} /* ===== MODAL (enhanced visibility, chained select, accessibility) ===== */ .modal-backdrop{ position:fixed; inset:0; z-index:100; background: radial-gradient(900px 420px at 50% 10%, rgba(255,176,32,.18), rgba(0,0,0,.78) 58%), rgba(0,0,0,.62); display:none; opacity:0; pointer-events:none; transition: opacity .25s ease; } .modal{ position:fixed; inset:0; z-index:101; display:none; place-items:center; pointer-events:none; opacity:0; transition: opacity .25s ease; } .modal-panel{ width:min(720px,94vw); background:#1a140b; border-radius:20px; border:1px solid #6b4a1f; box-shadow: 0 22px 60px rgba(0,0,0,.6), 0 0 0 2px rgba(255,176,32,.18) inset, 0 0 0 6px rgba(255,176,32,.10); padding:18px; pointer-events:auto; transform: translateY(6px) scale(.985); transition: transform .28s ease, box-shadow .28s ease, background .28s ease; position:relative; } .modal-panel::before{ content:""; position:absolute; inset:-2px; border-radius:22px; pointer-events:none; box-shadow: 0 0 0 2px rgba(255,176,32,.25), 0 0 40px rgba(255,176,32,.14); } .modal-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px} .modal-title{font-weight:900;color:#ffe1a6;margin:0} .close{appearance:none;border:1px solid #5a3f1c;background:#120d07;color:#ffb020; border-radius:999px;padding:8px 12px;font-weight:900;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.35)} .close:hover{transform:translateY(-1px)} .form-row{display:grid;gap:14px;margin-top:12px} @media(min-width:700px){ .form-row{grid-template-columns:1fr 1fr} } label{font-weight:700} select{ width:100%;padding:12px;border:1px solid #5a3f1c;border-radius:12px; background:#0f0c06;color:#ffe8c8;font-size:16px; /* avoid iOS zoom */ box-shadow: 0 8px 20px rgba(0,0,0,.25) inset; } select:focus-visible{ outline:2px solid rgba(255,176,32,.55) } .modal-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px} .helper{font-size:.9rem;color:var(--muted)} .is-hidden{display:none !important} /* open state toggled on body */ body.modal-open .modal-backdrop{ display:block; opacity:1; pointer-events:auto } body.modal-open .modal{ display:grid; opacity:1; pointer-events:auto } body.modal-open .modal-panel{ transform: translateY(0) scale(1) } /* blur/dim page when modal open */ body.modal-open .wrap, body.modal-open .nav{ filter: blur(1.2px) saturate(.85); opacity:.85; transform: scale(.998); transition: filter .2s ease, opacity .2s ease, transform .2s ease; } /* mobile: bottom sheet + sticky actions */ @media (max-width: 560px){ .modal{ align-items:end; } .modal-panel{ width:100vw; max-height:85vh; overflow:auto; border-radius:16px 16px 0 0; padding:16px 16px 20px; } .modal-panel::after{ content:""; display:block; width:44px; height:4px; border-radius:999px; background:#d7c9ad; opacity:.6; margin:4px auto 8px; } .modal-actions{ position: sticky; bottom:-16px; background: linear-gradient(180deg, rgba(26,20,11,0) 0%, rgba(26,20,11,.96) 42%); padding-top:10px; padding-bottom:4px; } } /* REVEAL */ .reveal{opacity:0;transform:translateY(12px);transition:all .5s ease} .reveal.in{opacity:1;transform:none} /* sr-only for live announcements */ .sr-only{position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;} /* motion reduction */ @media (prefers-reduced-motion: reduce){ .modal-backdrop, .modal, .modal-panel, body.modal-open .wrap, body.modal-open .nav{ transition: none !important; } } </style> </head> <body> <!-- NAV --> <div class="nav" role="navigation" aria-label="Primary"> <div class="navin"> <div class="brand"><span class="dot"></span><span>RF SAFE • TruthCase™</span></div> <div class="row"> <a class="btn ghost" href="#truths">The Four Truths</a> <a class="btn ghost" href="#how">How to Use</a> <a class="btn ghost" href="#policy">Policy Roadmap</a> <button class="btn primary" id="openModalBtn" type="button">Select Your Phone</button> </div> </div> </div> <div class="wrap"> <!-- HERO --> <header class="hero reveal"> <span class="eyebrow">RF SAFE • Since the 1990s</span> <h1>TruthCase™ — the case that tells the truth</h1> <p class="subtitle"> RF SAFE pioneered exposure‑reduction phone cases in the <strong>1990s</strong>. TruthCase™ is different: a first‑principles design with one goal—reduce everyday microwave exposure responsibly and teach the roadmap forward (<em>design • usage • policy • procedure</em>). </p> <div class="badges" role="list"> <span class="badge" role="listitem">Shield between you & phone</span> <span class="badge" role="listitem">No metal loops • No magnets</span> <span class="badge" role="listitem">Antenna‑aware & ultra‑thin</span> <span class="badge" role="listitem">Ohmmeter‑checkable shield</span> </div> <div class="cta-row"> <button class="btn primary" id="openModalBtn2" type="button">Select Your Phone</button> <a class="btn" href="#truths">Learn why TruthCase™ is different</a> </div> </header> <!-- DIFFERENT ON PURPOSE --> <section class="section card reveal"> <h2 style="margin:0 0 8px;color:var(--brand-ink)">Different on purpose</h2> <p class="lead">Most “anti‑radiation” cases are built around convenience hardware and marketing numbers. TruthCase™ is built around physics and behavior.</p> <div class="grid cols-3"> <div class="card"> <h3 style="margin:.2rem 0 6px">Design</h3> <p>Directional shielding only when it matters (between you & phone). No metal loops, magnets, or plate steel. Continuity near the ear.</p> </div> <div class="card"> <h3 style="margin:.2rem 0 6px">Usage</h3> <p>The habits that move the needle: call posture, pocket orientation, night distance, disabling idle radios.</p> </div> <div class="card"> <h3 style="margin:.2rem 0 6px">Roadmap</h3> <p>From better cases today to <strong>light‑based networking</strong> and modernized policy tomorrow—so indoor connectivity relies more on light and less on microwaves.</p> </div> </div> </section> <!-- THE FOUR TRUTHS --> <section id="truths" class="section card reveal"> <h2 style="margin:0 0 6px;color:var(--brand-ink)">The Four Truths the Market Ignores</h2> <details open> <summary>Truth #1 — Unshielded ear‑side holes break protection where you need it most</summary> <p>Large speaker apertures on the ear side create a direct path for higher‑frequency signals and defeat continuity at the very spot you rely on protection during calls. TruthCase™ uses a shielded ear‑side path and keeps continuity by design.</p> </details> <details> <summary>Truth #2 — Detachable magnets & steel plates can provoke higher transmit power</summary> <p>Magnets and plate steel behind the phone obstruct or detune antennas. Modern handsets respond by boosting transmit power to hold the link. Result: more exposure, not less. TruthCase™ excludes magnetic detachables and plate steel by design.</p> </details> <details> <summary>Truth #3 — Metal loops and decorative hardware near antennas can detune the system</summary> <p>Conductive hardware close to radiators alters near‑field behavior and can degrade antenna efficiency. Phones compensate—with higher output. TruthCase™ has <strong>no metal loops</strong> and stays thin near antenna zones.</p> </details> <details> <summary>Truth #4 — “99% protection” fabric numbers ≠ everyday exposure</summary> <p>A swatch test is not your life. Real‑world reduction depends on <em>where</em> the shield is (relative to your body), <em>how</em> the antennas perform, and <em>how long</em> radios are active. TruthCase™ focuses on device behavior and user practice—no “99% everywhere” slogans.</p> </details> <div class="card" style="margin-top:12px"> <h3 style="margin:0 0 6px;color:var(--brand-ink)">Ten short truths</h3> <p class="slogan">Shield the person, not the phone.</p> <p class="slogan">Placement beats percentage.</p> <p class="slogan">Thin near antennas. Always.</p> <p class="slogan">No magnets, no metal loops, no plate steel.</p> <p class="slogan">Continuity at the ear matters.</p> <p class="slogan">Duty cycle is exposure—turn off idle radios.</p> <p class="slogan">Distance at night is free protection.</p> <p class="slogan">Honest design beats “99% everywhere.”</p> <p class="slogan">Personal mitigation now, public defaults next.</p> <p class="slogan">Light indoors, fewer microwaves—future‑ready.</p> </div> </section> <!-- TRUTH STANDARD --> <section class="section card reveal"> <h2 style="margin:0 0 6px;color:var(--brand-ink)">The Truth Standard™</h2> <div class="table"> <table> <thead><tr><th>Principle</th><th>Meaning</th><th>TruthCase™ Position</th></tr></thead> <tbody> <tr> <td><strong>Shield the person, not the phone</strong></td> <td>Place the shield <em>between</em> you & the source during use (calls, pocket carry).</td> <td>Front cover toward head/body; directional use is the point.</td> </tr> <tr> <td><strong>Keep antennas efficient</strong></td> <td>Don’t obstruct/detune radiators and trigger power boosts.</td> <td><strong>No metal loops, no magnets, no plate steel</strong>; thin where radios live.</td> </tr> <tr> <td><strong>Continuity at the ear</strong></td> <td>Avoid a big unshielded aperture aligned with the ear canal.</td> <td>Shielded ear‑side path; continuity maintained in call posture.</td> </tr> <tr> <td><strong>Field behavior > fabric %</strong></td> <td>Judge protection by device behavior in use—not a swatch number.</td> <td>No “99% everywhere” claims; we teach how to use it right.</td> </tr> <tr> <td><strong>Verifiable materials</strong></td> <td>Let people confirm a conductive shield path.</td> <td>Ohmmeter‑checkable access point in the front cover.</td> </tr> </tbody> </table> </div> </section> <!-- HOW TO USE --> <section id="how" class="section grid cols-2 reveal"> <div class="card"> <h3 style="margin:0 0 6px;color:var(--brand-ink)">How to use TruthCase™ (the habits)</h3> <ul> <li><strong>Calls:</strong> answer/start, then close the cover <em>toward your head</em>; use speaker or wired for long calls.</li> <li><strong>Pocket:</strong> shielded cover toward your body (back pocket often best).</li> <li><strong>Night:</strong> increase distance or airplane mode; don’t park the phone near your head.</li> <li><strong>Duty cycle:</strong> turn off idle transmitters you don’t need (Wi‑Fi, Bluetooth, hotspot).</li> </ul> <p class="muted">Protection is practice + design. The case enables the practice to work.</p> </div> <div class="card"> <h3 style="margin:0 0 6px;color:var(--brand-ink)">Why thin matters</h3> <p>Over‑thick “armor” near antenna zones degrades efficiency and can make the phone transmit harder. TruthCase™ keeps a deliberately slim, antenna‑aware profile so your phone can do the same job with less output.</p> <p class="slogan">Not anti‑radiation. <strong>Pro‑truth.</strong></p> </div> </section> <!-- POLICY ROADMAP --> <section id="policy" class="section card reveal"> <h2 style="margin:0 0 6px;color:var(--brand-ink)">From personal mitigation to public defaults</h2> <p class="lead">Reducing exposure at scale requires policy and standards—not just products.</p> <div class="grid cols-3"> <div class="card"> <h3 style="margin:.2rem 0 6px">1) Update siting law</h3> <p><strong>Section 704 (1996)</strong> limits local health‑based arguments on RF emissions for compliant facilities. Communities need a modern framework that allows health to be considered alongside coverage and aesthetics.</p> <p><a href="#refs">See references</a></p> </div> <div class="card"> <h3 style="margin:.2rem 0 6px">2) Finish the science</h3> <p>Maintain and fund federal RF research and performance standards (e.g., under the 1968 radiation control law) to keep guidance current with today’s signal environments and duty cycles.</p> <p><a href="#refs">See references</a></p> </div> <div class="card"> <h3 style="margin:.2rem 0 6px">3) Promote light indoors</h3> <p>Adopt <strong>light‑based networking</strong> (Li‑Fi) where feasible. The <strong>IEEE 802.11bb</strong> standard makes optical networking a first‑class citizen alongside Wi‑Fi. Indoors, light stays in the room—performance with privacy.</p> <p><a href="#refs">See references</a></p> </div> </div> <div class="callout" style="margin-top:10px"> <strong>The TruthCase™ is a bridge.</strong> It reduces exposure now—and helps people advocate for healthier defaults (schools, bedrooms, offices) where the goal is less routine microwave traffic and more light‑based links. </div> </section> <!-- QUICK FAQ --> <section class="section card reveal"> <h2 style="margin:0 0 6px;color:var(--brand-ink)">Quick answers</h2> <div class="grid cols-2"> <div class="card"> <h3>Does it “block 99%”?</h3> <p>No slogans. Real‑world reduction depends on placement, antenna performance, and duty cycle. We teach the practice that lowers exposure; we do not promise swatch numbers.</p> </div> <div class="card"> <h3>Is thicker better?</h3> <p>Not near antennas. Over‑thick materials can degrade efficiency and provoke higher transmit power. Thin + correct placement wins.</p> </div> </div> </section> <!-- REFERENCES --> <section id="refs" class="section card reveal"> <h2 style="margin:0 0 6px;color:var(--brand-ink)">References & Further Reading</h2> <ol> <li>FTC consumer guidance noting that some “shields” can interfere with signal and cause phones to draw more power (which can increase emissions). <br><a href="https://consumer.ftc.gov/articles/cell-phone-radiation-scams" target="_blank" rel="noopener">consumer.ftc.gov/articles/cell-phone-radiation-scams</a> </li> <li>Telecommunications Act of 1996, 47 U.S.C. §332(c)(7) (often cited as “Section 704”). <br><a href="https://www.law.cornell.edu/uscode/text/47/332" target="_blank" rel="noopener">law.cornell.edu/uscode/text/47/332</a> </li> <li>Environmental Health Trust v. FCC (D.C. Cir. 2021) — court remand requiring a reasoned explanation on non‑cancer harms and modern usage patterns before reaffirming 1996 limits. <br><a href="https://law.justia.com/cases/federal/appellate-courts/cadc/20-1025/20-1025-2021-08-13.html" target="_blank" rel="noopener">law.justia.com/.../20-1025-2021-08-13.html</a> </li> <li>U.S. National Toxicology Program (cell phone RFR studies) — program pages and fact sheets. <br><a href="https://ntp.niehs.nih.gov/whatwestudy/topics/cellphones/index.html" target="_blank" rel="noopener">ntp.niehs.nih.gov/.../cellphones</a> </li> <li>IEEE 802.11bb — optical (Li‑Fi) standard in the 802.11 family (2023). <br><a href="https://standards.ieee.org/ieee/802.11bb/11055/" target="_blank" rel="noopener">standards.ieee.org/ieee/802.11bb/11055/</a> </li> </ol> <p class="muted small">Educational content only. Not medical, legal, or engineering advice.</p> </section> <!-- CTA --> <section class="section card reveal" style="text-align:center"> <h2 style="margin:0 0 6px;color:var(--brand-ink)">The only case for your phone should be a TruthCase™</h2> <p style="max-width:840px;margin:0 auto"> A case should <strong>reduce exposure in real use</strong>—without forcing your phone to work harder and without promising “99% everywhere.” TruthCase™ is built for <strong>physics</strong>, for <strong>people</strong>, and for a <strong>future</strong> where indoor connectivity relies more on light and less on microwaves. </p> <div class="cta-row" style="justify-content:center"> <button class="btn primary" id="openModalBtn3" type="button">Select Your Phone</button> </div> </section> <footer> <p><strong>RF SAFE</strong> introduced exposure‑reduction cases in the 1990s and continues to set a first‑principles standard: no metal loops, no magnets or plate steel, a shielded ear‑side aperture, antenna‑aware thin design, and ohmmeter‑verified shielding—paired with honest usage guidance.</p> <p class="muted">© RF SAFE — This page focuses on reducing RF (microwave) exposure in everyday device use.</p> </footer> </div> <!-- MODAL: Manufacturer → Model (hidden until Manufacturer) → (2 buttons) --> <div class="modal-backdrop" id="backdrop" aria-hidden="true"></div> <div class="modal" id="modal" aria-hidden="true"> <div class="modal-panel" role="dialog" aria-modal="true" aria-labelledby="modalTitle"> <div class="modal-head"> <h3 id="modalTitle" class="modal-title">Select Your Phone</h3> <button class="close" id="closeModalBtn" type="button" aria-label="Close">✕</button> </div> <p id="announce" class="sr-only" aria-live="polite"></p> <div class="form-row" id="manuRow" style="display:none"> <div> <label for="manuSelect">Manufacturer</label> <select id="manuSelect" aria-describedby="manuHelp"></select> <div id="manuHelp" class="helper">Choose a brand to filter models.</div> </div> <div id="modelCol" class="is-hidden"> <label for="modelSelect">Model</label> <select id="modelSelect" aria-describedby="modelHelp" disabled></select> <div id="modelHelp" class="helper">Pick your specific phone model.</div> </div> </div> <div class="form-row" id="modelOnlyRow" style="display:none"> <div style="grid-column:1/-1"> <label for="modelSelectSolo">Model</label> <select id="modelSelectSolo" aria-describedby="modelOnlyHelp"></select> <div id="modelOnlyHelp" class="helper">Models loaded from <code>truthcases.json</code>.</div> </div> </div> <div class="modal-actions" id="buyButtons" style="display:none"> <a class="btn" id="buyAmazonBtn" href="#" target="_blank" rel="noopener">Buy on Amazon</a> <a class="btn primary" id="buyDirectBtn" href="#" target="_blank" rel="noopener">Buy Now</a> </div> </div> </div> <script> /* ---------------------- UTILITIES ---------------------- */ const $ = sel => document.querySelector(sel); function unique(arr){ return [...new Set(arr)]; } function getQS(name){ try{ return new URL(location.href).searchParams.get(name); }catch{return null;} } function appendParam(urlStr, key, val){ if(!val) return urlStr; try{ const u = new URL(urlStr, location.href); u.searchParams.set(key, val); return u.toString(); }catch{ const sep = urlStr.includes('?') ? '&' : '?'; return urlStr + sep + encodeURIComponent(key) + '=' + encodeURIComponent(val); } } const norm = s => (s||'').toString().toLowerCase().replace(/\s+/g,' ').trim(); /* ---------------------- STATE ---------------------- */ let DATA = { settings:{}, products:[] }; let manufacturers = []; let selectedManufacturer = ''; let filteredProducts = []; let affiliateRef = ''; let amazonTag = ''; /* ---------------------- DOM ---------------------- */ const openModalBtns = ['#openModalBtn','#openModalBtn2','#openModalBtn3'].map(sel=>$(sel)).filter(Boolean); const backdrop = $('#backdrop'); const modal = $('#modal'); const closeModalBtn = $('#closeModalBtn'); const manuRow = $('#manuRow'); const manuSelect = $('#manuSelect'); const modelCol = $('#modelCol'); const modelOnlyRow = $('#modelOnlyRow'); const modelSelect = $('#modelSelect'); const modelSelectSolo = $('#modelSelectSolo'); const buyButtons = $('#buyButtons'); const buyDirectBtn = $('#buyDirectBtn'); const buyAmazonBtn = $('#buyAmazonBtn'); const announceEl = $('#announce'); /* ===== OPEN/CLOSE (body class, focus trap, scroll lock) ===== */ const focusableSelectors = ` a[href], button:not([disabled]), select:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex="-1"]) `; let lastFocused = null; function trapFocus(e){ if(e.key !== 'Tab') return; const focusables = Array.from(modal.querySelectorAll(focusableSelectors)) .filter(el => el.offsetParent !== null); if(!focusables.length) return; const first = focusables[0], last = focusables[focusables.length - 1]; if(e.shiftKey && document.activeElement === first){ last.focus(); e.preventDefault(); } else if(!e.shiftKey && document.activeElement === last){ first.focus(); e.preventDefault(); } } function escToClose(e){ if(e.key === 'Escape') closeModal(); } function openModal(){ lastFocused = document.activeElement; document.body.classList.add('modal-open'); document.body.style.overflow = 'hidden'; backdrop.style.display = 'block'; modal.style.display = 'grid'; modal.setAttribute('aria-hidden','false'); requestAnimationFrame(()=>{ backdrop.style.opacity = '1'; modal.style.opacity = '1'; }); setTimeout(()=>{ if(manuRow.style.display!=='none') manuSelect.focus(); else modelSelectSolo.focus(); }, 30); document.addEventListener('keydown', trapFocus); document.addEventListener('keydown', escToClose); } function closeModal(){ document.removeEventListener('keydown', trapFocus); document.removeEventListener('keydown', escToClose); document.body.classList.remove('modal-open'); document.body.style.overflow = ''; backdrop.style.opacity = '0'; modal.style.opacity = '0'; modal.setAttribute('aria-hidden','true'); setTimeout(()=>{ backdrop.style.display = 'none'; modal.style.display = 'none'; }, 200); if(lastFocused && typeof lastFocused.focus === 'function'){ lastFocused.focus(); } } backdrop.addEventListener('click', closeModal); closeModalBtn.addEventListener('click', closeModal); openModalBtns.forEach(b=>b && b.addEventListener('click', openModal)); /* ---------------------- DATA LOADING ---------------------- */ async function loadData(){ try{ const res = await fetch('truthcases.json', {cache:'no-store'}); if(!res.ok) throw new Error('HTTP '+res.status); const j = await res.json(); DATA = Object.assign({settings:{}, products:[]}, j||{}); if(!DATA.products || !Array.isArray(DATA.products) || !DATA.products.length) throw new Error('No products'); }catch(err){ console.warn('truthcases.json not found or invalid, using demo data.', err); DATA = { settings:{ defaultAffiliateParam:'ref', defaultAmazonTagParam:'tag' }, products:[ { manufacturer:'Apple', title:'TruthCase™ for iPhone 15 Pro Max (Black)', sku:'QC-IP15PM-BLK', asin:'B0DEMO1234', price:59.95, salePrice:49.95, buyUrl:'https://www.rfsafe.com/product/truthcase-iphone-15-pro-max/', affiliateId:'RFS_DEFAULT', amazonTag:'rfsafe-20' }, { manufacturer:'Samsung', title:'TruthCase™ for Galaxy S24 Ultra (Black)', sku:'QC-S24U-BLK', asin:'', price:57.95, salePrice:null, buyUrl:'https://www.rfsafe.com/product/truthcase-s24-ultra/', affiliateId:'RFS_DEFAULT', amazonTag:'' } ] }; } } /* ---------------------- BUILDERS ---------------------- */ function buildManufacturers(){ manufacturers = unique((DATA.products||[]).map(p => (p.manufacturer||'').trim()).filter(Boolean)); } function renderManufacturerSelect(){ manuSelect.innerHTML=''; const ph=document.createElement('option'); ph.value=''; ph.textContent='Choose manufacturer…'; manuSelect.appendChild(ph); manufacturers.forEach(m=>{ const o=document.createElement('option'); o.value=m; o.textContent=m; manuSelect.appendChild(o); }); manuSelect.value = selectedManufacturer || ''; } function renderModelSelect(list, el){ el.innerHTML=''; const ph=document.createElement('option'); ph.value=''; ph.textContent='Choose model…'; el.appendChild(ph); list.forEach((p,idx)=>{ const o=document.createElement('option'); o.value=String(idx); const manu=(p.manufacturer||'').trim(); o.textContent = (el===modelSelectSolo && manu) ? `${manu} — ${p.title}` : (p.title||`Model ${idx+1}`); el.appendChild(o); }); el.value=''; } /* ---------------------- LINKS ---------------------- */ function currentAffiliateRef(p){ return (affiliateRef || p.affiliateId || '').trim(); } function currentAmazonTag(p){ return (amazonTag || p.amazonTag || '').trim(); } function buildDirectUrl(p){ const base=(p.buyUrl||'').trim(); if(!base) return ''; const paramKey=(DATA.settings && DATA.settings.defaultAffiliateParam) || 'ref'; const code=currentAffiliateRef(p); return appendParam(base, paramKey, code || ''); } function buildAmazonUrl(p){ const asin=(p.asin||'').trim(); if(!asin) return ''; const tagKey=(DATA.settings && DATA.settings.defaultAmazonTagParam) || 'tag'; const tagVal=currentAmazonTag(p); let base=`https://www.amazon.com/dp/${encodeURIComponent(asin)}`; return tagVal ? appendParam(base, tagKey, tagVal) : base; } /* ---------------------- SELECTION & EVENTS ---------------------- */ function showButtonsForProduct(p){ const dir=buildDirectUrl(p); const amz=buildAmazonUrl(p); if(amz){ buyAmazonBtn.href=amz; buyAmazonBtn.style.display='inline-flex'; } else { buyAmazonBtn.removeAttribute('href'); buyAmazonBtn.style.display='none'; } if(dir){ buyDirectBtn.href=dir; buyDirectBtn.style.display='inline-flex'; } else { buyDirectBtn.removeAttribute('href'); buyDirectBtn.style.display='none'; } buyButtons.style.display = (amz || dir) ? 'flex' : 'none'; } function announce(msg){ if(announceEl) announceEl.textContent = msg || ''; } manuSelect.addEventListener('change', ()=>{ selectedManufacturer = manuSelect.value; filteredProducts = selectedManufacturer ? DATA.products.filter(p => (p.manufacturer||'').trim()===selectedManufacturer) : DATA.products.slice(); // Reveal the model column only after manufacturer is chosen (chained select) if(selectedManufacturer){ modelCol.classList.remove('is-hidden'); modelSelect.disabled=false; renderModelSelect(filteredProducts, modelSelect); announce(`Manufacturer ${selectedManufacturer} selected. Choose a model.`); }else{ modelCol.classList.add('is-hidden'); modelSelect.disabled=true; modelSelect.innerHTML=''; announce(`Manufacturer cleared. Please select a manufacturer.`); } buyButtons.style.display='none'; }); modelSelect.addEventListener('change', ()=>{ const idx=parseInt(modelSelect.value,10); if(Number.isFinite(idx) && idx>=0){ const p = filteredProducts[idx]; if(p){ showButtonsForProduct(p); announce(`Model ${p.title} selected.`); } } else { buyButtons.style.display='none'; } }); modelSelectSolo.addEventListener('change', ()=>{ const idx=parseInt(modelSelectSolo.value,10); if(Number.isFinite(idx) && idx>=0){ const p = DATA.products[idx]; if(p){ showButtonsForProduct(p); announce(`Model ${p.title} selected.`); } } else { buyButtons.style.display='none'; } }); /* ---------------------- DEEP-LINK PRESELECT ---------------------- */ function findProductFromDeepLink(){ const qSku = getQS('sku'); const qAsin = getQS('asin'); const qManu = getQS('manu') || getQS('manufacturer'); const qModel= getQS('model') || getQS('title'); if(qSku){ const p = DATA.products.find(pr => pr.sku && norm(pr.sku) === norm(qSku)); if(p) return p; } if(qAsin){ const p = DATA.products.find(pr => pr.asin && norm(pr.asin) === norm(qAsin)); if(p) return p; } if(qModel){ let p = DATA.products.find(pr => norm(pr.title) === norm(qModel)); if(!p) p = DATA.products.find(pr => norm(pr.title).includes(norm(qModel))); if(p) return p; } if(qManu){ return { __manuOnly:true, manufacturer:qManu }; } return null; } /* ---------------------- INIT ---------------------- */ (async function init(){ // Capture affiliate overrides from URL (persist quietly) const qRef=getQS('ref'); const qTag=getQS('atag'); if(qRef) localStorage.setItem('truthcase_ref', qRef); if(qTag) localStorage.setItem('truthcase_atag', qTag); affiliateRef = qRef || localStorage.getItem('truthcase_ref') || ''; amazonTag = qTag || localStorage.getItem('truthcase_atag') || ''; await loadData(); buildManufacturers(); if(manufacturers.length>0){ manuRow.style.display=''; modelOnlyRow.style.display='none'; selectedManufacturer=''; renderManufacturerSelect(); // model is hidden until manufacturer picked (chained) modelCol.classList.add('is-hidden'); modelSelect.disabled=true; }else{ manuRow.style.display='none'; modelOnlyRow.style.display=''; renderModelSelect(DATA.products, modelSelectSolo); } // Deep-link handling: open modal and preselect if match const pick = findProductFromDeepLink(); if(pick){ openModal(); if(pick.__manuOnly){ const manuName = manufacturers.find(m => norm(m) === norm(pick.manufacturer)) || pick.manufacturer; selectedManufacturer = manuName || ''; if(manufacturers.length>0){ manuSelect.value = selectedManufacturer; manuSelect.dispatchEvent(new Event('change')); } buyButtons.style.display = 'none'; }else{ const manuName = pick.manufacturer || ''; if(manufacturers.length>0){ manuSelect.value = manuName; manuSelect.dispatchEvent(new Event('change')); const idx = filteredProducts.findIndex(pr => norm(pr.title) === norm(pick.title)); const idx2 = idx >= 0 ? idx : filteredProducts.findIndex(pr => norm(pr.title).includes(norm(pick.title))); if(idx2 >= 0){ modelSelect.value = String(idx2); showButtonsForProduct(filteredProducts[idx2]); } }else{ const i = DATA.products.findIndex(pr => norm(pr.title) === norm(pick.title)); if(i>=0){ modelSelectSolo.value = String(i); showButtonsForProduct(DATA.products[i]); } } } } // reveal-on-scroll const io=new IntersectionObserver(es=>es.forEach(e=>{ if(e.isIntersecting){ e.target.classList.add('in'); io.unobserve(e.target);} }),{threshold:.12}); document.querySelectorAll('.reveal').forEach(el=>io.observe(el)); })(); </script> </body> </html>
Save changes
Create folder
writable 0777
Create
Cancel