tinyworld-island-and-planes

star 953

Use when changing the home island layout, edge dressing, undersides, autoincentive sponsor banner (now a top-left logo-adjacent DOM banner), plane/crop-duster flight paths, banner streamers, or which side of the island is "front".

jasonkneen By jasonkneen schedule Updated 6/8/2026

name: tinyworld-island-and-planes description: Use when changing the home island layout, edge dressing, undersides, autoincentive sponsor banner (now a top-left logo-adjacent DOM banner), plane/crop-duster flight paths, banner streamers, or which side of the island is "front".

Tiny World Island & Planes

Coordinate system + camera-facing side

  • The home island is centred at world origin. Top of grass = y = 0. Underside of dirt slab + inverted stepped underside extends down from there.
  • GRID (default 8, max 20, ranges from HOME_GRID_MIN to HOME_GRID_MAX) × TILE (=1) sets the edge length. Half-width = (GRID * TILE) / 2.
  • DIRT_H = 0.55 — visible dirt block height.
  • Default camera: DEFAULT_AZIMUTH = π * 0.32, DEFAULT_POLAR = π * 0.30 → camera sits in the +X +Z quadrant looking back at origin. The +Z face is the "front" of the island (most camera-facing side).

buildHomeBorder() flow

Defined ~line 16340. Rebuilds the island's undersides and edge dressing every time the home grid changes:

clear homeBorderGroup children
vbox(... underside slab ...)
voxelInvertedSteppedRoof(... cascading underside ...)
addIslandRocketEngines(homeBorderGroup)
addIslandEdgeDressing(homeBorderGroup)    // tufts, rocks, dirt accents
(island front drape removed — autoincentive now a top-left logo-adjacent DOM banner)
prepareHomeBorderForRender(homeBorderGroup)
buildDistantWorlds()
buildUnderIslandClouds() (if defined)

Anything you add that should live on the island should be appended inside buildHomeBorder() so it rebuilds correctly when the user changes #render-home-grid (the home board size selector).

Some of the round underside pipes emit a faint output from their outer (side-facing) end — clear water, murky brown water, or steam — via the pipe-emitter system in 23-particles-clouds.js (registerPipeEmitter / updatePipeEmitters, ticked next to updateSmoke). addIslandUtilityUnderside (13-distant-dressing-ghost.js) registers ~32% of pipe runs (split water/murky/steam) at their end; buildHomeBorder calls clearPipeEmitters first. Emitter coords are local to homeBorderGroup; particles live in xrWorldRoot, are capped at 140, and only spawn when camera.position.y < 4 (underside in view). Water/murky fall under gravity; steam rises and expands.

The home island underside (slab + voxelInvertedSteppedRoof), the island edges (addIslandSideBacking), and the underside greebles (addIslandUtilityUnderside trays/clamps) now honour the Voxel bevel setting (renderVoxelBevel): their vbox calls no longer pass noBevel/skip* (which would route to the un-beveled getOpenBoxGeometry). voxelInvertedSteppedRoof is shared, so editable islands and the new-island stamp underside bevel too. Cost note: at max bevel (0.06) the merged homeBorder geometry grows ~13× (the many tiny greebles each round), so keep bevel modest. The distant ghost-island dressing (tiny far preview islands) intentionally stays noBevel for perf.

Island shell materials (M.boardSide, M.boardSideEdge, M.islandUnder, M.islandUnderD) opt into the world-UV shader pass in 04-textures.js. Grass tile risers use M.boardSide and should read as dirt/soil directly under the grass cap, not rock; keep that material on the soil-side texture family. The dedicated strata side backing (M.boardSideEdge) can still show deeper soil-to-rock banding lower down, while underside materials use textures/island-underside-voxel.png (texIslandUndersideVoxel) so the bottom reads as larger dark beveled voxel blocks; keep replacement shell art seamless and power-of-two because Three.js repeats it with mipmaps. The shader pass darkens a coarse horizontal/vertical side grid and lightly modulates each block/underside cell in the fragment shader. It uses world position/normal varyings, so the large merged side slabs read as chunky voxel blocks without adding geometry or draw calls. islandShellMaterial() in 03-geometry-materials.js copies Lambert onBeforeCompile hooks and explicitly preserves ShaderMaterial uniforms/source so the side-backing clone keeps the same coarse grid/strata shader instead of falling back to a black shell.

