isledecomp/isle.pizza
1
0
Fork 0
mirror of https://github.com/isledecomp/isle.pizza.git synced 2026-02-28 13:57:38 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity
3116ac1c7f
isle.pizza/README.md
Christian Semmler 9872902e4d
Some checks are pending
Build / build (push) Waiting to run
Details
Actor editor (#24) 
* Improve Lighthouse LCP and accessibility scores

Preload the LCP image (install.webp) from the HTML and add
fetchpriority="high" so the browser discovers it before JS executes.
Use a <main> landmark for the primary content container to satisfy
the "document has a main landmark" accessibility audit.

* Add actor editor with animated 3D character preview

Browse and customize all 66 game actors with a Three.js rendered preview
featuring skeletal walk cycle animations. Click interaction matches the
game's character-dependent behavior (Pepper=hat, Nick=color, etc.).

- Parse WDB global parts and global textures for character assembly
- Parse and serialize character data (66 entries x 16 bytes) in save files
- AnimationParser for .ani binary format with hierarchical keyframe evaluation
- Full g_cycles animation table (11 types x 17 animations) driven by move/sound
- Per-mesh texture support for hats, torso, and face textures

* Extract BaseRenderer to deduplicate actor and vehicle renderers

- Extract shared Three.js setup, lighting, texture, geometry, and
  animation loop code into BaseRenderer base class (~170 lines)
- Deduplicate WdbParser.parseGlobalParts via parsePartData delegation
- Consolidate lego brown/lt grey into shared LegoColors constant
- Remove dead code: updatePartColor, SUFFIX_NAMES, CharacterType,
  getCharacterType, partToLODIndex, unused imports and re-exports
- Simplify updateCharacter and resolve methods by removing unnecessary
  defensive checks on frozen data and bounded UI inputs
- Extract actorKey helper in ActorEditor to deduplicate key computation
- Delete unused animations/manifest.json

* Add reset to default button for actor editor

Compare each actor's character state against ActorInfoInit defaults
and show a reset button when any field differs. Resets all 10 fields
(sound, move, mood, hat, colors) in a single save round-trip by
extending updateSaveSlot to accept batch character updates.

* Show full character names in actor editor

Add ActorDisplayNames lookup with names from savegame.ksy doc comments
(e.g. "Pepper Roni", "Mama Brickolini") instead of internal IDs.
Widen nav label min-width to 150px to prevent button shifting.

* Stabilize actor position when hat changes

Override centerAndScaleModel in ActorRenderer to exclude the hat
part from the bounding box calculation, so switching between hats
of different sizes no longer shifts the body/head position.

* Fetch assets from SI files via HTTP Range requests

Replace static animation, texture, and globe bitmap files with a
manifest-driven approach that extracts them directly from the game's
SI files at runtime using HTTP Range requests.

A new generate-manifest script scans SI files by MxCh objectId to
locate each asset's byte offset(s), verifies integrity via MD5, and
writes an asset-ranges.json manifest. The app consumes this manifest
to fetch assets on demand, including support for files split across
MxCh interleave boundaries.

Also removes unused constants (ActorLODIndex, animation keyframe
flag constants).

* Fetch character icons from SI files via HTTP Range requests

Replace static webp character icons with runtime extraction from
INFOMAIN.SI, extending the bitmap manifest to support multiple SI files.

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>

* Fix actor editor animation and interaction bugs

Use mood (not sound+4*move) to select walking animation, matching
FUN_10063b90. Load secondary animation tier (speed 4.0 threshold)
which NPCs typically use in-game, producing the independent head/hat
movement. Fix switchSound wrap to 9 values, add switchColor click
remapping for claws/head/body, fix g_cycles case mismatches, add
morph key visibility support, and preserve root Y-translation for
vertical bounce while stripping horizontal movement.

* Add click animations to actor editor

Play a one-shot gesture animation when clicking an actor, matching the
in-game LegoEntity::ClickAnimation behavior (objectId = m_move + 10).
After the click animation finishes, the walking loop resumes. Adds the
4 click animations from SNDANIM.SI to the asset manifest and extends
ActorRenderer with queue-based click animation playback. Also fixes
treadmill XZ stripping for click animations where actor_01 is nested
under wrapper nodes.

* Add vehicle rendering to actor editor

Actors with personal vehicles (skateboard, motorcycles, bicycles) can
now be toggled between walking and vehicle mode via a button in the
actor navigation bar. Vehicle geometries are loaded from WDB world
models and rendered alongside the character with matching animations.

* Add click sound playback to actor editor

Plays the character's click sound (m_sound + 50) and, for Laura's
SwitchMood, an additional mood sound (m_mood + 66) from SNDANIM.SI,
matching the original game behavior. Sounds are fetched on demand,
decoded as WAV, and cached as AudioBuffers.

* Replace Range request asset loading with packed binary bundle

Extract save editor assets (animations, sounds, textures, bitmaps) into
a single save-editor.bin file at build time instead of fetching byte
ranges from ~550MB SI files at runtime. The bundle packs an embedded
JSON index and all fragment data into one file (~756KB), eliminating
Range request complexity and enabling proper Workbox precaching.

* Clean up actor editor branch: DRY, dead code, CSS

- Extract buildNodeToPartGroupMap() in ActorRenderer to deduplicate
  map-building logic in loadAnimationForActor and playClickAnimation
- Refactor updateMissionScore() to use getMissionScoreOffset() instead
  of duplicating offset calculation
- Remove unused ActorPartLabels export from actorConstants
- Make fetchBitmap module-private (only used by fetchBitmapAsURL)
- Merge duplicate .globe-btn CSS blocks in LightPositionEditor

* Add drag-to-orbit controls to vehicle and actor editors

Use Three.js OrbitControls in BaseRenderer for rotation-only orbiting
with damping. Vehicle editor auto-rotates and resets on part switch.
Actor editor uses orbit without auto-rotate (has skeletal animations).
Drag vs click detection uses pointermove threshold to avoid false
positives from autoRotate damping.

* Rebase WdbModelRenderer on BaseRenderer

Remove duplicated scene/camera/renderer/lighting setup, geometry
unpacking, animation loop, and dispose logic. Score cube gets orbit
controls and drag-vs-click detection for free.

* Add zoom, pan, and camera reset to 3D editors

Enable zoom (scroll/pinch) and pan (right-click/two-finger drag) on
all OrbitControls. Add resetView() to BaseRenderer that restores
initial camera state and auto-rotate via OrbitControls.saveState/reset.
Add reset camera button to EditorTooltip with mobile-friendly touch
targets and hover-only highlight to avoid sticky state on touch.

* Update changelog and fix sticky hover on touch devices

Add actor editor features, 3D orbit/zoom/pan controls, and camera
reset button to the February 2026 changelog. Wrap hover styles in
@media (hover: hover) for vehicle toggle and texture buttons.

* Update README with save editor setup, project structure, and Three.js
2026-02-14 02:29:55 +01:00

4.1 KiB
Raw Blame History

isle.pizza Frontend

A custom web frontend for the Emscripten port of isle-portable, allowing LEGO Island to run directly in modern web browsers.

image

Requirements

Quick Start

  1. Clone the repository:

    git clone https://github.com/isledecomp/isle.pizza.git
cd isle.pizza

  2. Install dependencies:

    npm install

  3. Obtain the game files (isle.js and isle.wasm) by building the Emscripten version of isle-portable, then copy them to the project root.

  4. Set up the LEGO Island game assets:

    npm run prepare:assets

    This will prompt you for the path to your LEGO Island installation or mounted ISO and create the necessary symlinks. You can also provide the path directly:

    npm run prepare:assets -- -p /path/to/your/LEGO

  5. Generate the save editor asset bundle (requires game assets from step 4):

    npm run generate:save-editor-assets

    This extracts animations, sounds, textures, and character icons from the game files into save-editor.bin, used by the save editor's 3D previews.

  6. Start the development server:

    npm run dev

  7. Open the URL shown in the terminal (usually http://localhost:5173).

Scripts

Command Description
npm run prepare:assets Set up LEGO Island game assets via symlinks
npm run generate:save-editor-assets Extract save editor assets (animations, sounds, textures, icons) into save-editor.bin
npm run dev Start development server with hot reload
npm run build Build for production (outputs to dist/)
npm run preview Preview the production build locally

Project Structure

isle.pizza/
├── src/
│   ├── App.svelte         # Main application component
│   ├── app.css            # Global styles
│   ├── stores.js          # Svelte stores for state management
│   ├── core/
│   │   ├── formats/       # Binary file parsers/serializers (WDB, save games, animations, textures)
│   │   ├── rendering/     # Three.js renderers (BaseRenderer, VehiclePartRenderer, ActorRenderer, etc.)
│   │   ├── savegame/      # Save game constants, actor data, color tables
│   │   └── ...            # Audio, OPFS, service worker, asset loading
│   └── lib/               # UI components and pages (save editor, configure, etc.)
├── public/
│   └── images/            # UI images (menu buttons, tab icons)
├── scripts/               # Build and asset generation scripts
├── src-sw/                # Service worker source
├── index.html             # HTML entry point
├── isle.js                # Emscripten JS (not in repo, build from isle-portable)
├── isle.wasm              # Emscripten WASM (not in repo, build from isle-portable)
├── save-editor.bin        # Packed save editor assets: animations, sounds, textures, icons (not in repo, generated)
└── LEGO/                  # Game data directory (not in repo)

Building the Game Files

The isle.js and isle.wasm files are not included in this repository. To obtain them:

  1. Follow the isle-portable build instructions for the Emscripten target
  2. Copy the resulting isle.js and isle.wasm to this project's root directory

Alternatively, a Docker image that bundles the runtime with this frontend is available.

Tech Stack

  • Svelte 5 - UI framework
  • Three.js - 3D rendering for save editor previews
  • Vite - Build tool and dev server
  • Workbox - Service worker and offline support

License

See LICENSE for details.