Commit Graph

64 Commits

Author SHA1 Message Date
Jose Luis
0c0ab2fc9b fix: rebuild props panel when interaction type changes
Without this, switching type to 'module' didn't show the moduleId,
ports, and Open IDE button until manually reselecting the entity.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-21 00:44:09 +01:00
Jose Luis
9ffd9c113e feat: character/NPC management system with spritesheet support
Add drag & drop spritesheet upload in editor, character registry in
sprites.js, character selector for NPCs, sprite rendering on editor
canvas, server API for character persistence, and game-side character
loading via characterLoader.js.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 21:15:28 +01:00
Jose Luis
9d218c8728 fix: replace verify textarea with Open IDE button + fix gutter line numbers
- Hide the inline verify textarea, show a clean "Open IDE" button instead
- Add white-space:pre to gutter div so line numbers render one per line
- Match gutter font-family with textarea for consistent alignment

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 18:08:21 +01:00
Jose Luis
06807801d0 feat: animated execution log with truth table + waveform viewer
When the player executes wiring, the panel transitions to a full
execution log showing:
- Animated truth table with rows revealing one by one (flash effect)
- Digital waveform viewer with square wave signals for each port
- Scanning cursor animation during evaluation
- Pulsing glow verdict (pass/fail) after all test cases complete
- Color-coded columns: orange for inputs, blue for outputs

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 18:07:14 +01:00
Jose Luis
bb72c58a15 feat: fullscreen VSCode-style code editor for module verify logic
Add a dark-themed fullscreen code editor overlay in the level editor
for editing module verify JS. Features line numbers, cursor position
tracking, tab-to-spaces, Ctrl+Enter to apply, and syncs back to the
property panel on save.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 18:04:23 +01:00
Jose Luis
f9492bff4c feat: module interaction system with wiring panel
Add a new "module" interaction type where doors/devices define ports
(in/out) and a JS verify function. Players wire their gadget's I/O
to the module's ports via a canvas-rendered wiring panel, then execute
to verify the circuit logic.

- New wiringPanel.js: full wiring UI with keyboard nav, bezier wires,
  mini circuit evaluator, and verify execution
- AND-gate example door in Circuit Lab (tile 9,1)
- Editor support: module type with ports editor and JS verify textarea
- Integrated into gameMode, worldInput, worldRenderer

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:59:25 +01:00
Jose Luis
6ba3fa457a hide: disable puzzle mode from editor without removing code
Comment out initPuzzleUI() call and remove puzzle_door from
interaction type dropdown — all puzzle code remains intact for
future re-enablement.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:45:19 +01:00
Jose Luis
e7b18afd1a fix: move game buttons into toolbar-right to prevent overlap
Save Gadget and Back to World buttons were overlapping Export/Import.
Now they are dynamically inserted into .toolbar-right when entering
workshop mode, sitting inline with the other toolbar buttons.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:40:09 +01:00
Jose Luis
816a02aeb9 feat: replace browser dialogs with in-game naming screen + notifications
Remove prompt() and alert() calls that broke game immersion. Add:
- Pokemon-style naming screen with character grid + direct typing
- Canvas-rendered notification toasts (with fade-out animation)
- Both render on top of workshop AND world mode canvases
- Workshop keyboard handler yields to naming screen when active

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:36:31 +01:00
Jose Luis
c6f5e19af5 docs: add comprehensive README with full project overview
Covers game modes, controls, gadget system, maps, level editor,
project structure, dev setup, API, and technical details.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:31:33 +01:00
Jose Luis
b999fe855a feat: gadget backpack system — save circuits as items
Add Pokemon-style inventory where players save crafted circuits as
"gadgets" in a backpack. Gadgets can be used on puzzle doors to solve
them by testing their truth table against required outputs.

New files:
- js/world/inventory.js: gadget data model, backpack UI (list with
  scroll, action menu, detail panel), keyboard navigation