Island edge strata is shader-driven on the side backing only: addIslandSideBacking uses the dedicated M.boardSideEdge shader material for lower dirt/rock backing. Do not restore the old continuous green grass-cap carrier at the top edge: it reads as a thin floating strip around the island in Build/tilt-down views. Per-cell terrain and mesh-terrain side walls own the top edge; the backing should stay darker/lower behind greebles. Keep the four backing faces widened by the edge outset so corners meet cleanly, and keep hidden faces stripped with skipTop / skipBottom / interior-side skips. Keep the side-carrier meshes out of static base merging so the shader stays inspectable; do not add separate overlay panels or per-tile decal geometry for this effect. The dirt/brown band in island-side-strata-gpt.png should match the darker soil-side/M.dirtRich greeble palette, not bright orange. Keep the band near the dark brown family used by side greeble blocks so the bitmap and geometry read as one material.

Underside pipes and water details are material-driven: M.utilityPipe, M.utilityPipeD, and M.utilityClamp use the internal pipe-metal canvas texture; M.waterFoam and M.waterfallFoamPuff use the internal water-froth canvas texture. Keep these procedural unless the user asks for a specific bitmap, because they apply to many tiny utility meshes and particles.

Editable-island LOD + whole-island select/delete

  • Two gates decide an editable island's LOD: a distance gate (editableIslandBaseDesiredLod, full within max(40, span*5.2)) and a count budget (editableIslandFullLodBudget, now +8: all full up to 14 islands, then 12/11/10). Both were widened so a placed cluster of ~8 islands keeps its real base + per-cell surface instead of dropping to the flat proxyGroup (which is what "island without a base / different surface" was).
  • Click an island's side (no cell/object there) with the Select tool to select the WHOLE island: pickEditableIslandBody (18-scene-pick-xr.js) walks up to userData.editableIslandId (excludes home). It outlines the island (setIslandSelectionOutline, a box-edges LineSegments child of island.group so it follows move/rotate) and raises the move gizmo.
  • Delete/Backspace on a selected island (no cell selection) calls removeEditableIsland — undoable, because the world-history snapshot includes serializeEditableIslands(). It clears the island's board cells, moorings anchored to it, registries, and selection.

Island placement: 4-side holograms

With the Island tool active, hovering an island shows a blank-island hologram on each of its 4 free cardinal sides at once (37-island-placement-holos.js, reuses islandPlacementSlots(anchor).slice(0,4) + makeBlankIsland + makeGhostHoloMaterial). Occupied sides and the home origin are filtered out ("minus blocked by anything"). Hovering a hologram highlights it (uBase 0.10->0.36, brighter blue, slight scale-up) via a per-frame raycast in updateIslandPlacementHolos(x,y); clicking a hologram places there. GOTCHA: hover-test the holos first and keep the anchor stickypickTile ignores the holos, so recomputing the anchor while hovering a hologram flips it to whatever (home/other island) sits behind it and rebuilds the holos out from under the cursor (they "disappear" on click). Only re-anchor when hovering a different island; keep holos over empty space (applyToolToCell checks islandPlacementHoloHoveredSlot() first, before any island-select). selectTool clears the holos when switching away; the holo shader uTime ticks via tickIslandPlacementHolos. The single snap-to-slot hologram path is bypassed for the Island tool. GOTCHA: when cloning the ghost-outline hull, collect mesh nodes before o.add(hull) — adding during traverse recurses into the new hull forever (stack overflow).

Newly placed editable islands warp in instead of popping into place. The effect lives in 14-editable-islands-moorings.js: startEditableIslandWarpArrival() starts a short blue-white streak/tunnel + arrival flash, and tickEditableIslandWarpArrivals(dt) runs after updateEditableIslandLods() so it can override LOD visibility during the arrival. Default creation triggers the effect, while restored/imported/stress-demo islands with skipSave: true do not; use warpIn: true explicitly for future multiplayer join arrivals. The final saved transform remains island.positionX/Y/Z + rotationY; the warp only moves/scales the render group temporarily.

The home island is not movable: its editable surface lives in the shared world grid (worldGroup, picked by logical gx/gz), while only homeBorderGroup (the base) is its transform group — so dragging it would shift the base away from the locked surface. updateTransformGizmo (12-selection-tool.js) refuses to bind the move gizmo when selectedEditableIsland().__home is set (selecting a home engine sets selectedEditableIslandId = 'home', which previously let the gizmo grab it). Sky/editable islands stay movable. Making the home island truly relocatable as one piece would require re-parenting the home cells into a movable group and routing their picking through that transform (as editable islands do).

