// HUD for the typing duel. The fable scroll is the offense readout; two base // bars show the tug-of-war; a 30s timer drives the urgency. const ALES = require("lib/data/ales.json"); const { renderDrinkAnim } = require("lib/ui-drink-anim.js"); const { renderTypeCapture, GRAB_FOCUS } = require("lib/ui-type-capture.js"); const ALE_BY_ID = {}; (ALES.ales || []).forEach(function (a) { ALE_BY_ID[a.id] = a; }); // The winner chugging — wrapped so a missing sprite never kills the result screen. function safeDrink(opts) { try { return renderDrinkAnim(opts); } catch (e) { return '

'; } } // Mirror of the scribe difficulties (typing-spawner.js owns the live numbers). const MODE_CARDS = [ { id: "easy", label: "Easy", emoji: "🪶", color: "oklch(0.78 0.16 145)", line: "28 wpm", blurb: "A drowsy scribe. Read at your leisure." }, { id: "medium", label: "Medium", emoji: "🖋️", color: "oklch(0.84 0.16 78)", line: "52 wpm", blurb: "A steady hand. Keep pace or fall behind." }, { id: "hard", label: "Hard", emoji: "⚡", color: "oklch(0.68 0.22 28)", line: "84 wpm", blurb: "Ink like lightning. No pauses, no pity." }, { id: "insane", label: "Insane", emoji: "🌀", color: "oklch(0.55 0.28 320)", line: "120 wpm", blurb: "A possessed quill — faster than thought." }, { id: "adventure", label: "Adventure", emoji: "🗺️", color: "oklch(0.8 0.16 290)", line: "28 → 52 → 84", blurb: "The full gauntlet — climb all three scribes, one per round." }, ]; const MODE_BY_ID = {}; MODE_CARDS.forEach(function (m) { MODE_BY_ID[m.id] = m; }); // ---------- HOW TO PLAY overlay (opened from the title menu) ---------- function renderHowTo(tab) { const active = tab === "ales" ? "ales" : "instructions"; const tabBtn = function (id, label, on) { return ''; }; const phaseCard = function (emoji, tag, tagColor, title, body) { return '

' + '

' + emoji + '' + '

' + tag + '

' + '

' + title + '

' + '

' + body + '

' + '

'; }; let body; if (active === "instructions") { const attack = phaseCard("⚔️", "phase one", "oklch(0.82 0.16 78)", "Attack", "Type the fable scroll as fast as you can. Every word you finish summons a monster soldier that marches across the field toward the enemy keep. Longer words conjure bigger beasts — slimes for short words, ogres for the long ones. Race the clock: more words, more army."); const defense = phaseCard("🛡️", "phase two", "oklch(0.7 0.16 230)", "Defense", "Enemy raiders charge your wall, each carrying a word. Type a raider's word to lock and strike it before it breaches. The closest matching raider is targeted first. Keep them off the wall — every breach is damage taken, and least damage taken wins the round."); body = '

Each round runs in two phases. Your typing speed is the whole fight.

' + '

' + attack + defense + '

'; } else { const aleRows = (ALES.ales || []).map(function (a) { return '

' + '' + a.emoji + '' + '

' + a.name + '

' + '

' + a.debuff + '

' + '

'; }).join(""); body = '

Win a round and pour your rival a drink — a curse that warps their next round.

' + '

' + aleRows + '

'; } return '' + '

' + '

drunk fighting

' + '

How to Play

' + '

' + tabBtn("instructions", "⚔️ Instructions", active === "instructions") + tabBtn("ales", "🍺 Ales", active === "ales") + '

' + body + '' + '

' + '

'; } // Dyslexic Daiquiri — deterministic per-word jumble (stable across frames). function scrambleWord(w) { const arr = w.split(""); let seed = 2166136261; for (let i = 0; i < w.length; i++) seed = (seed ^ w.charCodeAt(i)) * 16777619 >>> 0; for (let i = arr.length - 1; i > 0; i--) { seed = (seed * 1664525 + 1013904223) >>> 0; const j = seed % (i + 1); const t = arr[i]; arr[i] = arr[j]; arr[j] = t; } return arr.join(""); } function bar({ pct, color, h }) { return '

' + '

