Increased bar width to 7px with #222 background and #666 border for
better contrast. Added tooltip showing "X% full" on hover. Minimum
2px fill height when non-empty so even nearly-empty packs show a sliver.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
The pack fill bars were always empty because items weren't mapping
to container key 0 (main backpack). The bodyContainerId detection
failed when the inventory service doesn't include container_id on
wielded items. Now falls back to using the largest non-container
item group as the main backpack if key 0 is empty.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1. Pack capacity bars: gave the fill bar div explicit height (30px)
instead of relying on alignItems:stretch which produced 0 height.
Bar now visibly fills green/orange/red beside each pack icon.
2. Mana panel: added 20px item icons back to each mana row, between
the status dot and item name. Uses the same ItemIcon component
with 3-layer compositing.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replaced the cramped 3-column CSS Grid mana layout with simple
flexbox rows matching the player sidebar style:
- Status dot (green/red) + item name + mana current/max + time remaining
- Font sizes use rem units (0.65-0.72rem) matching sidebar buttons/stats
- tabular-nums for aligned numbers
- Time column has min-width so it doesn't get clipped
- No more horizontal scrolling or cut-off text
- Empty state message when no mana items equipped
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1. Item normalization: normalizeItem() handles ALL formats:
- Inventory service (snake_case): current_wielded_location, object_class
- Plugin raw (PascalCase): CurrentWieldedLocation, ObjectClass
- Plugin IntValues: IntValues['10'] for wielded, ['5'] for burden
- Sentinel filtering: -1 values properly excluded
2. Equipment slots: armor (object_class=2) fills ALL matching slots.
Non-armor uses exact mask match first, then first bit overlap.
Body container ID detected to separate worn from pack items.
3. Slot colors: per-slot-type backgrounds matching v1:
purple (#3a2555) for jewelry, blue (#1e2e55) for armor,
teal (#1e3e3e) for clothing, dark blue (#142040) for weapons
4. Burden: fetches /character-stats/{name} for burden_units and
encumbrance_capacity. Shows percentage when available, raw burden
otherwise. Bar fills 0-200% mapped to 0-100% height with
green/orange/red thresholds.
5. Mana panel: shows equipped items with current/max mana + estimated
time remaining. State dot green/red. Sorted by mana ascending.
6. Fonts: switched to system font stack (-apple-system etc.) instead
of Palatino for crisp rendering.
7. Tooltip: proper system font, larger text (13px), structured sections
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
1. Equipment slots: armor (object_class=2) now renders in ALL matching
slots via bitmask, not just the first. E.g. a chest piece covering
upper arm + chest + abdomen appears in all 3 slots. Non-armor items
still use first-match. Matches v1's exact logic.
2. Pack fill bars: changed from horizontal-below to vertical-right of
each pack icon. 4px wide bar with fill from bottom, color-coded:
green <70%, orange 70-90%, red >90%.
3. Burden: removed garbled percentage (was dividing by 10). Now shows
"Burden" label with total burden in tooltip. Bar shows 50% as
placeholder until character_stats provides encumbrance_capacity.
4. PackIcon component: reusable for main backpack + sub-packs, shows
game icon + vertical fill bar + green active glow + gold ▶ arrow.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Rebuilt inventory window to match v1 pixel-for-pixel:
Left column (316px):
- Equipment grid: 6×7 slots at 44px spacing, beveled 3D borders,
cyan glow (#00ffff) when equipped, faded ghost icon when empty
- Item grid: 6-column CSS Grid with purple gradient cells,
minimum 24 empty cells to fill grid
Center sidebar (38px):
- Burden bar: 14×40px vertical bar, green/orange/red thresholds,
percentage label, tooltip with burden units
- Pack icons: 32×32px with actual game icon images (not emoji)
- Active pack: green border + glow + gold ▶ arrow indicator
- Fill indicator: 4px green bar below each pack showing capacity %
- Main backpack (icon 0600127E) + sub-packs with actual container icons
Right panel (flex):
- Mana panel: header + equipped items with mana tracking
- Per-item: 16px icon, name, mana state dot (green/red),
current/max mana values in v1's grid layout
Hover tooltip:
- Follows mouse cursor (fixed position)
- Shows: name (gold), value, burden, material (green), armor level,
max damage, damage range/type, attack/defense bonuses as %,
skill requirements (orange), imbue, set, tinks, workmanship,
ratings, spellcraft, mana, spell list (blue)
- Black semi-transparent background matching v1's inventory-tooltip
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Character Window — now matches v1 exactly:
- Navy blue background (#000022) with gold/bronze borders (#af7a30)
- Two side-by-side 320px tab containers
- Left tabs: Attributes (vital bars with gold borders + attribute
table with green/blue cell backgrounds + vitals base + skill
credits) | Skills (specialized=purple gradient, trained=teal
gradient, grouped and sorted) | Titles
- Right tabs: Augmentations (with auras section) | Ratings | Other
(allegiance with followers)
- Active tab: green tint background with gold top/side borders
- Header: large name + level (gold, right-floated) + race/gender
- XP grid: total, unassigned, luminance earned/total, deaths
- Live vital bars from WebSocket vitals data
- Augmentation/aura/rating property ID maps from v1
Radar — passes full radarData message (not just objects array)
so canvas can render map background + entity positions properly
WindowRenderer — passes live vitals to CharacterWindow
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Radar — now pixel-accurate reproduction of v1:
- 300×300 canvas with dark circular background
- Semi-transparent dereth.png map overlay (heading-rotated)
- 4 range rings + crosshair lines
- Compass labels (N=red, E/S/W=gray) rotating with heading
- Facing direction indicator line
- Entity dots color-coded by type (Monster=red, Player=blue,
NPC=green, Portal=purple, Corpse=orange, Container=yellow)
- Player dot: gold center with white border
- Heading-up rotation for all entity positions
- Click to select entity (white selection ring)
- Scroll to zoom (0.02-5.0 AC units range)
- Entity list with color dot, name, type, distance, compass direction
- Selected entity highlighted with blue left border
Inventory — v1-style icon composites + slot styling:
- 3-layer icon composite: underlay → base → overlay images
using portal.dat offset formula + icon_overlay_id/IntValues
- Equipment slots: 3D beveled border + cyan glow when equipped
(matching v1's outset border + #00ffff shadow)
- Pack item cells: purple gradient background (v1's #3d007a)
- Proper 36×36px icon rendering with pixelated scaling
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Radar:
- nearby_objects WebSocket messages now tracked in useLiveData state
- Passed through MapLayout → WindowRenderer → RadarWindow
- Objects list updates live as radar data streams in
Inventory:
- Items now render actual game icons via /icons/{hexId}.png
using the portal.dat offset formula (iconRaw + 0x06000000)
- Hover tooltip shows: name, material, AL, damage, workmanship,
tinks, set, imbue (multi-line)
- Equipment grid slots show item icons instead of text names
- Pack item grid shows item icons with proper tooltips
- Fallback icon (06000133.png) on load error
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Primary buttons: soft blue translucent background with blue text,
glows slightly on hover. Secondary buttons: dark subtle with gray
text. Cleaner, more modern feel vs the old solid #88f blocks.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Stats now use a 3-column CSS Grid so values align across rows
- Fixed icons: ☠️ for deaths (was 💀), prismatic-taper-icon.png
for tapers (was wrong emoji 🔮), 🕐 for time (was 🕑)
- Added action buttons row (Chat, Stats, Inv, Char, Radar) matching
v1's button bar — accent-colored for primary actions
- Buttons are present but not wired to windows yet (Phase 3)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Stats were bare numbers with no visual hint what they represent.
Now each stat has the same emoji prefix as v1:
⚔️ session kills, 🏆 total kills, KPH suffix
💎 rares (session/total), 📊 KPR suffix
🕑 online time, 💀 deaths, 🔮 prismatic tapers
Meta state pill still color-coded (green=active, gray=idle).
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Rebuilds the v1 map-centric experience in React:
Layout:
- 400px sidebar on left, interactive map on right (flex, 100vh)
- Exact same proportions and dark theme as v1
Sidebar (top→bottom):
- Header with active player count + Dashboard toggle button
- Server status dot (Coldeve online/offline with pulse)
- Aggregate counters: Rares (gold), Server KPH (blue glow), Kills (red)
- 6 sort buttons (Name, KPH, S.Kills, S.Rares, T.Kills, KPR)
- Player name filter
- Scrollable player list with per-row:
- Name + coordinates
- HP/Stamina/Mana vital bars (red/orange/blue gradients)
- Session kills, total kills, KPH
- Session rares, total rares, VTank meta state pill
- Online time, deaths, prismatic tapers
- Color-coded left border per player
Map:
- dereth.png with CSS transform pan (drag) + zoom (wheel, 1.1x factor, max 20x)
- Player dots (6px circles, color-matched to sidebar)
- Hover tooltip (name, coords, kph, kills)
- World coordinate display at cursor position
- Fit-to-window on first load
View toggle: Map View ↔ Dashboard with localStorage persistence.
All v1 CSS ported under ml-* prefix, scoped via map-layout.css.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Below the character cards grid, adds four tabbed analytics sections:
Combat Tab (Recharts):
- Kills per hour horizontal bar chart (all characters, sorted)
- Total damage session bar chart
- Damage by element pie chart (aggregated across all characters)
Rares Tab:
- Summary cards: total rares, total kills, drop rate (1 in N)
- Recent rare drops timeline (from WebSocket events)
- Rares per character lifetime bar chart
Map Tab:
- Dereth map (dereth_highres.png) with SVG overlay
- Character position dots (green=hunting, yellow=other)
- Hover to see character name + coordinates
- Responsive, maintains aspect ratio
Inventory Tab:
- Cross-character item search with debounced input
- Results table: character, item, type, material, set, workmanship
- Powered by existing /search/items API
All tabs lazy-rendered (only active tab mounts). Horizontal scroll
tab bar on mobile. Dark theme consistent with cards.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
vt_state values from plugins include "Hunt", "combat", "Default",
"turn_in_quests" etc. Previously only "combat" showed as green badge,
everything else was "Idle". Now Hunt shows green, unknown states show
their actual name.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
New modern dashboard at /v2 running alongside the existing UI at /.
Same backend, same APIs, same WebSocket — zero backend changes.
Stack: React 19 + Vite + TypeScript + Recharts
Source: frontend/ — build output: static/v2/
Phase 1 delivers:
- Character overview cards in a responsive CSS Grid
- Live HP/Stamina/Mana bars via WebSocket vitals
- Kills/hr, total kills, deaths, session uptime
- VTank state badge (Combat/Nav/Idle)
- Location coordinates
- Click to expand: combat stats, prismatic count, CPU/RAM
- Global stats header: active chars, total kills, total rares, server health
- WebSocket hook with auto-reconnect
- HTTP poll fallback for initial load + server health
- Mobile responsive (single column on narrow screens)
- Dark theme matching the MosswartOverlord palette
Build: cd frontend && npm run build
Access: /v2 (served by existing NoCacheStaticFiles mount)
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