Changes:
- Workshop gets "Save as Gadget" button (pink, top-right)
- I key opens backpack overlay in world mode
- Puzzle doors open backpack to select a gadget to try
- HUD shows gadget count instead of old component count
- worldState gains gadgets[] array

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:30:30 +01:00
Jose Luis
f8aa4e2eab fix: make spawn optional — only required for initial map
Spawn can now be deleted in the editor (click same tile with Spawn tool,
use Delete tool, or press Delete key). Interior maps no longer have
spawn objects. The editor shows "None" when no spawn is set, and the
generated maps.js omits the spawn field for maps without one.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:20:19 +01:00
Jose Luis
f740d96fc0 feat: bidirectional door system + editor bi-link tool
Replace spawn-based map transitions with explicit bidirectional door
links. Every exit now requires targetX/targetY — spawn is only used
for initial game start. Remove returnPoints stack from worldState.

Editor improvements:
- New "Bi-Link" tool creates paired exits on both maps at once
- Exit list shows target coordinates and warns if missing
- Canvas renders target info labels below exit tiles
- Properties panel handles game ID ↔ editor ID mapping

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:15:25 +01:00
Jose Luis
1d494d8ef3 feat: return-to-door system for map exits
When entering an interior (e.g. lab from town), the game saves the
player's current position as a return point. When exiting, if the
exit has no explicit targetX/targetY, the system pops the stored
return point and warps back to that exact position.

This means interior exits just need targetMap — the player always
returns to the specific door they entered from, not a hardcoded
position. Falls back to the destination map's spawn if no return
point is stored.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 17:02:51 +01:00
Jose Luis
b60edc49af fix: exits place player in front of door, not on it
When exiting the lab, appear one tile below the town's entrance door
instead of ON the door tile, which caused an infinite re-trigger loop.
Same pattern for all map transitions — land adjacent to the exit, not
on top of it.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:49:40 +01:00
Jose Luis
eee405d5d9 fix: editor varName broke on map IDs with digits after hyphens
house-a-1f generated 'houseA-1f' (invalid JS identifier) because
the regex only matched -[a-z], not -[0-9]. Changed to -(\w) to
handle all word characters after hyphens.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:42:38 +01:00
Jose Luis
943ba0b51c feat: Node.js server + editor save/load + keyboard controls
- Replace nginx with Node.js server that serves static files AND
  provides API endpoints for reading/writing maps.js directly
  (GET/PUT /api/maps). Creates .bak backup before each save.
- Editor: arrow keys to pan, +/- to zoom, Ctrl+S to save
- Editor: "Save" button writes maps.js directly on the server
- Editor: "Load" button reads and parses maps.js from server
- Editor: auto-loads from server on page open
- Dockerfile changed from nginx:alpine to node:20-alpine

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:37:12 +01:00
Jose Luis
71321e8e88 feat: add standalone level editor for visual map editing
Full-featured editor at /editor.html with:
- Visual wall painting (click/drag to paint/erase collision tiles)
- Entity placement: NPCs, exits, interactions, spawn point
- Properties panel for editing dialog, facing, target maps, etc.
- Zoom/pan with scroll wheel and right-click drag
- Tile coordinate overlay on the map PNG backgrounds
- Color-coded overlays matching the F3 debug view
- Export as JSON or as complete maps.js source code
- Import JSON to load/restore map data
- Keyboard shortcuts: 1-7 for tools, Delete to remove entities
- All 4 maps supported: lab, pallet-town, house, route-1

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:29:40 +01:00
Jose Luis
bf34879390 feat: add F3 debug overlay for collision visualization
Press F3 to toggle a debug overlay that shows:
- Red tiles: walls (collision)
- Green tiles: exits (map transitions)
- Yellow tiles: interactions (workshop, signs, doors)
- Purple tiles: NPCs
- Green border: current player tile
- Coordinate labels on nearby tiles
- Legend bar with player position and current map

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:23:09 +01:00
Jose Luis
9b2a25856e fix: player size, unplayable walls, NPC interaction, canvas sizing
- Player sprite: render 32x32 char at 1 tile (TILE_PX) instead of
  2x2 tiles (32*SCALE), matching NPC size on the game grid