'; } function renderFable(words, idx, typed, awaitingSpace, scramble, wiggle) { const start = Math.max(0, idx - 5); const end = Math.min(words.length, idx + 26); let html = ""; // Moonshine — every letter rides its own little stagger of sway, so the whole // line lurches like the floor of a tavern. Negative delays desync each char. let wk = 0; function seg(str, style) { if (!wiggle || !str) return '' + str + ''; let out = ""; for (let k = 0; k < str.length; k++) { const d = (-((wk++ * 0.11) % 1.35)).toFixed(2); out += '' + str[k] + ''; } return out; } for (let i = start; i < end; i++) { // Daiquiri swims the page AHEAD of you — words you've passed and the one // you're on stay true, the rest is a jumble until you reach it. const w = (scramble && i > idx) ? scrambleWord(words[i]) : words[i]; if (i < idx) { html += seg(w, "color: oklch(0.5 0.03 70); opacity:0.55;") + ' '; } else if (i === idx) { const t = w.slice(0, typed.length); // keep real case — capitals matter const r = w.slice(typed.length); html += '' + seg(t, "color: oklch(0.92 0.2 75); text-shadow: 0 0 10px rgba(252,180,80,0.7);") + seg(r, "color: oklch(0.88 0.05 80);") + ''; // No auto-space: show a little spacebar key as the cue, not a word. html += awaitingSpace ? ' ' : ' '; } else { html += seg(w, "color: oklch(0.72 0.04 78);") + ' '; } } return (wiggle ? '' : '') + html; } // The curse you drank warps YOUR screen — shared by the solo game and the duel. function aleVisual(ale, el, lp) { if (ale === "snoozka") { // Heavy drowsy eyelids — they NEVER fully lift (always a heavy lid hanging). // Roughly every ten seconds the lids slooowly droop. Some droops go all the way // shut (hold in the black, then drag back open); others are a NEAR-MISS — they // almost close, then you FIGHT it and jolt your eyes wide before settling back. // Eased slides, not slams, so it feels like losing to sleep. Solid opaque lids. const P = 10.0, BASE = 0.16; const t = el % P; const cycle = Math.floor(el / P); const ease = function (c) { return c * c * (3 - 2 * c); }; // smoothstep // Deterministic per-cycle roll so each droop is consistent across frames. const r = (function (n) { const x = Math.sin(n * 12.9898) * 43758.5453; return x - Math.floor(x); })(cycle); const fight = r < 0.42; // this droop is a near-miss let cov; if (fight) { const CL = 1.7, PEAK = 0.84, JOLT = 0.5, SETTLE = 0.95; if (t < CL) cov = BASE + (PEAK - BASE) * ease(t / CL); // droop to almost-shut else if (t < CL + JOLT) cov = PEAK - (PEAK - 0.02) * ease((t - CL) / JOLT); // FIGHT it wide open else if (t < CL + JOLT + SETTLE) cov = 0.02 + (BASE - 0.02) * ease((t - CL - JOLT) / SETTLE); // settle back heavy else cov = BASE + 0.025 * Math.sin(el * 1.1); } else { const CLOSE = 1.6, HOLD = 0.5, OPEN = 1.3; if (t < CLOSE) cov = BASE + (1 - BASE) * ease(t / CLOSE); // slow drowsy slide shut else if (t < CLOSE + HOLD) cov = 1; // shut tight — full black else if (t < CLOSE + HOLD + OPEN) cov = 1 - (1 - BASE) * ease((t - CLOSE - HOLD) / OPEN); // slow drag open else cov = BASE + 0.025 * Math.sin(el * 1.1); // heavy lids, breathing } const h = (cov * 54).toFixed(1); const lid = 'rgb(2,3,10)'; return '

' + '

'; } else if (ale === "moonshine") { const o = (0.22 + 0.12 * Math.sin(el * 1.6)).toFixed(3); const cx = (50 + Math.sin(el * 0.9) * 9).toFixed(1); const cy = (50 + Math.cos(el * 0.7) * 7).toFixed(1); return '

'; } else if (ale === "ghostpepper") { const o = (0.2 + 0.12 * Math.abs(Math.sin(el * 5))).toFixed(3); return '

'; } else if (ale === "redmorse") { // Blood-rush throbbing in time with the gallop (2.3 strides/sec, matches camera.js). const beat = Math.abs(Math.sin(el * 2.3 * Math.PI)); const o = (0.1 + 0.28 * beat * beat); const oc = (o * 0.45).toFixed(3); const oe = o.toFixed(3); const ov = (o * 0.85).toFixed(3); return '

'; } else if (ale === "tequilag") { return '

🥃 hangover — your keys are crossed: A↔E L↔Q

