// ===== CENA 5 (28–37s) — PREGÃO AO VIVO · CENA 6 (37–42s) — VITÓRIA ===== // ---------- CENA 5 ---------- const BIDDERS = { infra: { id: "infra", name: "InfraSys", cnpj: "32.184.991/0001-04", color: "#8693B5", start: 320000 }, souza: { id: "souza", name: "Souza Tech", cnpj: "11.482.770/0001-29", color: "#A6B2D4", start: 318500 }, bytenet: { id: "bytenet", name: "Bytenet", cnpj: "08.290.341/0001-73", color: "#6C7AA1", start: 316500 }, pleita: { id: "pleita", name: "Souza Engenharia (Pleita)", cnpj: "32.948.117/0001-50", color: C.lime, start: 317000, isUs: true }, }; const PREGAO_EVENTS = [ { t: 0.4, who: "infra", price: 320000 }, { t: 0.9, who: "souza", price: 318500 }, { t: 1.4, who: "pleita", price: 317000 }, { t: 1.9, who: "bytenet", price: 316500 }, { t: 2.4, who: "souza", price: 315000 }, { t: 2.9, who: "pleita", price: 314000 }, { t: 3.4, who: "infra", action: "drop" }, { t: 3.9, who: "bytenet", price: 313500 }, { t: 4.4, who: "pleita", price: 312800 }, { t: 4.9, who: "bytenet", action: "drop" }, { t: 5.4, who: "souza", price: 312500 }, { t: 5.9, who: "pleita", price: 312000 }, { t: 6.4, who: "souza", action: "drop" }, { t: 7.0, who: "pleita", action: "win" }, ]; const fmtPrice = (n) => "R$ " + n.toLocaleString("pt-BR"); function SceneAuction() { const { localTime, duration } = useSprite(); const exitT = Math.max(0, duration - 0.5); const exitOpacity = localTime > exitT ? 1 - (localTime - exitT) / 0.5 : 1; // Compute bidder state at localTime const fired = PREGAO_EVENTS.filter((e) => e.t <= localTime); const lastFireT = fired.length ? fired[fired.length - 1].t : 0; const state = {}; Object.keys(BIDDERS).forEach((k) => state[k] = { id: k, price: BIDDERS[k].start, history: [], status: "active", lastUpdate: -10 }); fired.forEach((e) => { if (e.action === "drop") { state[e.who].status = "dropped"; state[e.who].lastUpdate = e.t; } else if (e.action === "win") { state[e.who].status = "winner"; state[e.who].lastUpdate = e.t; } else if (e.price != null) { state[e.who].price = e.price; state[e.who].history.push({ t: e.t, p: e.price }); state[e.who].lastUpdate = e.t; } }); // Sorted ranking: active first by lowest price, then dropped const ranked = Object.values(state).sort((a, b) => { const aActive = a.status !== "dropped"; const bActive = b.status !== "dropped"; if (aActive !== bActive) return bActive - aActive; return a.price - b.price; }); // Tick clock: starts at 14:32:18 + localTime*4 const realSec = 14 * 3600 + 32 * 60 + 18 + Math.floor(localTime * 4.2); const hh = String(Math.floor(realSec / 3600)).padStart(2, "0"); const mm = String(Math.floor((realSec % 3600) / 60)).padStart(2, "0"); const ss = String(realSec % 60).padStart(2, "0"); // Chart math const CHART_X = 96; const CHART_Y = 280; const CHART_W = 940; const CHART_H = 520; const T_MIN = 0; const T_MAX = 7.5; const P_MIN = 311000; const P_MAX = 322000; const xOf = (t) => CHART_X + 60 + ((Math.min(t, localTime) - T_MIN) / (T_MAX - T_MIN)) * (CHART_W - 60); const yOf = (p) => CHART_Y + 60 + ((P_MAX - p) / (P_MAX - P_MIN)) * (CHART_H - 100); // Build SVG path for each bidder const buildPath = (history, start) => { if (!history.length) return ""; const pts = [{ t: 0, p: start }, ...history]; // Step path (price holds until next bid) let d = `M ${xOf(pts[0].t)} ${yOf(pts[0].p)}`; for (let i = 1; i < pts.length; i++) { d += ` L ${xOf(pts[i].t)} ${yOf(pts[i - 1].p)}`; d += ` L ${xOf(pts[i].t)} ${yOf(pts[i].p)}`; } // Extend to current time const last = pts[pts.length - 1]; const endT = state[history[0] ? Object.keys(state).find((k) => state[k].history === history) : null]?.status === "dropped" ? state[Object.keys(state).find((k) => state[k].history === history)].lastUpdate : Math.min(localTime, T_MAX); d += ` L ${xOf(endT)} ${yOf(last.p)}`; return d; }; return (
{/* Grid lines decorative */}
{/* Header */}
Pregão ao vivo
Pregão Eletrônico nº 047/2026.
Pref. Campinas · Equipamentos de TI · valor de referência R$ 1,2M
relógio do sistema
{hh}:{mm}:{ss}
fase: lances aleatórios · prorrogação automática
{/* SVG CHART */} {/* Y-axis labels */} {[312000, 315000, 318000, 321000].map((p) => ( R$ {(p / 1000).toFixed(0)}k ))} {/* Time axis */} {[1, 3, 5, 7].map((t) => ( +{t}s ))} {/* Bidder lines + endpoint dots */} {Object.keys(BIDDERS).map((k) => { const b = BIDDERS[k]; const s = state[k]; if (!s.history.length) return null; // Build step path const pts = [...s.history]; let d = `M ${xOf(pts[0].t)} ${yOf(pts[0].p)}`; for (let i = 1; i < pts.length; i++) { d += ` L ${xOf(pts[i].t)} ${yOf(pts[i - 1].p)}`; d += ` L ${xOf(pts[i].t)} ${yOf(pts[i].p)}`; } // Extend to current playhead OR drop time const endT = s.status === "dropped" ? s.lastUpdate : Math.min(localTime, T_MAX); d += ` L ${xOf(endT)} ${yOf(s.price)}`; const isUs = b.isUs; const lastPt = pts[pts.length - 1]; return ( {/* Bid points */} {pts.map((p, i) => ( ))} {/* Current endpoint pulse for active */} {s.status === "active" && ( )} {/* Inline label at endpoint */} {s.status !== "dropped" && ( {isUs ? "Pleita" : b.name.split(" ")[0]} )} ); })} {/* Right ranking panel */}
Ranking · atualiza a cada lance
{ranked.map((s, rank) => { const b = BIDDERS[s.id]; const isLeader = rank === 0 && s.status !== "dropped"; const justUpdated = localTime - s.lastUpdate < 0.4 && s.lastUpdate > 0; const droppedTime = s.status === "dropped" ? localTime - s.lastUpdate : 0; return (
{s.status === "dropped" ? "—" : (rank + 1) + "º"}
{b.name} {b.isUs && você}
{b.cnpj}{s.status === "dropped" && " · desistiu"}
{fmtPrice(s.price)}
{justUpdated && s.status === "active" && (
novo lance ↓
)}
); })}
{/* Strategy note */}
⚡
Robô de lances · estratégia Equilibrada
cobre lances até 5% acima do segundo · piso R$ 312.000
{/* Bottom event log strip */}
últimos lances ›
{fired.slice(-5).map((e, i, arr) => { const b = BIDDERS[e.who]; const isWin = e.action === "win"; const isDrop = e.action === "drop"; const age = localTime - e.t; return (
{b.name.split(" ")[0]} {isWin ? "VENCEDORA" : isDrop ? "desistiu" : fmtPrice(e.price)}
); })}
); } // ---------- CENA 6 — VITÓRIA ---------- // Pre-generate confetti pieces (stable across renders) const CONFETTI = Array.from({ length: 80 }).map((_, i) => { const r = (n) => (Math.sin(i * 9301 + n * 49297) * 233280) % 1; const x = Math.abs(r(1)) * 1920; const delay = Math.abs(r(2)) * 2.0; const dur = 2.2 + Math.abs(r(3)) * 1.5; const drift = (r(4) - 0.5) * 200; const rotSpd = (r(5) - 0.5) * 720; const size = 6 + Math.abs(r(6)) * 10; const palette = [C.lime, C.lime2, C.paper, "#F5F0DE", C.lime, "#7DC95B"]; const color = palette[Math.floor(Math.abs(r(7)) * palette.length)]; const square = Math.abs(r(8)) > 0.5; return { x, delay, dur, drift, rotSpd, size, color, square }; }); function Confetti({ localTime }) { return (
{CONFETTI.map((c, i) => { const t = localTime - c.delay; if (t < 0 || t > c.dur + 2) return null; const p = t / c.dur; const y = -40 + Easing.easeInQuad(Math.min(1, p)) * (1080 + 80); const x = c.x + c.drift * Math.sin(t * 2); const rot = t * c.rotSpd; const opacity = p < 0.1 ? p * 10 : p > 0.9 ? Math.max(0, 1 - (p - 0.9) * 10) : 1; return (
); })}
); } function SceneVictory() { const { localTime, duration } = useSprite(); // Big VENCEU text: enters with overshoot const venceuT = Math.min(1, localTime / 0.6); const venceuScale = Easing.easeOutBack(venceuT); const venceuOpacity = venceuT; // Bg flash white at t=0 const flash = localTime < 0.3 ? 1 - localTime / 0.3 : 0; // Stats appear at 1.0s const statsT = Math.max(0, Math.min(1, (localTime - 1.0) / 0.6)); const statsOpacity = statsT; const statsY = (1 - Easing.easeOutCubic(statsT)) * 30; // Wordmark appears at 2.5s const wmT = Math.max(0, Math.min(1, (localTime - 2.4) / 0.7)); return (
{/* Flash */}
{/* Grain */}
{/* Eyebrow */}
🏆 Pregão arrematado · adjudicação em 14 dias
{/* VENCEU. */}

VENCEU.

{/* Stats row */}
{[ { l: "Valor adjudicado", v: "R$ 312.000", c: C.lime }, { l: "Economia vs. preço de referência", v: "−74%", c: C.paper }, { l: "Próxima ação", v: "Assinar contrato", c: C.paper, sub: "prazo de 14 dias úteis" }, ].map((s, i) => (
{s.l}
{s.v}
{s.sub &&
{s.sub}
}
))}
{/* Tagline + wordmark · empilhado bem abaixo das stats, deixando espaço pro caption */}
A Pleita pleiteia por você.
pleita.com.br
); } Object.assign(window, { SceneAuction, SceneVictory });