- Wall data: completely rebuilt for both lab and town maps based on
  actual PNG layouts. Previous walls blocked spawn point, NPC access,
  and all exits. Now uses Set for O(1) collision lookups
- NPC dialog: was unreachable due to wall layout, causing player to
  interact with workshop tiles instead. Fixed by opening corridors
- Canvas: use window.innerWidth/Height directly instead of
  offsetWidth which gave wrong values before CSS recompute

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:19:49 +01:00
Jose Luis
75001e10e7 fix: add assets/ directory to Docker image
The game PNG assets (maps, characters, NPCs) were not being copied
into the nginx container, causing 404s in production.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:10:58 +01:00
Jose Luis
bc9786ce49 fix: resolve asset paths relative to document base URI
Assets were 404ing because relative paths resolved against the wrong
base when the page was served from a subdirectory.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:04:14 +01:00
Jose Luis
c836ccbb21 refactor: migrate world rendering from programmatic sprites to PNG assets
Replace pixel-art drawing with pre-rendered PNG map backgrounds and
character/NPC sprite images from pokemon-js reference. Maps now use
coordinate-based wall arrays instead of tile grids.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 16:02:44 +01:00
Jose Luis
e4cf35701e feat: add Pokemon-style world mode with workshop integration
Two-mode game: explore a tile-based cyberpunk world, then enter
Workshop mode (the existing circuit editor) to craft components.

New modules (js/world/):
- sprites.js: programmatic pixel-art renderer (16x16 tiles, 3x scale)
- maps.js: tile-based map definitions (lab + town)
- worldState.js: player position, inventory, dialog, puzzle state
- worldRenderer.js: camera-following world renderer on shared canvas
- worldInput.js: WASD movement, E interaction, dialog system
- gameMode.js: central mode switcher (world ↔ workshop)

Changes to existing code:
- app.js: boots into world mode, registers circuit editor for workshop
- renderer.js: circuit draw loop now stoppable (start/stopCircuitLoop)
- index.html: added "Back to World" button for workshop mode

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 15:52:13 +01:00
Jose Luis
bbde11dfc7 fix: BUS_OUT port and cable visual state reading wrong output value
Input port rendering on standard gates and components read srcGate.value
to determine active state, but for multi-output gates (BUS_OUT, COMPONENT)
.value only holds port 0's value. Connections from port N>0 always showed
port 0's state visually despite working correctly at the logic level.

Extract getSourcePortValue() helper that checks outputValues[fromPort]
for multi-output sources, and apply it consistently across all three
input port renderers (drawGate, drawBusGate, drawComponentGate).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 14:10:53 +01:00
Jose Luis
a1cc631406 fix: component port labels showing wrong name after editing blueprint
The label lookup in drawComponentGate read from gate.component (potentially
stale copy) while gateOutputCount read from state.customComponents (updated
definition), causing a mismatch — fewer ports but old outputIds, so the
first (deleted) output's label was shown instead of the surviving one.