Island engines (home + editable, userData.editableIslandEngineId) can only be selected from underneath: pickEditableIslandEngine (18-scene-pick-xr.js) early-returns null when camera.position.y >= 0. Otherwise a pick ray from above passes through the board and grabs the engine hanging behind it. Mirrors pickTile's "refuse picks from below the surface" convention, inverted.

Home-island rocket engines keep their chunky voxel casing, but the animated jet plume is a small set of static or simply X-flipped shader sheets. Do not rebuild it as many per-layer flame cubes; the sheet approach keeps the underside readable while staying cheap for large-island scenes. Keep older voxel object builders as inactive legacy helpers rather than deleting them; they may be useful again for alternate engine styles or detail settings. The jet plume sheets are underside-only effects: tickIslandRocketEngines hides rocketPlumeSheet meshes when the camera is above the engine/island surface gate, and their compact sheet dimensions are guarded by tools/check.js. Do not let them billboard through the board or become a surface-level white/cyan cloud in normal build/play views.

Autoincentive sponsor banner

The PNG/JPG ships inline as AUTOINCENTIVE_BANNER_DATA_URL (~41 KB base64 JPEG) so there's no extra HTTP. Same data URL feeds:

  1. A fixed DOM banner next to the top-left Tiny World wordmark (assets/twlogo-wordmark.png, logo-only crop with the island removed) on wide screens, dropping below the logo at medium widths and hiding on phone widths (<a id="brand-banner"><img id="brand-banner-img">), src set by the applyAutoincentiveSponsorLogo IIFE. Clickable, opens https://x.com/Autoincentiv3. Hidden in showcase + XR via .brand-banner rules in styles/tiny-world.css.
  2. The sponsor logo in the Workspace settings panel (<img id="sponsor-logo-autoincentive">, populated by the same IIFE).

The old 3D island front-facing drape (buildIslandFrontBanner / tickIslandBanners, a flapping cloth mesh on the +Z side) has been removed from the scene: the call in buildHomeBorder() (13-distant-dressing-ghost.js) is gone, so the functions remain defined but inert (legacy). tickIslandBanners still ticks but is a no-op while islandBannerEntry stays null.

If the user changes art, swap the data URL and the 2.5:1 aspect — width fits ~`GRID * 0.7`.

Plane / crop-duster system

Defined in the crop duster route / state section (~line 26200).

  • 3-plane pool (planes[]), shown in formations or solo.
  • Persisted setting tinyworld:render:planesEnabled controls the whole system and defaults off for now. When off, the GLB/textures are not loaded and hidden banners/crop-dust particles are cleared.
  • Two run kinds chosen randomly each cycle:
    • startDustingRun() — uses planDustingCurve() to sweep over crop cells.
    • startBannerRun() — uses planBannerCurve() to fly behind the island so the towed text banner reads against the sky.
  • planBannerCurve() places the path at target.z - (GRID * 0.5) - (GRID * 2) — i.e. ~2 island lengths behind the back edge. Altitude is Math.max(renderCloudHeight + 0.2, FLIGHT_CRUISE_ALT - 1.6) — a touch lower than the dusting cruise altitude.
  • Engine sound is jet/rocket — use foley-rocket-engines-1..4, NOT foley-propellers-* or large-prop-engine-* (the model is a jet).

The towed banner cloth uses updatePlaneBannerFlap (per-vertex sine wave travelling along the X axis). Banner messages come from BANNER_MESSAGES.