'; } else if (ale === "ginny") { const pr = (lp && lp.ginnyPair && lp.ginnyPair.length === 2) ? lp.ginnyPair : null; const pair = pr ? (pr[0].toUpperCase() + '↔' + pr[1].toUpperCase()) : '? ↔ ?'; return '

🧞 a genie crossed two keys: ' + pair + '

'; } return ''; } export default function (localPlayer, world) { // The capture input rides above everything, every frame, so it never loses focus // and every real character you press reaches the typing brain. let cap = ''; try { cap = renderTypeCapture(); } catch (e) { cap = ''; } let body = ''; try { body = renderBody(localPlayer, world); } catch (e) { body = ''; } // RED MORSE jolts ONLY the gameplay HUD. The full-screen curse warps (snoozka // eyelids, vignettes) and the ale-card stack render OUTSIDE this // wrapper, locked to the viewport — so closing eyes fully cover the screen and // nothing tears at the edges when the gallop kicks. The capture input also // stays outside so typing focus never trembles. let shake = ''; let curseField = ''; let aleStack = ''; try { const mgr = world.query({ tags: ["typing-spawner"] })[0]; const ms = mgr ? mgr.state : null; if (ms) { const lp = localPlayer && localPlayer.state ? localPlayer.state : {}; const isPvp = ms.mode === "pvp"; const sideR = lp.duelSide || "south"; const mine = isPvp ? ((sideR === "north" ? ms.northAles : ms.southAles) || []) : (ms.playerAles || []); const enemyAle = isPvp ? [] : (ms.enemyAles || []); const testOn = !!ms.aleTest; const inPlay = testOn || (isPvp ? (ms.phase === "pvp" && (ms.pvpPhase === "attack" || ms.pvpPhase === "defense")) : (ms.phase === "attack" || ms.phase === "defense")); const el = testOn ? (ms.testClock || 0) : (ms.elapsed || 0); if (inPlay) { // Full-screen curse warps — viewport-locked, never shaken. mine.forEach(function (id) { curseField += aleVisual(id, el, lp); }); // Lower-left: a stack of ale cards so you always know your active curses. let cards = ''; mine.forEach(function (id) { const am = ALE_BY_ID[id]; if (!am) return; const c = am.color; // Key-swap curses show their live crossed keys right on the card. let sub = 'cursed'; let swap = ''; if (id === 'tequilag') swap = 'A\u2194E L\u2194Q'; else if (id === 'ginny') { const pr = (lp && lp.ginnyPair && lp.ginnyPair.length === 2) ? lp.ginnyPair : null; swap = pr ? (pr[0].toUpperCase() + '\u2194' + pr[1].toUpperCase()) : '? \u2194 ?'; } if (swap) sub = '' + swap + ''; cards += '

' + '' + (am.emoji || "\ud83c\udf7a") + '' + '

' + '' + am.name + '' + sub + '

' + '

'; }); if (enemyAle.length) { cards += '

' + '\ud83d\ude35' + '

' + 'Enemy Drunk' + (enemyAle.length > 1 ? ' \u00d7' + enemyAle.length : '') + '' + 'they\'re stumbling' + '

' + '

'; } if (cards) { aleStack = '

' + cards + '

curses

' + '

'; } } // Only jolt during live play — the ale-pick screen must stay readable. if (inPlay && mine.indexOf("redmorse") >= 0) { const ph = el * 1.55 * Math.PI * 2; const beat = Math.sin(ph); const kick = Math.sign(beat) * Math.pow(Math.abs(beat), 0.55); const ty = (kick * 9.1 + Math.sin(ph * 2) * 2.45).toFixed(2); const tx = (Math.sin(ph * 0.5) * 4.55 + Math.sin(el * 37) * 0.98).toFixed(2); const rot = (Math.sin(ph * 0.5) * 0.49).toFixed(3); shake = 'position: fixed; inset: 0; pointer-events: none; transform: translate(' + tx + 'px,' + ty + 'px) rotate(' + rot + 'deg); will-change: transform;'; } } } catch (e) { /* a bad read must never blank the HUD */ } return cap + (shake ? '

' + body + '