Three fixes:
- renderer: use customComponents as authoritative source for label lookup
- saveLoad: re-link gate.component refs to customComponents after loading
- components: update existing instances even when a "new" component
  overwrites an existing definition with the same name

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 14:04:42 +01:00
Jose Luis
c116b6cf84 refactor: bus terminals with single-sided pins only
BUS_IN has input pins only (left side), BUS_OUT has output pins
only (right side). No internal connections between them — BUS_OUT
reads values directly from its paired BUS_IN via busPairId. The
bus cable between them is purely visual, representing the grouped
signal bundle.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:50:42 +01:00
Jose Luis
9ec3367253 feat: drag selection box to select, move, and delete multiple gates
Click and drag on empty space to draw a selection rectangle. Gates
inside the box get selected (cyan dashed outline). Drag any selected
gate to move all of them together. Delete/Backspace removes all
selected gates and their connections. Escape clears the selection.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:47:34 +01:00
Jose Luis
12d7331d2c refactor: bus now spawns two paired terminals with a bus cable
Instead of a single pass-through gate, shift+drag now creates two
BUS terminals (IN and OUT) connected by a thick bus cable. Internal
connections between terminals are hidden and rendered as a single
cable with /N notation and a diagonal slash. Each terminal is a
thin cyan bar that can be moved independently.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:43:30 +01:00
Jose Luis
99f0fefe5c feat: shift+drag to cut wires and create bus connectors
Hold Shift and drag across wires to create a BUS gate that groups
them together. The cut line shows a live preview with wire count.
BUS gates are pass-through (each input maps to its output) and
render as a thin cyan bar with ports on each side.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:39:00 +01:00
Jose Luis
89d118f738 feat: keep placing mode active for multiple placements
Selected gate type stays active after placing, allowing multiple
gates of the same type without re-selecting. Right-click or Escape
to cancel placing mode.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:28:10 +01:00
Jose Luis
2fd22cc79d feat: persist circuit and components to localStorage
Auto-saves every 3 seconds and on page unload. Restores the full
state (circuit, camera, custom components) on page load.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:25:28 +01:00
Jose Luis
5bd157c059 fix: only show port label prompt inside component editor
Double-click rename for INPUT/OUTPUT/CLOCK gates now only triggers
when inside the component editor, not in the main circuit.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:24:39 +01:00
Jose Luis
eb22a5ff62 feat: double-click component gates to edit their blueprint
Opens the component editor with the internal circuit loaded for
modification. On save, updates the component definition and all
existing instances in the main circuit.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:22:45 +01:00
Jose Luis
817dab43df feat: port labels on component gates + persistent internal state
Show input/output labels next to ports on custom component chips,
and persist internal gate state between evaluations so latches and
flip-flops retain their values correctly.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:15:37 +01:00
Jose Luis
1c45dc6104 fix: complete rewrite of component evaluation system
Major fixes for custom components when used in the main circuit:

- Add outputValues[] array for multi-output component gates, so each
  output port carries its own independent value
- readSourcePort() reads the correct port value from source gates
  instead of always reading gate.value
- evaluateComponent() now uses iterative fixed-point evaluation
  (matching main evaluateAll) instead of a simple 10-pass loop
- Store inputIds/outputIds in component definition for consistent
  port-to-gate mapping across save/load
- Renderer reads per-port values for connection color and port glow
- Added debug logs for component save and evaluation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:10:28 +01:00
Jose Luis
bc8823bcd4 feat: editable labels for INPUT/OUTPUT/CLOCK gates
Double-click any INPUT, OUTPUT, or CLOCK gate to assign a custom label.
Labels are shown inside the gate and used in waveform viewer instead of
generic IN_0/OUT_0 names. Example circuits now ship with meaningful
labels (S, R, D, EN, Q, Q̅, CLK).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:06:50 +01:00
Jose Luis
6cb3f091d4 fix: dropdown menus render above component editor overlay
Lower component editor overlay z-index from 105 to 90 so toolbar
dropdown menus (z-index 150) appear on top of it.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 04:05:24 +01:00
Jose Luis
a4292b42cf fix: iterative evaluation for sequential circuits + debug logs
Replace single-pass recursive evaluation with iterative fixed-point
evaluation that runs multiple passes until all gate values stabilize.
Crucially, gate values are NO LONGER reset to 0 before evaluation,
which preserves latch/flip-flop memory state.

Add console logs for toggle, wire, and evaluation stability debugging.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 03:59:26 +01:00
Jose Luis
2384c489b9 feat: add Examples dropdown with pre-built circuits
Add 4 example circuits accessible from a new toolbar dropdown:
- SR Flip-Flop (NOR) — basic set-reset latch
- SR Flip-Flop (NAND) — active-low variant
- D Latch (1-bit Memory) — gated latch with enable
- D Flip-Flop (Master-Slave) — edge-triggered with CLK

