From 1a1ed4e1d0568a1610d5f5da3d541a59afe2b863 Mon Sep 17 00:00:00 2001 From: David Skoland Date: Tue, 24 Mar 2026 12:23:45 +0100 Subject: Add reconnect UI, disconnect button, and visual cleanup - Redesign disconnect overlay as a full-screen modal with dark backdrop - Add working Reconnect button that properly re-establishes WebSocket connection - Add Disconnect button in Settings for testing - Separate disconnect and ban/kick codepaths (no reconnect on ban) - Log disconnect notice in IC log using hrtext style - Refactor area list rendering from client state (renderAreaList) - Extract appendICNotice for reusable IC log notices - Clean up charselect: hide during loading, simplify toolbar layout - Freshen loading screen and charselect styling - Remove loading progress text updates (just show "Loading...") - Guard against undefined client.chars and client.serv Co-Authored-By: Claude Opus 4.6 (1M context) --- webAO/dom/renderAreaList.ts | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) create mode 100644 webAO/dom/renderAreaList.ts (limited to 'webAO/dom/renderAreaList.ts') diff --git a/webAO/dom/renderAreaList.ts b/webAO/dom/renderAreaList.ts new file mode 100644 index 0000000..e622765 --- /dev/null +++ b/webAO/dom/renderAreaList.ts @@ -0,0 +1,24 @@ +import { client } from "../client"; +import { area_click } from "./areaClick"; + +export function renderAreaList() { + const container = document.getElementById("areas")!; + container.innerHTML = ""; + + for (let i = 0; i < client.areas.length; i++) { + const area = client.areas[i]; + const el = document.createElement("SPAN"); + el.className = `area-button area-${area.status.toLowerCase()}`; + el.id = `area${i}`; + el.innerText = `${area.name} (${area.players}) [${area.status}]`; + el.title = + `Players: ${area.players}\n` + + `Status: ${area.status}\n` + + `CM: ${area.cm}\n` + + `Area lock: ${area.locked}`; + el.onclick = function () { + area_click(el); + }; + container.appendChild(el); + } +} -- cgit