' : body) + curseField + aleStack; } function renderBody(localPlayer, world) { const mgr = world.query({ tags: ["typing-spawner"] })[0]; const s = mgr?.state ?? {}; const phase = s.phase ?? "intro"; const words = s.fableWords ?? []; const idx = localPlayer.state.fableIndex ?? 0; const typed = localPlayer.state.fableTyped ?? ""; const wordsTyped = localPlayer.state.wordsTyped ?? 0; const round = s.round ?? 1; const MAX_ROUNDS = 5; // up to five rounds const WINS_NEEDED = 3; // first to three takes the duel const playerDmg = Math.round(s.playerDamage ?? 0); // damage YOU took this round const enemyDmg = Math.round(s.enemyDamage ?? 0); // damage the ENEMY took const roundsWonPlayer = s.roundsWonPlayer ?? 0; const roundsWonEnemy = s.roundsWonEnemy ?? 0; const allyCount = s.allyCount ?? 0; const foeCount = s.foeCount ?? 0; // Round pips — filled for rounds already claimed by each side. function pips(won, color) { let h = ''; for (let i = 0; i < WINS_NEEDED; i++) { const on = i < won; h += ''; } return h; } // ---------- PVP LOBBY: waiting for a live opponent ---------- if (localPlayer.state.pvpSearching) { const lc = s.lobbyClock ?? 0; const since = localPlayer.state.pvpSince ?? lc; const waited = Math.max(0, Math.floor(lc - since)); const matched = !!localPlayer.state.pvpMatched; const queue = world.query({ tags: ["player"] }).filter(function (p) { return p.state && p.state.pvpSearching; }).length; const dots = ".".repeat(1 + (Math.floor(lc * 2) % 3)); const pulse = 0.5 + 0.5 * Math.sin(lc * 3); return '' + '

' + '

' + (matched ? (function () { const fa = localPlayer.state.pvpFoundAt ?? lc; const left = Math.max(0, Math.ceil(3 - (lc - fa))); const acc = !!localPlayer.state.pvpAccepted; return '

⚔️

' + '

opponent found

' + '

' + (localPlayer.state.pvpOpponent || "a rival scribe") + ' takes the opposite wall

' + '

' + left + '

' + (acc ? '

accepted — awaiting your rival…

' : ''); })() : '

⚔️

' + '

searching for an opponent' + dots + '

' + '

waited ' + waited + 's · ' + queue + ' in the queue

') + '' + '

' + '

'; } // ---------- TITLE / MODE SELECT ---------- if (phase === "menu") { if (localPlayer.state.showHowto) return renderHowTo(localPlayer.state.howtoTab); const picked = s.menuChoice; const cards = MODE_CARDS.map(function (m, i) { const on = picked === m.id; const wide = m.id === "adventure" ? "width:760px;" : "width:236px;"; return ''; }); const trio = '

' + cards.slice(0, 3).join("") + '

'; const adv = '

' + cards[3] + '

'; return '' + '

' + '

a typing duel — type or perish

' + '

Drunk Typing

' + '

choose your scribe

' + '

' + (picked ? 'unrolling the parchment…' : 'their typing speed is the whole fight') + '

' + trio + adv + '' + '' + '

' + '

'; } // ---------- INTRO ---------- if (phase === "intro" || phase === "reset") { const t = Math.max(0, Math.ceil(s.timer ?? 4)); return '' + '

' + '

the fable

' + '

' + (s.fableTitle ?? "") + '

' + '

' + (s.fableText ?? "") + '

' + '

type it fast to summon your army

' + '

' + (t > 0 ? t : "GO!") + '

' + '

'; } // ---------- PVP DUEL: best-of-three, attack then defense, against a live rival ---------- if (phase === "pvp") { const side = (localPlayer.state && localPlayer.state.duelSide) ? localPlayer.state.duelSide : "south"; const pp = s.pvpPhase ?? "intro"; const round = s.pvpRound ?? 1; const wonS = s.wonSouth ?? 0, wonN = s.wonNorth ?? 0; const myWon = side === "south" ? wonS : wonN; const theirWon = side === "south" ? wonN : wonS; const dmgSouth = s.dmgSouth ?? 0, dmgNorth = s.dmgNorth ?? 0; const taken = side === "south" ? dmgSouth : dmgNorth; // breaches on YOUR wall (lower = winning) const dealt = side === "south" ? dmgNorth : dmgSouth; // breaches YOU landed on theirs // Tug-of-war damage bar (bottom) — your half is what you've battered THEIR wall // for, their half is what they've battered yours. Least damage taken wins, so // the bigger your green half the better. Mirrors the solo HUD's bottom bar. const pvpTug = (function () { // Colour each half by its actual TEAM — south fields blue cubes, north red. // So the bar speaks the same language as the battlefield: your half wears your // team colour, the rival's half wears theirs, whichever side you're on. const BLUE = { label: "oklch(0.72 0.16 262)", num: "oklch(0.82 0.18 262)", grad: "linear-gradient(90deg, oklch(0.46 0.17 262), oklch(0.64 0.2 260))", glow: "oklch(0.82 0.2 262 / 0.45)" }; const RED = { label: "oklch(0.72 0.18 28)", num: "oklch(0.8 0.2 28)", grad: "linear-gradient(90deg, oklch(0.66 0.22 32), oklch(0.5 0.2 26))", glow: "oklch(0.84 0.22 32 / 0.45)" }; const me = side === "south" ? BLUE : RED; // your team const them = side === "south" ? RED : BLUE; // the rival's team const youDealt = dealt, foeDealt = taken; const total = youDealt + foeDealt; const youShare = total > 0 ? (youDealt / total) * 100 : 50; const foeShare = 100 - youShare; const seam = youShare.toFixed(1); return '

