Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
c2f2cfe3ea |
@@ -442,6 +442,89 @@ Respond ONLY with valid JSON: {"accepted": true/false, "reason": "..."}`,
|
||||
return "";
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Generate a short narrative entry for the Tower Log.
|
||||
* Uses Haiku (evalModel) with Timmy's wizardly persona.
|
||||
* Returns a single sentence under 100 characters.
|
||||
*
|
||||
* In STUB_MODE returns a canned narrative so the full flow
|
||||
* can be exercised without an Anthropic API key.
|
||||
*/
|
||||
async narrateEvent(eventType: string, context?: string): Promise<string> {
|
||||
const STUB_NARRATIVES: Record<string, string[]> = {
|
||||
"job:complete": [
|
||||
"Timmy conjures a brilliant solution, weaving lightning and wisdom.",
|
||||
"Another quest fulfilled — the Workshop hums with quiet satisfaction.",
|
||||
"The crystal ball glows as Timmy delivers yet another worthy result.",
|
||||
],
|
||||
"job:rejected": [
|
||||
"With gentle wisdom, Timmy declines — not all quests suit the Workshop.",
|
||||
"The Beta oracle speaks: this path shall not be walked today.",
|
||||
],
|
||||
"job:failed": [
|
||||
"The arcane machinery sputters — a job falters in the ether.",
|
||||
"Even wizards face setbacks; Timmy regroups and stands ready.",
|
||||
],
|
||||
"visitor:enter": [
|
||||
"A new traveler arrives, drawn by the Workshop's lightning glow.",
|
||||
"The Workshop doors swing open to welcome another seeker.",
|
||||
"Another soul finds the Workshop, guided by satoshi starlight.",
|
||||
],
|
||||
"visitor:leave": [
|
||||
"A visitor departs, carrying a spark of the Workshop's magic.",
|
||||
"The door closes softly — one more seeker returns to the world.",
|
||||
],
|
||||
"payment:eval": [
|
||||
"⚡ Lightning strikes — eval fee confirmed, wisdom unlocked.",
|
||||
"Sats flow in; the Workshop's scales tip toward action.",
|
||||
],
|
||||
"payment:work": [
|
||||
"⚡ Work payment confirmed — Gamma stirs to weave the answer.",
|
||||
"The Lightning Network delivers; Timmy's full power is unleashed.",
|
||||
],
|
||||
};
|
||||
|
||||
const candidates = STUB_NARRATIVES[eventType]
|
||||
?? ["The Workshop stirs with quiet, purposeful magic."];
|
||||
|
||||
if (STUB_MODE) {
|
||||
return candidates[Math.floor(Math.random() * candidates.length)]!;
|
||||
}
|
||||
|
||||
const EVENT_CONTEXT: Record<string, string> = {
|
||||
"job:complete": "A visitor's paid job completed successfully in Timmy's Workshop.",
|
||||
"job:rejected": "A visitor's job request was rejected after AI evaluation.",
|
||||
"job:failed": "A job failed unexpectedly in the Workshop.",
|
||||
"visitor:enter": "A new visitor just entered Timmy's Workshop.",
|
||||
"visitor:leave": "A visitor just left Timmy's Workshop.",
|
||||
"payment:eval": "A visitor paid the evaluation fee via Lightning.",
|
||||
"payment:work": "A visitor paid the work fee via Lightning, unlocking execution.",
|
||||
};
|
||||
|
||||
const baseContext = EVENT_CONTEXT[eventType] ?? "Something noteworthy happened in the Workshop.";
|
||||
const fullContext = context ? `${baseContext} ${context}` : baseContext;
|
||||
|
||||
try {
|
||||
const client = await getClient();
|
||||
const message = await client.messages.create({
|
||||
model: this.evalModel, // Haiku — cheap and fast
|
||||
max_tokens: 80,
|
||||
system: `You are the chronicler of Timmy's Workshop — a mystical tower powered by Bitcoin Lightning where an AI wizard named Timmy fulfills paid quests for visitors.
|
||||
Write a single vivid sentence (strictly under 100 characters) narrating what just happened.
|
||||
Style: wizardly, warm, slightly epic. Present tense. No quotes. No hashtags.`,
|
||||
messages: [{ role: "user", content: `Narrate this event: ${fullContext}` }],
|
||||
});
|
||||
const block = message.content[0];
|
||||
if (block?.type === "text") {
|
||||
const text = block.text!.trim().replace(/^["']|["']$/g, "");
|
||||
return text.slice(0, 120); // hard cap
|
||||
}
|
||||
return candidates[0]!;
|
||||
} catch (err) {
|
||||
logger.warn("narrateEvent failed", { eventType, err: String(err) });
|
||||
return candidates[Math.floor(Math.random() * candidates.length)]!;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export const agentService = new AgentService();
|
||||
|
||||
@@ -21,7 +21,10 @@ export type CostEvent =
|
||||
export type CommentaryEvent =
|
||||
| { type: "agent_commentary"; agentId: string; jobId: string; text: string };
|
||||
|
||||
export type BusEvent = JobEvent | SessionEvent | DebateEvent | CostEvent | CommentaryEvent;
|
||||
export type TowerLogEvent =
|
||||
| { type: "tower_log:entry"; id: string; narrative: string; eventType: string; agentId: string | null; jobId: string | null; createdAt: string };
|
||||
|
||||
export type BusEvent = JobEvent | SessionEvent | DebateEvent | CostEvent | CommentaryEvent | TowerLogEvent;
|
||||
|
||||
class EventBus extends EventEmitter {
|
||||
emit(event: "bus", data: BusEvent): boolean;
|
||||
|
||||
74
artifacts/api-server/src/lib/tower-log.ts
Normal file
74
artifacts/api-server/src/lib/tower-log.ts
Normal file
@@ -0,0 +1,74 @@
|
||||
/**
|
||||
* Tower Log — narrative event feed (#7).
|
||||
*
|
||||
* Generates a prose narrative entry via Haiku whenever a key Workshop event
|
||||
* occurs, persists it to the tower_log DB table, and emits it on the eventBus
|
||||
* so connected WebSocket clients receive it in real time.
|
||||
*/
|
||||
|
||||
import { randomUUID } from "crypto";
|
||||
import { db, towerLog } from "@workspace/db";
|
||||
import { desc } from "drizzle-orm";
|
||||
import { eventBus } from "./event-bus.js";
|
||||
import { agentService } from "./agent.js";
|
||||
import { makeLogger } from "./logger.js";
|
||||
|
||||
const logger = makeLogger("tower-log");
|
||||
|
||||
export interface TowerLogRow {
|
||||
id: string;
|
||||
narrative: string;
|
||||
eventType: string;
|
||||
agentId: string | null;
|
||||
jobId: string | null;
|
||||
createdAt: Date;
|
||||
}
|
||||
|
||||
/**
|
||||
* Generate a narrative entry, persist it, and broadcast it via eventBus.
|
||||
* Non-fatal — errors are logged but never thrown.
|
||||
*/
|
||||
export async function addTowerLogEntry(
|
||||
eventType: string,
|
||||
context?: string,
|
||||
agentId?: string,
|
||||
jobId?: string,
|
||||
): Promise<void> {
|
||||
try {
|
||||
const narrative = await agentService.narrateEvent(eventType, context);
|
||||
const id = randomUUID();
|
||||
|
||||
await db.insert(towerLog).values({
|
||||
id,
|
||||
narrative,
|
||||
eventType,
|
||||
agentId: agentId ?? null,
|
||||
jobId: jobId ?? null,
|
||||
});
|
||||
|
||||
// Broadcast to connected WS clients
|
||||
eventBus.publish({
|
||||
type: "tower_log:entry",
|
||||
id,
|
||||
narrative,
|
||||
eventType,
|
||||
agentId: agentId ?? null,
|
||||
jobId: jobId ?? null,
|
||||
createdAt: new Date().toISOString(),
|
||||
});
|
||||
} catch (err) {
|
||||
logger.warn("addTowerLogEntry failed", { eventType, err: String(err) });
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetch the most recent N entries from the DB, oldest-first.
|
||||
*/
|
||||
export async function getRecentTowerLog(limit = 20): Promise<TowerLogRow[]> {
|
||||
const rows = await db
|
||||
.select()
|
||||
.from(towerLog)
|
||||
.orderBy(desc(towerLog.createdAt))
|
||||
.limit(limit);
|
||||
return rows.reverse();
|
||||
}
|
||||
@@ -32,6 +32,7 @@ import { eventBus, type BusEvent } from "../lib/event-bus.js";
|
||||
import { makeLogger } from "../lib/logger.js";
|
||||
import { getWorldState, setAgentStateInWorld } from "../lib/world-state.js";
|
||||
import { agentService } from "../lib/agent.js";
|
||||
import { addTowerLogEntry, getRecentTowerLog } from "../lib/tower-log.js";
|
||||
import { db, worldEvents } from "@workspace/db";
|
||||
|
||||
const logger = makeLogger("ws-events");
|
||||
@@ -269,6 +270,18 @@ function translateEvent(ev: BusEvent): object | null {
|
||||
text: ev.text,
|
||||
};
|
||||
|
||||
// ── Tower Log (#7) ────────────────────────────────────────────────────────
|
||||
case "tower_log:entry":
|
||||
return {
|
||||
type: "tower_log_entry",
|
||||
id: ev.id,
|
||||
narrative: ev.narrative,
|
||||
eventType: ev.eventType,
|
||||
agentId: ev.agentId,
|
||||
jobId: ev.jobId,
|
||||
createdAt: ev.createdAt,
|
||||
};
|
||||
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
@@ -306,6 +319,17 @@ async function sendWorldStateBootstrap(socket: WebSocket): Promise<void> {
|
||||
} catch {
|
||||
send(socket, { type: "world_state", ...getWorldState(), recentEvents: [] });
|
||||
}
|
||||
|
||||
// Send recent tower log entries
|
||||
try {
|
||||
const logEntries = await getRecentTowerLog(20);
|
||||
send(socket, {
|
||||
type: "tower_log_history",
|
||||
entries: logEntries,
|
||||
});
|
||||
} catch {
|
||||
/* non-fatal */
|
||||
}
|
||||
}
|
||||
|
||||
export function attachWebSocketServer(server: Server): void {
|
||||
@@ -338,6 +362,7 @@ export function attachWebSocketServer(server: Server): void {
|
||||
const formattedNpub = `${npub.slice(0, 8)}…${npub.slice(-4)}`;
|
||||
broadcastToAll(wss, { type: "chat", agentId: "timmy", text: `Welcome, Nostr user ${formattedNpub}! What can I help you with?` });
|
||||
}
|
||||
void addTowerLogEntry("visitor:enter", undefined, "timmy");
|
||||
|
||||
wss.clients.forEach(c => {
|
||||
if (c !== socket && c.readyState === 1) {
|
||||
@@ -437,13 +462,22 @@ export function attachWebSocketServer(server: Server): void {
|
||||
agentId = "gamma"; phase = "starting";
|
||||
} else if (ev.state === "complete") {
|
||||
agentId = "alpha"; phase = "complete";
|
||||
void addTowerLogEntry("job:complete", undefined, "alpha", ev.jobId);
|
||||
} else if (ev.state === "rejected") {
|
||||
agentId = "alpha"; phase = "rejected";
|
||||
void addTowerLogEntry("job:rejected", undefined, "beta", ev.jobId);
|
||||
} else if (ev.state === "failed") {
|
||||
void addTowerLogEntry("job:failed", undefined, "alpha", ev.jobId);
|
||||
}
|
||||
} else if (ev.type === "job:paid") {
|
||||
jobId = ev.jobId;
|
||||
agentId = "delta";
|
||||
phase = ev.invoiceType === "eval" ? "eval_paid" : "work_paid";
|
||||
if (ev.invoiceType === "eval") {
|
||||
void addTowerLogEntry("payment:eval", undefined, "delta", ev.jobId);
|
||||
} else if (ev.invoiceType === "work") {
|
||||
void addTowerLogEntry("payment:work", undefined, "delta", ev.jobId);
|
||||
}
|
||||
}
|
||||
|
||||
if (agentId && phase && jobId) {
|
||||
|
||||
@@ -18,6 +18,7 @@ import adminRelayRouter from "./admin-relay.js";
|
||||
import adminRelayQueueRouter from "./admin-relay-queue.js";
|
||||
import geminiRouter from "./gemini.js";
|
||||
import statsRouter from "./stats.js";
|
||||
import towerLogRouter from "./tower-log.js";
|
||||
|
||||
const router: IRouter = Router();
|
||||
|
||||
@@ -33,6 +34,7 @@ router.use(relayRouter);
|
||||
router.use(adminRelayRouter);
|
||||
router.use(adminRelayQueueRouter);
|
||||
router.use(demoRouter);
|
||||
router.use(towerLogRouter);
|
||||
router.use("/gemini", geminiRouter);
|
||||
router.use(testkitRouter);
|
||||
router.use(uiRouter);
|
||||
|
||||
21
artifacts/api-server/src/routes/tower-log.ts
Normal file
21
artifacts/api-server/src/routes/tower-log.ts
Normal file
@@ -0,0 +1,21 @@
|
||||
import { Router, type Request, type Response } from "express";
|
||||
import { getRecentTowerLog } from "../lib/tower-log.js";
|
||||
import { makeLogger } from "../lib/logger.js";
|
||||
|
||||
const logger = makeLogger("tower-log-route");
|
||||
const router = Router();
|
||||
|
||||
/**
|
||||
* GET /api/tower-log — return the 20 most recent narrative entries, oldest first.
|
||||
*/
|
||||
router.get("/tower-log", async (_req: Request, res: Response) => {
|
||||
try {
|
||||
const entries = await getRecentTowerLog(20);
|
||||
res.json({ entries });
|
||||
} catch (err) {
|
||||
logger.error("GET /api/tower-log failed", { error: String(err) });
|
||||
res.status(500).json({ error: "tower_log_error" });
|
||||
}
|
||||
});
|
||||
|
||||
export default router;
|
||||
15
lib/db/migrations/0010_tower_log.sql
Normal file
15
lib/db/migrations/0010_tower_log.sql
Normal file
@@ -0,0 +1,15 @@
|
||||
-- Migration: Tower Log narrative event feed (#7)
|
||||
-- Adds the tower_log table that stores prose narrative entries about
|
||||
-- Workshop activity, generated by Haiku on key events.
|
||||
|
||||
CREATE TABLE IF NOT EXISTS tower_log (
|
||||
id TEXT PRIMARY KEY,
|
||||
narrative TEXT NOT NULL,
|
||||
event_type TEXT NOT NULL,
|
||||
agent_id TEXT,
|
||||
job_id TEXT,
|
||||
created_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
|
||||
);
|
||||
|
||||
CREATE INDEX IF NOT EXISTS idx_tower_log_created_at
|
||||
ON tower_log(created_at DESC);
|
||||
@@ -14,3 +14,4 @@ export * from "./relay-accounts";
|
||||
export * from "./relay-event-queue";
|
||||
export * from "./job-debates";
|
||||
export * from "./session-messages";
|
||||
export * from "./tower-log";
|
||||
|
||||
10
lib/db/src/schema/tower-log.ts
Normal file
10
lib/db/src/schema/tower-log.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import { pgTable, text, timestamp } from "drizzle-orm/pg-core";
|
||||
|
||||
export const towerLog = pgTable("tower_log", {
|
||||
id: text("id").primaryKey(),
|
||||
narrative: text("narrative").notNull(),
|
||||
eventType: text("event_type").notNull(),
|
||||
agentId: text("agent_id"),
|
||||
jobId: text("job_id"),
|
||||
createdAt: timestamp("created_at").notNull().defaultNow(),
|
||||
});
|
||||
@@ -702,6 +702,85 @@
|
||||
padding: 12px; margin: 0;
|
||||
max-height: 400px; overflow-y: auto;
|
||||
}
|
||||
|
||||
/* ── Tower Log button ────────────────────────────────────────────── */
|
||||
#open-tower-log-btn {
|
||||
font-family: 'Courier New', monospace; font-size: 11px; font-weight: bold;
|
||||
color: #ccaaff; background: rgba(25, 10, 45, 0.85); border: 1px solid #663399;
|
||||
padding: 7px 18px; cursor: pointer; letter-spacing: 2px;
|
||||
box-shadow: 0 0 14px #44116622;
|
||||
transition: background 0.15s, box-shadow 0.15s, color 0.15s;
|
||||
border-radius: 2px;
|
||||
min-height: 36px;
|
||||
}
|
||||
#open-tower-log-btn:hover, #open-tower-log-btn:active {
|
||||
background: rgba(45, 18, 80, 0.95);
|
||||
box-shadow: 0 0 20px #55228844;
|
||||
color: #eeddff;
|
||||
}
|
||||
|
||||
/* ── Tower Log panel (bottom sheet) ─────────────────────────────── */
|
||||
#tower-log-panel {
|
||||
position: fixed; bottom: -100%; left: 0; right: 0;
|
||||
height: 65vh;
|
||||
background: rgba(6, 3, 14, 0.97);
|
||||
border-top: 1px solid #2a1040;
|
||||
z-index: 100;
|
||||
font-family: 'Courier New', monospace;
|
||||
transition: bottom 0.35s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
box-shadow: 0 -8px 32px rgba(80, 30, 130, 0.18);
|
||||
display: flex; flex-direction: column;
|
||||
}
|
||||
#tower-log-panel.open { bottom: 60px; }
|
||||
|
||||
.tlog-header {
|
||||
display: flex; align-items: center; gap: 8px;
|
||||
padding: 14px 20px 10px;
|
||||
border-bottom: 1px solid #2a1040;
|
||||
font-size: 12px; letter-spacing: 3px; color: #9966cc;
|
||||
flex-shrink: 0;
|
||||
text-shadow: 0 0 8px #66228866;
|
||||
}
|
||||
.tlog-header span { flex: 1; }
|
||||
#tower-log-close {
|
||||
background: transparent; border: 1px solid #2a1040;
|
||||
color: #664488; font-family: 'Courier New', monospace;
|
||||
font-size: 14px; padding: 3px 8px; cursor: pointer;
|
||||
transition: color 0.2s, border-color 0.2s; border-radius: 2px;
|
||||
}
|
||||
#tower-log-close:hover { color: #bb88ff; border-color: #8844bb; }
|
||||
|
||||
#tower-log-list {
|
||||
flex: 1; overflow-y: auto; padding: 12px 20px;
|
||||
overscroll-behavior: contain;
|
||||
}
|
||||
|
||||
.tlog-empty {
|
||||
color: #44224466; font-size: 11px; letter-spacing: 1px;
|
||||
line-height: 1.8; text-align: center;
|
||||
margin-top: 40px; padding: 0 20px;
|
||||
}
|
||||
|
||||
.tlog-entry {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #1a0a2a;
|
||||
display: flex; gap: 10px; align-items: baseline;
|
||||
animation: tlog-fade-in 0.4s ease-out;
|
||||
}
|
||||
.tlog-entry:last-child { border-bottom: none; }
|
||||
@keyframes tlog-fade-in {
|
||||
from { opacity: 0; transform: translateY(4px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
.tlog-time {
|
||||
font-size: 9px; color: #443355; letter-spacing: 0.5px;
|
||||
white-space: nowrap; flex-shrink: 0; min-width: 48px;
|
||||
}
|
||||
.tlog-text {
|
||||
font-size: 11px; color: #bb99dd; line-height: 1.5;
|
||||
letter-spacing: 0.3px;
|
||||
}
|
||||
.tlog-new { color: #ddbbff; text-shadow: 0 0 6px #9944cc44; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -744,6 +823,7 @@
|
||||
<button id="open-panel-btn">⚡ SUBMIT JOB</button>
|
||||
<button id="open-session-btn">⚡ FUND SESSION</button>
|
||||
<button id="open-history-btn">⏱ HISTORY</button>
|
||||
<button id="open-tower-log-btn">📜 TOWER LOG</button>
|
||||
<a id="relay-admin-btn" href="/admin/relay">⚙ RELAY ADMIN</a>
|
||||
</div>
|
||||
|
||||
@@ -923,6 +1003,17 @@
|
||||
<span class="recovery-text">GPU context lost — recovering...</span>
|
||||
</div>
|
||||
|
||||
<!-- ── Tower Log panel (bottom sheet) ────────────────────────────── -->
|
||||
<div id="tower-log-panel">
|
||||
<div class="tlog-header">
|
||||
<span>📜 TOWER LOG</span>
|
||||
<button id="tower-log-close">✕</button>
|
||||
</div>
|
||||
<div id="tower-log-list">
|
||||
<div class="tlog-empty" id="tower-log-empty">The chronicle awaits… events will appear here as Timmy works his magic.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// Show Relay Admin button if admin token is stored in localStorage
|
||||
(function() {
|
||||
|
||||
@@ -8,7 +8,7 @@ import {
|
||||
import { initEffects, updateEffects, disposeEffects, updateJobIndicators } from './effects.js';
|
||||
import { initUI, updateUI } from './ui.js';
|
||||
import { initInteraction, disposeInteraction, registerSlapTarget } from './interaction.js';
|
||||
import { initWebSocket, getConnectionState, getJobCount } from './websocket.js';
|
||||
import { initWebSocket, getConnectionState, getJobCount, initTowerLog } from './websocket.js';
|
||||
import { initPaymentPanel } from './payment.js';
|
||||
import { initSessionPanel } from './session.js';
|
||||
import { initHistoryPanel } from './history.js';
|
||||
@@ -45,6 +45,7 @@ function buildWorld(firstInit, stateSnapshot) {
|
||||
if (firstInit) {
|
||||
initUI();
|
||||
initWebSocket(scene);
|
||||
initTowerLog();
|
||||
initPaymentPanel();
|
||||
initSessionPanel();
|
||||
initHistoryPanel();
|
||||
|
||||
@@ -22,6 +22,7 @@ let jobCount = 0;
|
||||
let reconnectTimer = null;
|
||||
let visitorId = null;
|
||||
const RECONNECT_DELAY_MS = 5000;
|
||||
let _towerLogHistory = [];
|
||||
|
||||
// Map to keep track of active job indicator positions for offsetting
|
||||
const _jobIndicatorOffsets = new Map();
|
||||
@@ -190,6 +191,23 @@ function handleMessage(msg) {
|
||||
break;
|
||||
}
|
||||
|
||||
case 'tower_log_history': {
|
||||
// Load history when panel opens
|
||||
if (Array.isArray(msg.entries)) {
|
||||
_towerLogHistory = msg.entries;
|
||||
_renderTowerLog();
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
case 'tower_log_entry': {
|
||||
// New entry streamed in real time
|
||||
_towerLogHistory.push(msg);
|
||||
if (_towerLogHistory.length > 20) _towerLogHistory.shift();
|
||||
_renderTowerLog(msg.id); // pass id to highlight new entry
|
||||
break;
|
||||
}
|
||||
|
||||
case 'agent_count':
|
||||
case 'visitor_count':
|
||||
break;
|
||||
@@ -205,3 +223,79 @@ export function sendVisitorMessage(text) {
|
||||
|
||||
export function getConnectionState() { return connectionState; }
|
||||
export function getJobCount() { return jobCount; }
|
||||
|
||||
// ── Tower Log panel ────────────────────────────────────────────────────────
|
||||
|
||||
function _renderTowerLog(newId) {
|
||||
const list = document.getElementById('tower-log-list');
|
||||
const empty = document.getElementById('tower-log-empty');
|
||||
if (!list) return;
|
||||
|
||||
if (_towerLogHistory.length === 0) {
|
||||
if (empty) empty.style.display = 'block';
|
||||
return;
|
||||
}
|
||||
if (empty) empty.style.display = 'none';
|
||||
|
||||
// Remove old entries (keep only the empty placeholder and rebuild)
|
||||
Array.from(list.querySelectorAll('.tlog-entry')).forEach(el => el.remove());
|
||||
|
||||
for (const entry of _towerLogHistory) {
|
||||
const el = document.createElement('div');
|
||||
el.className = 'tlog-entry' + (entry.id === newId ? ' tlog-new' : '');
|
||||
el.dataset.id = entry.id;
|
||||
|
||||
const t = document.createElement('div');
|
||||
t.className = 'tlog-time';
|
||||
const d = new Date(entry.createdAt);
|
||||
t.textContent = d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
|
||||
|
||||
const n = document.createElement('div');
|
||||
n.className = 'tlog-text';
|
||||
n.textContent = entry.narrative;
|
||||
|
||||
el.appendChild(t);
|
||||
el.appendChild(n);
|
||||
list.appendChild(el);
|
||||
}
|
||||
|
||||
// Auto-scroll to bottom
|
||||
list.scrollTop = list.scrollHeight;
|
||||
|
||||
// Fade new entry highlight after 3s
|
||||
if (newId) {
|
||||
setTimeout(() => {
|
||||
const el = list.querySelector(`[data-id="${newId}"]`);
|
||||
if (el) el.classList.remove('tlog-new');
|
||||
}, 3000);
|
||||
}
|
||||
}
|
||||
|
||||
export function initTowerLog() {
|
||||
const openBtn = document.getElementById('open-tower-log-btn');
|
||||
const panel = document.getElementById('tower-log-panel');
|
||||
const closeBtn = document.getElementById('tower-log-close');
|
||||
if (!openBtn || !panel || !closeBtn) return;
|
||||
|
||||
openBtn.addEventListener('click', () => {
|
||||
panel.classList.add('open');
|
||||
// Fetch history if empty
|
||||
if (_towerLogHistory.length === 0) {
|
||||
fetch('/api/tower-log')
|
||||
.then(r => r.json())
|
||||
.then(data => {
|
||||
if (Array.isArray(data.entries)) {
|
||||
_towerLogHistory = data.entries;
|
||||
_renderTowerLog();
|
||||
}
|
||||
})
|
||||
.catch(() => {});
|
||||
} else {
|
||||
_renderTowerLog();
|
||||
}
|
||||
});
|
||||
|
||||
closeBtn.addEventListener('click', () => {
|
||||
panel.classList.remove('open');
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user