mirror of https://github.com/isledecomp/isle.pizza.git synced 2026-02-28 13:57:38 +00:00

Custom frontend for the Emscripten port of isle-portable

Go to file

Christian Semmler 1d18779689 Plant editor (#25 ) * Plant editor Add Plants tab to the save editor for browsing and editing all 81 plants. Click-to-customize based on selected character matches the original game behavior (Pepper→variant, Mama→sound, Papa→move, Nick→color, Laura→mood). Includes 3D preview with per-variant display tuning, click animations, sound playback, and reset to defaults. * Refactor shared animation code into AnimatedRenderer base class Extract duplicated animation infrastructure (clock, mixer, animation caching, raycaster, keyframe interpolation) from ActorRenderer and PlantRenderer into a new AnimatedRenderer intermediate class. Extract identical sound player code from both editors into createSoundPlayer() utility. Fix PlantRenderer interpolateVertex bug where scale keys had X incorrectly negated. Remove dead PLANT_ANIM_IDS export and redundant textures.clear() calls. * Extract shared editor CSS and fix vehicle nav spacing Move duplicated preview, spinner, navigation, and side-button styles from VehicleEditor, ActorEditor, and PlantEditor into a shared editor-common.css. Standardize class names (nav-index, nav-name, side-btn) and fix VehicleEditor part-info min-width (100px → 150px) to match the other editors. * Add carousel tabs and selection-based nav to save editor Wrap save editor tab buttons in a Carousel to prevent overflow on desktop. Carousel nav buttons now cycle through the selected item (save slot or tab) instead of scrolling, with auto-scroll-into-view. On mobile, tabs reflow with flex-wrap as before. * Update February changelog with plant editor and carousel navigation		2026-02-14 18:22:28 +01:00
.github/workflows	Skip service worker in dev mode and copy isle.js/isle.wasm on build	2026-01-11 20:59:55 -07:00
public	Actor editor (#24 )	2026-02-14 02:29:55 +01:00
scripts	Plant editor (#25 )	2026-02-14 18:22:28 +01:00
src	Plant editor (#25 )	2026-02-14 18:22:28 +01:00
src-sw	Migrate frontend to Svelte 5	2026-01-11 19:10:16 -07:00
.gitignore	Actor editor (#24 )	2026-02-14 02:29:55 +01:00
index.html	Improve Lighthouse LCP and accessibility scores (#23 )	2026-02-08 00:43:07 +01:00
LICENSE	Initial commit	2025-06-13 00:30:51 +02:00
package-lock.json	Add dynamic tooltip positioning using Floating UI (#18 )	2026-02-03 02:00:24 +01:00
package.json	Actor editor (#24 )	2026-02-14 02:29:55 +01:00
README.md	Actor editor (#24 )	2026-02-14 02:29:55 +01:00
svelte.config.js	Migrate frontend to Svelte 5	2026-01-11 19:10:16 -07:00
vite.config.js	Improve development mode experience	2026-01-11 21:11:32 -07:00
workbox-config.cjs	Actor editor (#24 )	2026-02-14 02:29:55 +01:00

README.md

isle.pizza Frontend

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

Requirements

Node.js

Quick Start

Clone the repository:

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

Install dependencies:
```
npm install
```
Obtain the game files (isle.js and isle.wasm) by building the Emscripten version of isle-portable, then copy them to the project root.
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
```
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.
Start the development server:
```
npm run dev
```
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:

Follow the isle-portable build instructions for the Emscripten target
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.