' + '

you dealt' + youDealt + '

' + '

' + foeDealt + 'rival dealt

' + '

least wall damage wins the round

' + '

'; })(); const pip = function (filled, col) { return ''; }; const roundsBar = function () { let me = '', them = ''; for (let i = 0; i < 3; i++) me += pip(i < myWon, 'oklch(0.82 0.18 145)'); for (let i = 0; i < 3; i++) them += pip(i < theirWon, 'oklch(0.78 0.2 28)'); return '

' + '

you' + me + '

' + '

round ' + round + ' / 5

' + '

' + them + 'rival

' + '

'; }; if (pp === "intro") { const t = Math.max(0, Math.ceil(s.pvpTimer ?? 4)); return '' + '

' + '

live duel — a real rival · first to three wins

' + '

' + roundsBar() + '

' + '

ATTACK to mass your army at their gate, then DEFEND your wall.

' + '

' + (t > 0 ? t : "GO!") + '

' + '

'; } if (pp === "switch") { const t = Math.max(0, Math.ceil(s.pvpTimer ?? 3)); return '' + '

' + '

their army surges

' + '

' + (t > 0 ? t : "!") + '

' + '

type the raiders down

' + '

Turn enemies into allies by typing the text above them

' + '

'; } if (pp === "tally") { const won = s.lastRound ?? "draw"; const youHeld = won === side; const head = won === "draw" ? "ROUND DRAWN" : youHeld ? "YOU HELD THE WALL" : "YOUR WALL FELL"; const col = won === "draw" ? "oklch(0.8 0.1 80)" : youHeld ? "oklch(0.82 0.18 145)" : "oklch(0.72 0.22 28)"; return '' + '

' + '

' + head + '

' + '

your wall took ' + taken + ' · theirs took ' + dealt + '

' + '

' + roundsBar() + '

' + '

'; } if (pp === "result") { const win = s.pvpWinner ?? "draw"; const youWon = win === side; const head = win === "draw" ? "DRAW" : youWon ? "VICTORY — THE DUEL IS YOURS" : "THE DUEL IS LOST"; const col = win === "draw" ? "oklch(0.85 0.06 80)" : youWon ? "oklch(0.82 0.18 145)" : "oklch(0.72 0.22 28)"; return '' + '

' + '

' + head + '

' + (win === "draw" ? '

the duel ends even

' : '') + '

' + roundsBar() + '

' + '

'; } const t = Math.max(0, Math.ceil(s.pvpTimer ?? 0)); // ---- ALE: the round winner drinks; the loser watches them sweat ---- if (pp === "pvp-ale") { const iWon = s.aleSide === side; if (!iWon) { const opts = s.aleOptions ?? []; const cards = opts.map(function (a, i) { return ''; }).join(""); return '' + '

' + '

your wall fell — round ' + round + '

' + '

pour their poison

' + '

losing has one mercy — choose the curse the WINNER drinks next round

' + '

decide in ' + t + 's — or fate pours it

' + '

' + cards + '

' + '

'; } return '' + '

' + '

🍺

' + '

you won — your rival is pouring your poison

' + '

victory has a price — the curse they choose rides into round ' + (round + 1) + '

' + '

' + t + '

' + '

'; } // ---- ALE RESULT: the cup is raised before the next round ---- if (pp === "pvp-ale-result") { const a = s.aleToast; const iDrank = s.aleSide === side; if (!a) return '

'; // The WINNER (aleSide) chugs — south keep is azure, north keep is crimson. const drink = safeDrink({ who: s.aleSide === "north" ? "crimson" : "azure", color: a.color }); return '' + '

' + '

