feat: integrate Draco compression for 3D models in backoffice

- Added support for uploading and compressing GLB models using Draco in the backoffice.
- Implemented commands for importing and re-compressing 3D models.
- Updated model resource to handle 3D model uploads and validations.
- Introduced a new script for compressing GLB files with Draco.
- Modified Vite configuration to remove GLB files from the build output.
- Updated package dependencies to include GLTF-transform libraries for handling 3D models.
- Added tests to ensure proper functionality of 3D model handling and compression.
This commit is contained in:
2026-11-01 10:35:50 +01:00
parent 24f9e59654
commit 1208187a17
32 changed files with 895 additions and 52 deletions
+14 -2
View File
@@ -62,8 +62,8 @@ Entry point is `src/js/starter.js`, loaded from `src/index.html`. Flow on load (
updates the DOM. "Add to cart" sends the same codes (`scelte`): the backend recomputes the price and ignores
any price coming from the client.
5. **`APP.Player`** (`src/js/app.js`) wraps a Three.js renderer/scene/camera (scene graph loaded from
`src/assets/app.json`, a three.js-editor-style export) plus the actual product GLB
(`src/assets/models/<sistema>/<modello.modello>`). Two players are created: `player` (visible canvas) and
`src/assets/app.json`, a three.js-editor-style export) plus the actual product GLB, loaded from
`modello.modello_url` (see "3D models" below) with a `DRACOLoader`. Two players are created: `player` (visible canvas) and
`playerOff` (offscreen, used only to render the PNG snapshot sent to the cart). Key methods: `swapModel`/
`hideModel` (toggle between pre-loaded variants in the same scene), `changeTexture`/`changeColor` (applied
per `userData.categoria` mesh tag — categories like `interno`, `esterno`, `maniglia`, `vetro`, `cerniere`),
@@ -85,6 +85,18 @@ Entry point is `src/js/starter.js`, loaded from `src/index.html`. Flow on load (
(spec: "Specifica tecnica vetri"). All of it is edited in Filament under "Configuratore".
`src/js/price_calculator.js` only wraps the API call and the grid sizes.
### 3D models
GLB files are managed by the backoffice, one per `Modello` (uploaded in Filament, "Configurazione 3D" section).
On save, `App\Support\Configuratore\Modelli3d` runs `scripts/comprimi-glb.mjs` (Node, `@gltf-transform` +
`draco3dgltf` from the root `node_modules`) and keeps two copies: the uncompressed original on the private
`local` disk (`modelli-3d/originali/...`, never served) and the Draco copy on the `public` disk
(`modelli-3d/draco/<sistema>/<codice>-<hash>.glb`), served via `GET /api/media/...` with a 1-year immutable cache.
`/api/sistemi` exposes it as `modello_url`; models without one are not shown in the configurator.
`php artisan modelli3d:importa` imports the legacy `src/assets/models` files (one-off), `modelli3d:ricomprimi`
regenerates the Draco copies from the originals. The Vite build never ships `.glb` files. In production set
`NODE_BINARY` if PHP-FPM has no `node` on its PATH.
### Data conventions
- Every 3D-visible part is tagged with `userData.categoria` in the GLB/scene so JS can show/hide/retexture it