When changing layout

  • "Front" side of island = +Z. North/South/East/West correspond to ±X / ±Z; do not assume Y-up screen coordinates.
  • The new-island tool creates an editable duplicate island board, not a cell object. It keeps its own logical board coordinates so normal tools keep using setCell(), while the island group handles X/Y/Z positioning and Y rotation through the gizmo. Do not expose scale for island-board transforms.
  • New editable islands should not seed every default grass cell through setCell(). Keep default grass virtual, add one pickable default-surface mesh for the board, and materialize sparse per-cell meshes only after the user edits a cell.
  • Duplicate island undersides use static voxel lift engines ported from voxel_lift_engine.html: propellers face downward and the thrust/plume/glow system remains off. Do not register these with islandRocketFlames or islandRocketEngines.
  • For duplicate-island lift engines, the engine wrapper rotates local axes downward. Keep propeller local X/Y offsets at 0 so it stays centred on the visible lift shaft; use local Z (currently EDITABLE_ISLAND_PROP_LOCAL_Z = -2.84) for the lower shaft mount, and keep the short non-spinning spindle sleeve at EDITABLE_ISLAND_PROP_SPINDLE_LINK_Z so the propeller visibly connects to the shaft. Keep the legacy large outer hub cap and old two-cube hub blocks behind opt-in flags; the default propeller should not show block lumps on top of the shader/blur disc. High-RPM readability comes from the shared dark shader blur/strobe disc, while the voxel blade groups are a startup/slow-spin visual.
  • Duplicate island lift engines are island attachments, not board cells. Persist their engines state on the island record, stamp engine meshes with editableIslandEngineId for raycast selection, and tick their propellers from the central animation loop.
  • Mooring cables are point-to-point world decorations, not board cells. Store only anchor records in moorings (scope: home|island, optional islandId, and local {x,y,z}), rebuild their TubeGeometry under the non-pickable mooringGroup, and include them in undo/export/save state. When placing a cable, raycast exact surface points rather than pickTile() so underside picks work, and reject routes that pass through registered propeller, jet engine, or rocket plume hazard spheres.
  • Mooring anchors are tied to the current board/island surface topology. Clear them with clearMooringCables() on home-grid changes, starter-scene resets, and demo paths that replace islands; imports can then restore valid saved cables with replaceMooringCables() after islands have been recreated.
  • Number duplicate-island engine slots around the island. Slots 1 and 3 spin clockwise; slots 2 and 4 spin anticlockwise, so diagonal props match while adjacent props counter-rotate.
  • Duplicate island bases should reuse the home-island greeble layers: addIslandUtilityUnderside() for underside pipes/cables/boxes and addIslandEdgeDressing() for grassy/dirt/rock edge chunks.
  • Any new edge dressing must be added inside addIslandEdgeDressing() (per the existing per-edge loop with cellRand noise) so it stays consistent across all four sides.
  • Anything anchored to the island that animates must be ticked from the central animation loop (call sites near updateCropDuster(dt) in renderer.setAnimationLoop(animate)).
  • Duplicate islands use LOD: selected/near islands show full base/content, mid/far islands show cheap proxy slabs, and hidden islands skip content, underside detail, and engine propeller ticks. Preserve this before adding new per-island animation or decoration.

Validation

After island/plane changes:

  • node tools/check.js
  • Visually check at default 8×8 grid and after toggling to 20×20 — sizes rebuild the island.
  • Confirm planes fly behind the island, banner stays readable against the sky, and engine sound (if positional audio active) pans correctly L↔R as the plane crosses the camera.

Mooring "Connect" cables — styles + interaction

  • The infra tool is labelled "Connect" (id stays mooring, t.mooring).
  • Each placed cable carries a style in MOORING_STYLES (14-editable-islands-moorings.js): power (amber), water (blue), waste (green), data (purple), mooring (default dark). style is normalized (normalizeMooringStyleId), persisted via serializeMooringCables, and drives the tube material (mooringStyleMaterial). Change it with the global setMooringCableStyle(id, style) (rebuilds + saveState).
  • Cables stay noPointerPick for the placement raycast. 36-mooring-interaction.js runs its own raycast against mooringGroup (only while the Select tool is active): hover swaps the cable's meshes to mooringHoverMaterial (blue); a click opens a radial (.radial-menu.mooring-radial, reuses radial CSS) to pick the style. While that radial is open a full-screen .mooring-radial-backdrop (z 45, below the buttons at z 46) preventDefault+ stopPropagations every pointer/wheel event and closes on outside click, so canvas pan/orbit cannot fire and the type buttons stay clickable. (The menu container is pointer-events:none, so without the backdrop a miss between buttons falls through to the canvas and pans.) Verify pickability with 3D math (project tube vertices → raycast mooringGroup), not screenshots.
Install via CLI
npx skills add https://github.com/jasonkneen/tiny-world-builder --skill tinyworld-island-and-planes
Repository Details
star Stars 953
call_split Forks 133
navigation Branch main
article Path SKILL.md
More from Creator