Skip to documentation
CranberryClock.Ideas / Systems / Design

INDEPENDENT TOOL / v0.1.0

LoomOverview

A ribbon through the clouds. A railway that follows your lead.

Spline ribbons, raised edge borders, and a shared placement frame for Three.js.

Give Loom a sequence of points. It builds a flat swept surface and optional rectangular borders, then exposes the same distance-based route to trains, props, cameras, or other host objects. Width and bank can be constants or serializable profiles. The package has no dependency on another Cranberry Forge tool, a renderer, or the DOM.

The Cloudline Railway showcase at /loom.html demonstrates a floating island loop, canyon shuttle, and elevated figure eight. Every sleeper, trestle, and train carriage uses the public sampling API. Drag to orbit, change the track controls, and export or import a recipe. The train starts paused when reduced motion is requested.

Existing tools and scope

Three's official TubeGeometry extrudes a round tube along a 3D curve. ExtrudeGeometry supports shape extrusion along an extrudePath, including broader cross-section workflows. Use those when their established shape operations fit your task. Loom focuses on an open ribbon, rectangular edge borders, serializable width/bank profiles, and a matching public placement frame.

Three's Curve documentation describes arc-length sampling, cache resolution, tangent sampling, and frame computation. Loom builds on the official curve APIs with its own transport/frame and ribbon-generation code. These primary references establish the category; no novelty or replacement claim is made.

Tests and renderer-free showcase

From the Cranberry Forge checkout:

bash
node --test tests/loom.test.mjs

The tests cover straight-strip geometry/UVs, distance spacing on unequal control-point intervals, vertical/closed frames, width/bank profiles, recipe isolation, atomic rebuilding/material ownership, malformed inputs, and procedural scene motion. tests/loom-types.ts exercises the exported declarations.

dist/loom-scene.js exports createLoomScene({ preset, options }) and LOOM_PRESETS. Presets are skyloop, switchback, and overpass. The returned object exposes group, loom, train, coaches, suggested cameraPosition/cameraTarget, configure, setPreset, update(dt, { playing, speed, reducedMotion }), and dispose. It creates only Three objects and original procedural geometry, so it can be constructed without DOM/WebGL and rendered using Three's official SVGRenderer for documentation. Offline SVG lighting differs from the live WebGL scene. This factory is a showcase file, not a package runtime dependency.

MIT © 2026 CranberryClock. See LICENSE.

View versioned source on GitHub ↗