mirror of
https://github.com/storytold/artcraft.git
synced 2026-11-07 02:21:23 +00:00
Tanish Manku
c352edd38c
First step of the editor.ts decomposition (refactor/3d-editor-cleanup).
Pulls the canvas/container DOM seam, the ResizeObserver, and the resize
cascade out of the ~1450-LOC Editor class into a standalone module.
ViewportController owns container, canvReference, canvasRenderCamReference,
the ResizeObserver, lastCanvasSize, plus the onWindowResize / observed
resize logic.
Engine fields are forwarded explicitly through the `engine` constructor
argument:
- cameras, renderer, render aspect ratio: closure-based getters that
resolve at call time
- post-processing: a single resizePostProcessing(w, h) callback rather
than three composer field getters
The single callback is deliberate. The original code creates the main
composer in _configurePostProcessing but the raw composer + custom
outline pass much later in _configurePostProcessingRaw, with the first
viewport.onWindowResize() landing between the two. Three separate
composer getters would have ViewportController peeking at fields that
don't exist yet at that first resize and silently no-op'ing via `?.`.
The callback hides that lifecycle concern inside the post-processing
module, where it belongs.
No `import type Editor`, no circular import. The dead `update*` and
`*MayReset` accessors that the original code carried as defensive
fallbacks (with self-deprecating "we should not need this" comments)
were never actually called and are dropped here. containerMayReset
stays — it has live internal callers.
Editor exposes the controller as `editor.viewport` and routes its
internal call sites through `this.viewport.<method>()`.
Net: editor.ts loses ~107 lines and one cohesive responsibility.
Frontend
This is an nx monorepo that can contain multiple apps and shared libraries.
All commands to run these projects are performed from this directory.
Install dependencies
npm install
Editor2d
Run dev server:
nx dev editor2d
artcraft
Run dev server:
nx dev artcraft
call when starting on main or a new branch:
./clean_modules
The names for @frontend and @storyteller come from the package.json file in the libs folder.
import { Login } from "@frontend/login";
import { api } from "@storyteller/api";
For shared UI components, import from @storyteller/ui-[componentname].
import { Button } from "@storyteller/ui-button";
import { Modal } from "@storyteller/ui-modal";
building:
npx nx build artcraft
npx nx build editor2d
dev:
npx nx dev artcraft
npx nx dev editor2d
# component build
1.
npx nx g @nx/react:library libs/components/toaster --import-path=@storyteller/ui-toaster --bundler=vite
npm install
2.import it first in code
3.nx sync
4.nx build
or
# frontend build
in frontend folder
% nx build -project type
% nx build artcraft
% nx dev artcraft