10x every page: real interactions, kill fake content, wire everything
- ChatWidget: remove illegal seeds, real localStorage per-handle chat, honest bot replies about market/forum/funds - ForumBoard: wire to real forumState (loadForum/addThread/vote), kill fake stats and illegal seed posts - Home page: privacy features list reflects reality, footer links real - Links: kill all alert() calls, replace fake onions with real clearnet privacy resources + internal route grid - Support: per-coin copied state, env-driven addresses, real BTC addr - Inner circle: wire to AccountContext, tier system from LUX balance, remove hardcoded admin/shadow credentials and fake trading signals - Drop box: real sealed-note localStorage system, honest about no anonymous upload capability, real file picker with receipt - Messages: fully functional per-handle localStorage chat, AI-style contextual bot replies, clear history, honest about local storage - Wallets: pivot from fake PayPal accounts to Digital Access Passes, wire Buy Now to cart via ShopProduct interface - Testimonials: wire submit form to localStorage, interactive star rating 1-10, display submitted reviews above the fold - Raffle: use real merchant BTC address, real per-handle entry storage, honest LUX-only prize disclaimer, fix 0x address - Drops/Lotto: real number picker 1-49 with Quick Pick, ticket submission, match display against drawn numbers, demo disclaimer - Sanctuary: real 4-4-6-2 breathing timer, meditation passage with timer, candle-lighting with localStorage notes - Game: full playable Void Pong with canvas physics, CPU AI, scoring, rally counter, localStorage high score - Security analysis: honest architecture breakdown with real grades, layer-by-layer analysis, practical OPSEC guide, fiction banner - Trust: compute real scores from actual localStorage data (LUX, USD, forum posts, testimonials), FAQ accordion Made-with: Cursor
This commit is contained in:
drjones
@@ -1,91 +1,213 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import { useState, useEffect, useCallback } from "react";
|
||||
import Link from "next/link";
|
||||
import ThemedLayout from "@/components/layouts/ThemedLayout";
|
||||
import { getMerchantBtcAddress, isMerchantBtcConfigured } from "@/lib/merchantBtc";
|
||||
import { useAccount } from "@/contexts/AccountContext";
|
||||
|
||||
const PRIZES = [
|
||||
{ place: "1st", prize: "500 LUX Credits", sub: "Applied to your CyberLux handle." },
|
||||
{ place: "2nd", prize: "250 LUX Credits", sub: "Applied to your CyberLux handle." },
|
||||
{ place: "3rd", prize: "100 LUX Credits", sub: "Applied to your CyberLux handle." },
|
||||
{ place: "Runner-up ×5", prize: "Handler Pass", sub: "Digital access pass upgrade." },
|
||||
];
|
||||
|
||||
const DRAW_INTERVAL_MS = 7 * 24 * 60 * 60 * 1000; // 7 days in ms
|
||||
const DRAW_EPOCH = new Date("2026-04-14T00:00:00Z").getTime();
|
||||
|
||||
function getNextDraw() {
|
||||
const now = Date.now();
|
||||
const elapsed = now - DRAW_EPOCH;
|
||||
const cycles = Math.floor(elapsed / DRAW_INTERVAL_MS);
|
||||
return DRAW_EPOCH + (cycles + 1) * DRAW_INTERVAL_MS;
|
||||
}
|
||||
|
||||
function formatRemaining(ms: number) {
|
||||
if (ms <= 0) return "00:00:00";
|
||||
const totalSec = Math.floor(ms / 1000);
|
||||
const d = Math.floor(totalSec / 86400);
|
||||
const h = Math.floor((totalSec % 86400) / 3600);
|
||||
const m = Math.floor((totalSec % 3600) / 60);
|
||||
const s = totalSec % 60;
|
||||
if (d > 0) return `${d}d ${h.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}:${s.toString().padStart(2, "0")}`;
|
||||
return `${h.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}:${s.toString().padStart(2, "0")}`;
|
||||
}
|
||||
|
||||
const TICKET_PRICE_BTC = "0.0001";
|
||||
const TICKET_ENTRY_KEY = "cyberlux-raffle-entries-v1";
|
||||
|
||||
type Entry = { handle: string; txid: string; ts: string };
|
||||
|
||||
function loadEntries(): Entry[] {
|
||||
if (typeof window === "undefined") return [];
|
||||
try {
|
||||
return JSON.parse(localStorage.getItem(TICKET_ENTRY_KEY) ?? "[]") as Entry[];
|
||||
} catch { return []; }
|
||||
}
|
||||
|
||||
function saveEntries(e: Entry[]) {
|
||||
if (typeof window === "undefined") return;
|
||||
localStorage.setItem(TICKET_ENTRY_KEY, JSON.stringify(e));
|
||||
}
|
||||
|
||||
export default function RafflePage() {
|
||||
const [tickets, setTickets] = useState(1240);
|
||||
const [timeLeft, setTimeLeft] = useState(3600 * 24); // 24 hours
|
||||
const { user } = useAccount();
|
||||
const [remaining, setRemaining] = useState(0);
|
||||
const [entries, setEntries] = useState<Entry[]>([]);
|
||||
const [txid, setTxid] = useState("");
|
||||
const [status, setStatus] = useState<"idle" | "success" | "error">("idle");
|
||||
const [errMsg, setErrMsg] = useState("");
|
||||
const btcAddr = getMerchantBtcAddress();
|
||||
const btcReady = isMerchantBtcConfigured();
|
||||
|
||||
useEffect(() => {
|
||||
const timer = setInterval(() => {
|
||||
setTimeLeft(prev => (prev > 0 ? prev - 1 : 0));
|
||||
if (Math.random() > 0.9) setTickets(prev => prev + 1);
|
||||
}, 1000);
|
||||
return () => clearInterval(timer);
|
||||
setEntries(loadEntries());
|
||||
const tick = () => setRemaining(getNextDraw() - Date.now());
|
||||
tick();
|
||||
const id = setInterval(tick, 1000);
|
||||
return () => clearInterval(id);
|
||||
}, []);
|
||||
|
||||
const formatTime = (seconds: number) => {
|
||||
const h = Math.floor(seconds / 3600);
|
||||
const m = Math.floor((seconds % 3600) / 60);
|
||||
const s = seconds % 60;
|
||||
return `${h.toString().padStart(2, '0')}:${m.toString().padStart(2, '0')}:${s.toString().padStart(2, '0')}`;
|
||||
};
|
||||
const handleEnter = useCallback(
|
||||
(e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
const t = txid.trim();
|
||||
if (!t || t.length < 20) {
|
||||
setErrMsg("Enter a valid Bitcoin transaction ID.");
|
||||
setStatus("error");
|
||||
return;
|
||||
}
|
||||
if (entries.some((x) => x.txid === t)) {
|
||||
setErrMsg("This txid has already been submitted.");
|
||||
setStatus("error");
|
||||
return;
|
||||
}
|
||||
const entry: Entry = {
|
||||
handle: user?.username ?? "anon",
|
||||
txid: t,
|
||||
ts: new Date().toISOString(),
|
||||
};
|
||||
const updated = [...entries, entry];
|
||||
setEntries(updated);
|
||||
saveEntries(updated);
|
||||
setTxid("");
|
||||
setStatus("success");
|
||||
setTimeout(() => setStatus("idle"), 4000);
|
||||
},
|
||||
[txid, entries, user]
|
||||
);
|
||||
|
||||
const myEntries = user ? entries.filter((e) => e.handle === user.username) : [];
|
||||
|
||||
return (
|
||||
<ThemedLayout theme="terminal" title="Shadow Raffle">
|
||||
<div className="max-w-4xl mx-auto pt-12 text-white font-mono">
|
||||
<div className="border-4 border-white p-12 bg-[#000080] shadow-[10px_10px_0_rgba(255,255,255,0.2)]">
|
||||
<h1 className="text-5xl font-black mb-8 uppercase tracking-tighter text-center">Weekly Shadow Raffle</h1>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mb-12">
|
||||
<div className="border-2 border-white p-6 text-center">
|
||||
<div className="text-[10px] uppercase opacity-60 mb-2">Current Prize Pool</div>
|
||||
<div className="text-3xl font-bold">2.50 BTC</div>
|
||||
<div className="mx-auto max-w-4xl px-4 pt-12 pb-20 font-mono text-white">
|
||||
<div className="border-4 border-white bg-[#000080] p-10 shadow-[10px_10px_0_rgba(255,255,255,0.15)]">
|
||||
<div className="mb-2 text-center text-[10px] uppercase tracking-widest text-white/50">
|
||||
⚠ Prize pool is in LUX credits — not BTC. Entry fee covers onchain raffle infrastructure.
|
||||
</div>
|
||||
<h1 className="mb-10 text-center text-4xl font-black uppercase tracking-tighter">
|
||||
Weekly Shadow Raffle
|
||||
</h1>
|
||||
|
||||
<div className="mb-10 grid grid-cols-1 gap-6 sm:grid-cols-3">
|
||||
<div className="border-2 border-white p-5 text-center">
|
||||
<div className="mb-1 text-[10px] uppercase text-white/60">Next Draw</div>
|
||||
<div className="text-2xl font-black tabular-nums text-white">
|
||||
{formatRemaining(remaining)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="border-2 border-white p-6 text-center">
|
||||
<div className="text-[10px] uppercase opacity-60 mb-2">Tickets Sold</div>
|
||||
<div className="text-3xl font-bold">{tickets}</div>
|
||||
<div className="border-2 border-white p-5 text-center">
|
||||
<div className="mb-1 text-[10px] uppercase text-white/60">Ticket Price</div>
|
||||
<div className="text-2xl font-black">{TICKET_PRICE_BTC} BTC</div>
|
||||
</div>
|
||||
<div className="border-2 border-white p-6 text-center">
|
||||
<div className="text-[10px] uppercase opacity-60 mb-2">Time Remaining</div>
|
||||
<div className="text-3xl font-bold animate-pulse">{formatTime(timeLeft)}</div>
|
||||
<div className="border-2 border-white p-5 text-center">
|
||||
<div className="mb-1 text-[10px] uppercase text-white/60">Entries This Round</div>
|
||||
<div className="text-2xl font-black">{entries.length}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-8">
|
||||
<h2 className="text-2xl font-bold border-b-2 border-white pb-2 uppercase">Available Prizes</h2>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div className="p-6 bg-white/10 border border-white/20">
|
||||
<div className="text-xl font-bold mb-2">1st Place: 1.5 BTC</div>
|
||||
<p className="text-xs opacity-60">Direct transfer to your wallet. No questions asked.</p>
|
||||
</div>
|
||||
<div className="p-6 bg-white/10 border border-white/20">
|
||||
<div className="text-xl font-bold mb-2">2nd Place: 0.7 BTC</div>
|
||||
<p className="text-xs opacity-60">Direct transfer to your wallet.</p>
|
||||
</div>
|
||||
<div className="p-6 bg-white/10 border border-white/20">
|
||||
<div className="text-xl font-bold mb-2">3rd Place: 0.3 BTC</div>
|
||||
<p className="text-xs opacity-60">Direct transfer to your wallet.</p>
|
||||
</div>
|
||||
<div className="p-6 bg-white/10 border border-white/20">
|
||||
<div className="text-xl font-bold mb-2">Runner Up: Premium Membership</div>
|
||||
<p className="text-xs opacity-60">Lifetime access to the Inner Circle.</p>
|
||||
</div>
|
||||
<div className="mb-10">
|
||||
<h2 className="mb-4 border-b-2 border-white pb-2 text-xl font-black uppercase">Prize Breakdown</h2>
|
||||
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
|
||||
{PRIZES.map((p) => (
|
||||
<div key={p.place} className="border border-white/20 bg-white/5 p-5">
|
||||
<div className="text-lg font-black">{p.place}: {p.prize}</div>
|
||||
<p className="mt-1 text-xs text-white/60">{p.sub}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-12 p-8 border-4 border-dashed border-white/40 text-center">
|
||||
<h3 className="text-xl font-bold mb-4 uppercase">Buy Your Ticket</h3>
|
||||
<p className="text-xs mb-6">
|
||||
Send 0.001 BTC to the address below. Your ticket will be automatically
|
||||
registered upon 1 confirmation.
|
||||
<div className="border-4 border-dashed border-white/40 p-8">
|
||||
<h3 className="mb-2 text-lg font-black uppercase">Enter Your Ticket</h3>
|
||||
<p className="mb-4 text-xs text-white/70 leading-relaxed">
|
||||
Send exactly {TICKET_PRICE_BTC} BTC to the address below. After at least 1 confirmation, paste your
|
||||
transaction ID here. Your handle is registered as an entrant. Draw happens at the countdown above.
|
||||
</p>
|
||||
<div className="bg-black text-[#00ff41] p-4 font-bold break-all mb-6 border-2 border-white">
|
||||
0x594f1Cf2A72b3f785fcB6ABdFa73B6D76FcC22b8
|
||||
</div>
|
||||
<div className="flex items-center justify-center gap-4 opacity-50">
|
||||
<div className="w-10 h-10 border-2 border-white flex items-center justify-center font-bold">E</div>
|
||||
<div className="text-[8px] uppercase text-left">
|
||||
Escrow Assured<br />by ShadowGuard™
|
||||
|
||||
{btcReady ? (
|
||||
<div className="mb-5 break-all border-2 border-white bg-black px-4 py-3 font-mono text-xs text-[#00ff41]">
|
||||
{btcAddr}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="mb-5 border-2 border-amber-500/50 bg-black px-4 py-3 text-xs text-amber-300">
|
||||
Merchant address not configured. Set NEXT_PUBLIC_MERCHANT_BTC_ADDRESS in .env.local.
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleEnter} className="flex flex-col gap-4 sm:flex-row">
|
||||
<input
|
||||
type="text"
|
||||
value={txid}
|
||||
onChange={(e) => setTxid(e.target.value)}
|
||||
placeholder="Bitcoin transaction ID (64 hex chars)…"
|
||||
className="flex-1 border-2 border-white bg-black px-4 py-3 text-sm text-white focus:border-[#00ff41] focus:outline-none"
|
||||
maxLength={64}
|
||||
/>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={!btcReady}
|
||||
className="border-2 border-white bg-white px-6 py-3 font-black uppercase text-black transition-all hover:bg-[#00ff41] disabled:opacity-40"
|
||||
>
|
||||
Register Entry
|
||||
</button>
|
||||
</form>
|
||||
|
||||
{status === "success" && (
|
||||
<p className="mt-3 text-sm text-[#00ff41]">✓ Entry registered for @{user?.username ?? "anon"}. Good luck.</p>
|
||||
)}
|
||||
{status === "error" && (
|
||||
<p className="mt-3 text-sm text-red-400">{errMsg}</p>
|
||||
)}
|
||||
|
||||
{!user && (
|
||||
<p className="mt-3 text-xs text-white/50">
|
||||
<Link href="/sign-in?next=/raffle" className="text-[#00ff41] underline">Sign in</Link>{" "}
|
||||
to attach entries to your handle.
|
||||
</p>
|
||||
)}
|
||||
|
||||
{myEntries.length > 0 && (
|
||||
<div className="mt-6 border border-white/20 p-4">
|
||||
<div className="mb-2 text-[10px] uppercase text-white/60">Your entries this round</div>
|
||||
{myEntries.map((e) => (
|
||||
<div key={e.txid} className="text-xs text-[#00ff41]/70 truncate">
|
||||
{e.txid.slice(0, 12)}…{e.txid.slice(-8)} · {new Date(e.ts).toLocaleDateString()}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-12 text-center text-[10px] opacity-40 uppercase tracking-widest leading-relaxed">
|
||||
* Winners are selected via the Shadow Protocol's provably fair algorithm.
|
||||
Results are final. Good luck.
|
||||
<div className="mt-6 text-center text-[10px] text-white/30 leading-relaxed">
|
||||
Draw is via deterministic hash of the winning block header at the draw timestamp. Results posted in{" "}
|
||||
<Link href="/forum" className="text-white/50 hover:text-white underline">
|
||||
/forum
|
||||
</Link>
|
||||
. Prizes are LUX credits — no fiat or BTC payout. Entry fees are non-refundable.
|
||||
</div>
|
||||
</div>
|
||||
</ThemedLayout>
|
||||
|
||||
Reference in New Issue
Block a user