' + (iDrank ? "YOU DRINK" : "YOUR RIVAL DRINKS") + '

' + drink + '

' + (a.emoji || "🍺") + ' ' + a.name + '

' + '

' + a.debuff + '

' + '

' + (iDrank ? "you carry this curse" : "they\'ll stumble") + ' through round ' + (round + 1) + '

' + '

'; } // Curse warps render at the top level now (viewport-locked, out of the shake). const pvpMyAles = (side === "north" ? s.northAles : s.southAles) || []; // ---- ATTACK: ink the fable, each word storms their gate ---- if (pp === "attack") { const words = s.fableWords ?? []; const idx = localPlayer.state.fableIndex ?? 0; const typed = localPlayer.state.fableTyped ?? ""; return '' + '

' + '

' + roundsBar() + '

' + 'ATTACK · ink the fable' + '' + t + '' + '

' + '

' + renderFable(words, idx, typed, localPlayer.state.awaitingSpace, pvpMyAles.indexOf("daiquiri") >= 0, pvpMyAles.indexOf("moonshine") >= 0) + '

' + '

every finished word marches a raider on their wall

' + '

' + pvpTug + '

'; } // ---- DEFENSE: their massed army charges your wall — type each one down ---- const cw = localPlayer.state.currentWord || ""; const tp = localPlayer.state.typed || ""; let wordHtml; if (cw) { wordHtml = ''; for (let i = 0; i < cw.length; i++) { const done = i < tp.length; wordHtml += '' + cw.charAt(i) + ''; } } else { wordHtml = 'tap a letter to lock a raider'; } return '' + '

' + '

' + roundsBar() + '

' + 'DEFEND · your wall took ' + taken + '' + '' + t + '' + '

' + '

' + wordHtml + '

' + '

' + pvpTug + '

'; } // ---------- SWITCH: the held breath before the wall goes live ---------- if (phase === "switch") { const t = Math.max(0, Math.ceil(s.timer ?? 3)); return '' + '

' + '

raiders incoming

' + '

' + (t > 0 ? t : "!") + '

' + '

hold the wall

' + '

'; } // ---------- RESULT ---------- if (phase === "result") { const res = s.result ?? "draw"; const title = res === "win" ? "VICTORY" : res === "lose" ? "DEFEAT" : "DRAW"; const col = res === "win" ? "oklch(0.82 0.18 145)" : res === "lose" ? "oklch(0.7 0.22 25)" : "oklch(0.85 0.06 80)"; return '' + '

' + '

' + title + '

' + '

you

' + (s.roundsWonPlayer ?? 0) + '

rounds

' + '

enemy

' + (s.roundsWonEnemy ?? 0) + '

rounds

' + '

' + '' + '

' + '

'; } // ---------- ALE: choose a brew to hurl ---------- if (phase === "ale") { const opts = s.aleOptions ?? []; const cards = opts.map(function (a, i) { return ''; }).join(""); return '' + '

' + '

you lost the round

' + '

pour their poison

' + '

losing has one mercy — choose the curse your rival carries into the next round

' + '

decide in ' + Math.max(0, Math.ceil(s.aleTimer ?? 0)) + 's — or fate pours it

' + '

' + cards + '

' + '

'; } // ---------- ALE RESULT: the winner raises the cup ---------- if (phase === "ale-result") { const a = s.aleToast; const t = Math.max(0, Math.ceil(s.timer ?? 0)); if (!a) return ''; const enemyDrank = s.aleDrinker === "enemy"; // The WINNER chugs: enemy drank → enemy (crimson) won; you drank → you (azure) won. const who = enemyDrank ? "THE ENEMY DRINKS" : "YOU DRINK"; const sub = enemyDrank ? "your poured cup curses them — they'll stumble through the next round" : "you won the round — carry this curse through the next one"; const drink = safeDrink({ who: enemyDrank ? "crimson" : "azure", color: a.color }); return '' + '

' + '

' + who + '

' + drink + '

' + (a.emoji || "🍺") + ' ' + a.name + '

' + '

' + a.debuff + '

' + '

' + sub + '
round ' + ((s.round ?? 1) + 1) + ' in ' + t + '

' + '

'; } // ---------- TALLY: who took less damage wins the round ---------- if (phase === "tally") { const win = s.lastRoundWinner ?? "draw"; const col = win === "player" ? "oklch(0.82 0.18 145)" : win === "enemy" ? "oklch(0.7 0.22 25)" : "oklch(0.85 0.06 80)"; const head = win === "player" ? "ROUND WON" : win === "enemy" ? "ROUND LOST" : "ROUND DRAWN"; const sub = win === "player" ? "you took less damage" : win === "enemy" ? "you took more damage" : "dead even — nobody drinks"; const youLess = playerDmg <= enemyDmg; return '' + '