Each example shows name + description in the dropdown and loads
the full circuit with proper gate placement and wiring.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 03:54:04 +01:00
Jose Luis
d78b45841c fix: INPUT toggle no longer disrupts CLK timing in waveform
recordSample() (triggered by user INPUT toggle) now only advances
timeStep when the simulation is stopped. When sim is running, it
records at the current timeStep without advancing it, so the clock's
regular tick cadence is never stolen by manual interactions.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 03:19:28 +01:00
Jose Luis
f0f3516efa fix: use requestAnimationFrame + real timestamps for clock simulation
Replace setInterval with requestAnimationFrame loop that tracks elapsed
time via performance.now(). Clock ticks now fire based on real time
rather than assuming perfect interval spacing, so user interactions
(toggling inputs, dragging gates) no longer cause the clock to stutter
or pause.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 03:16:26 +01:00
Jose Luis
2a58ad372e feat: toolbar sections as dropdown menus
Replace horizontal toolbar sections with dropdown buttons (I/O, Gates,
Components). Each opens a dropdown menu on click, keeping the toolbar
clean and compact. Dropdowns close on outside click or after selecting
a gate.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 03:14:43 +01:00
Jose Luis
53d600fcb0 fix: horizontal toolbar layout + fix component button placement
Redesign toolbar sections to use horizontal button rows instead of
vertical stacking. Fix component placement by attaching click handlers
directly to dynamically created buttons and passing correct gate object
shape to getComponentWidth/Height.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 03:06:23 +01:00
Jose Luis
268013d053 feat: sectioned toolbar + custom component editor
- Redesigned toolbar with I/O, Gates, and Components sections
- Component editor: sub-canvas mode to design reusable chips
  - Save/Cancel with main circuit state preservation
  - Components persist in localStorage
- Custom components render as purple chips with dynamic I/O ports
- Component evaluation simulates internal circuit as black box
- Toolbar height increased to 56px for section labels
- All height references updated consistently

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 02:54:04 +01:00
Jose Luis
3bff1fd4b4 fix: allow dragging all gates + stop waveform recording on edits
- INPUT/CLOCK gates can now be dragged (click-without-move = toggle,
  click-and-drag = move). Uses 4px movement threshold.
- Waveform only records samples on intentional actions (INPUT toggle,
  manual step, simulation tick), not on gate placement/movement/connections.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 02:42:00 +01:00
Jose Luis
3f1daa77bd feat: custom scrollbar + expand puzzle levels from 8 to 20
- Custom dark-themed scrollbar (WebKit + Firefox) matching the cyberpunk UI
- Added 12 new levels across new categories:
  - Combinational Logic: MUX, DEMUX, 3-input AND, Majority, Parity
  - Arithmetic: Half Subtractor, 1-bit Comparator
  - Decoders & Encoders: 2-to-4 Decoder, 4-to-2 Encoder, 7-Segment
  - Components: 1-bit ALU
  - Logic Basics: XNOR Gate

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 02:37:59 +01:00
Jose Luis
920a30ffa8 fix: puzzle sidebar integrates into layout instead of overlapping waveform
- Puzzle panel now shifts canvas and waveform viewer right (340px) instead of
  overlapping them, using body class toggle and CSS transitions
- Canvas resize accounts for sidebar width
- Progress (completed/unlocked levels, custom components) persists in localStorage
- Level cards refresh on each panel open to reflect current progress

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 02:32:35 +01:00
Jose Luis
b2e367817c feat: add Turing Complete-style puzzle system
Add progressive puzzle mode alongside the existing sandbox:
- 8 levels from basic gates to 2-bit adder
- Truth table verification with pass/fail feedback
- Gate restrictions per level
- Custom components system (save circuits as reusable chips)
- Save/load circuits as JSON
- Level selection sidebar with difficulty ratings
- Mode toggle: Sandbox (free play) vs Puzzle (guided levels)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-20 02:06:57 +01:00
Jose Luis Montañes
0f4fe27396 Revert to working waveform: timeStep += simSpeed, pxPerMs rendering
Restores the real-time ms-based waveform that correctly reflects
clock speed in wave width. Keeps the always-follow auto-scroll fix.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-19 22:43:24 +01:00