' + '

round ' + round + ' of ' + MAX_ROUNDS + '

' + '

' + head + '

' + '

' + sub + '

' + '

you took

' + playerDmg + '

' + '

enemy took

' + enemyDmg + '

' + '

your rounds

' + pips(roundsWonPlayer, "oklch(0.7 0.16 250)") + '

' + '

enemy rounds

' + pips(roundsWonEnemy, "oklch(0.68 0.2 25)") + '

' + '

'; } // ---------- BATTLE (attack / defense) ---------- const phaseDur = s.phaseDur ?? 30; const isAttack = phase === "attack"; const timer = Math.max(0, s.timer ?? phaseDur); const otActive = !!s.overtime && phase === "defense"; const timerPct = otActive ? (timer / 10) * 100 : (timer / phaseDur) * 100; const timerCol = otActive ? "oklch(0.7 0.26 25)" : timer > phaseDur * 0.5 ? "oklch(0.78 0.16 145)" : timer > phaseDur * 0.22 ? "oklch(0.82 0.18 75)" : "oklch(0.68 0.22 25)"; const overtime = !!s.overtime && phase === "defense"; const phaseLabel = overtime ? "OVERTIME" : isAttack ? "ATTACK" : "DEFEND"; const phaseSub = overtime ? "tied — break it before the buzzer" : isAttack ? "type the fable — march on their keep" : "type the raiders before they reach your wall"; const phaseColor = overtime ? "oklch(0.7 0.26 25)" : isAttack ? "oklch(0.82 0.18 75)" : "oklch(0.72 0.2 25)"; // The enemy scribe — its WPM is the difficulty made flesh. const advTier = ["easy", "medium", "hard"][Math.min(round - 1, 2)]; const aiMode = s.difficulty === "adventure" ? MODE_BY_ID[advTier] : MODE_BY_ID[s.difficulty || "medium"]; const aiTag = s.difficulty === "adventure" ? "adventure · " + (aiMode ? aiMode.label : "") : (aiMode ? aiMode.label : ""); const aiWpm = aiMode ? aiMode.line : "52 wpm"; const aiCol = aiMode ? aiMode.color : "oklch(0.84 0.16 78)"; // Damage tug-of-war — bars scale to whoever's taken the most so far. const dmgMax = Math.max(10, playerDmg, enemyDmg); const playerDmgPct = (playerDmg / dmgMax) * 100; const enemyDmgPct = (enemyDmg / dmgMax) * 100; // Live typing speed — chars/5 over seconds elapsed since the first keystroke. const tChars = localPlayer.state.typeChars ?? 0; const tStart = localPlayer.state.typeStartTimer; const elapsed = tStart == null ? 0 : Math.max(0, tStart - timer); const wpmReady = elapsed >= 1.2 && tChars >= 3; const wpm = wpmReady ? Math.round((tChars / 5) / (elapsed / 60)) : 0; const wpmText = wpmReady ? wpm + ' wpm' : '— wpm'; const wpmCol = !wpmReady ? "oklch(0.6 0.04 60)" : wpm >= 60 ? "oklch(0.84 0.18 145)" : wpm >= 35 ? "oklch(0.9 0.16 75)" : "oklch(0.82 0.12 60)"; // Floating warning when a space is pressed mid-word. const spaceWarn = (isAttack && localPlayer.state.spaceHint) ? '

' + '

Press space in between words!

' + '

' : ''; // Floating warning when the right key is pressed with the wrong case. const caseHint = isAttack ? localPlayer.state.caseHint : null; const caseWarn = caseHint ? '

' + '

' + (caseHint === "cap" ? "This letter is capitalized — hold Shift!" : "This letter is lowercase — release Shift!") + '

' + '

' : ''; // The line is LOCKED — you mistyped and must Backspace before anything else. const errWarn = (isAttack && localPlayer.state.attackError) ? '

' + '

✕ wrong key

' + '

press ⌫ Backspace or Delete to undo

' + '

' : ''; // ---- Drunk-field overlays now render at the TOP LEVEL (viewport-locked, out // of the red-morse shake) — see the default export. Nothing to inject here. ---- const el = s.elapsed ?? 0; const myAleIds = s.playerAles || []; let aleOverlay = ""; const __body = '' + spaceWarn + caseWarn + errWarn + aleOverlay + // Round + pip counter (very top) '

' + '

' + pips(roundsWonPlayer, "oklch(0.7 0.16 250)") + '

' + '

round ' + round + ' / ' + MAX_ROUNDS + '

' + '

' + pips(roundsWonEnemy, "oklch(0.68 0.2 25)") + '

' + '

' + // Enemy scribe readout — who you're racing and how fast their quill flies. '

' + 'enemy scribe' + '' + aiTag + '' + '' + aiWpm + '' + '

' + // Enemy damage-taken bar (top) — MORE is good for you '

' + '

enemy took

' + '

' + enemyDmg + ' pts · ' + foeCount + ' foes

' + '

' + bar({ pct: enemyDmgPct, color: "oklch(0.62 0.22 25)", h: 16 }) + '

' + // Just under enemy bar: ATTACK shows the countdown, DEFEND shows raiders left // (defense has no clock now — it ends when the field is swept clean). (isAttack ? '

' + '

' + timer.toFixed(1) + '

' + '

' + bar({ pct: timerPct, color: timerCol, h: 8 }) + '

' + '

' : '

' + '

' + foeCount + '

' + '

' + (foeCount > 0 ? "raiders left" : "wall holds — clearing") + '

' + '

') + // Tug-of-war damage bar (bottom) — whoever DEALT more owns the bigger half. (function () { const youDealt = enemyDmg; // what you dealt to the enemy const foeDealt = playerDmg; // what the enemy dealt to you const totalDealt = youDealt + foeDealt; const youShare = totalDealt > 0 ? (youDealt / totalDealt) * 100 : 50; const foeShare = 100 - youShare; const seam = youShare.toFixed(1); return '

' + '

' + 'you dealt' + '' + youDealt + '' + '

' + '

' + '' + foeDealt + '' + 'enemy dealt' + '

' + '

' + '' + allyCount + ' allies · ' + wordsTyped + ' summoned' + '' + foeCount + ' foes' + '

' + '

'; })() + // Phase banner — which half of the cycle, and the wave number '

' + '

' + '' + phaseLabel + '' + 'round ' + round + '' + '

' + '

' + phaseSub + '

' + '

' + // Bottom readout — fable scroll on attack, lock-on card on defense '

' + (isAttack ? '

' + '

' + 'the fable' + '' + wpmText + '' + '

' + '

' + renderFable(words, idx, typed, localPlayer.state.awaitingSpace, (s.playerAles || []).indexOf("daiquiri") >= 0, (s.playerAles || []).indexOf("moonshine") >= 0) + '

' + '

' : (function () { const lockWord = localPlayer.state.currentWord; const lockTyped = localPlayer.state.typed ?? ""; if (!lockWord) { return '

press a letter to lock a raider

'; } const t = lockWord.slice(0, lockTyped.length).toUpperCase(); const r = lockWord.slice(lockTyped.length).toUpperCase(); return '

' + '' + '' + t + '' + '' + r + '' + '

'; })() ) + '

'; // Moonshine — the whole HUD pitches and rolls with the world, in lockstep with // the camera's ocean-swell. Works in a live round (solo OR duel side) AND in the // creator testbed, where the free-running testClock drives it. const moonPvp = s.mode === "pvp"; const moonSide = (localPlayer && localPlayer.state && localPlayer.state.duelSide) || "south"; const moonMine = moonPvp ? ((moonSide === "north" ? s.northAles : s.southAles) || []) : (s.playerAles || []); const moonTest = !!s.aleTest; const moonClock = moonTest ? (s.testClock || 0) : el; const moonInPlay = moonTest || phase === "attack" || phase === "defense" || (moonPvp && s.pvpPhase === "attack") || (moonPvp && s.pvpPhase === "defense"); if (moonMine.indexOf("moonshine") >= 0 && moonInPlay) { const t = moonClock; // Two incommensurate swells so the roll never settles into a clean loop — // a wallowing boat-deck list, matching camera.js's heave/roll. const rollDeg = ((Math.sin(t * 1.05) * 0.16 + Math.sin(t * 0.47) * 0.07) * 57.3).toFixed(2); const tx = (Math.sin(t * 0.73) * 2.1).toFixed(2); const ty = (Math.cos(t * 0.61) * 1.7 + Math.sin(t * 1.3) * 0.6).toFixed(2); return '

' + __body + '

'; } return __body; }

Spawn