wuic-framework-lib 1.3.2 → 1.5.0

package/fesm2022/wuic-framework-lib-scene3d-viewer.component-imoV3HOs.mjs

@@ -0,0 +1,999 @@
+import * as i0 from '@angular/core';
+import { Input, ViewChild, ChangeDetectionStrategy, Component } from '@angular/core';
+import * as THREE from 'three';
+import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
+import { W as WtoolboxService, f as DataProviderService, M as MetadataProviderService } from './wuic-framework-lib-wuic-framework-lib-3TZ-j-yL.mjs';
+import { L as deserializeScene, i as isWebGpuSupported, n as createScene3dRenderer, o as WUIC_SHADER_EFFECT_KEY, s as parseShaderEffect, u as buildEffectNodeMaterial, v as buildEffectShaderMaterial, w as getMeshRepeaterConfig, B as regenerateRepeater, x as WUIC_REPEATER_CHILD, C as CarouselController, b as defaultCarouselConfig, y as buildUploadTextureResolver, p as makeTextSpriteMesh, z as applyRepeaterTextureTo, E as createPhysicsWorld, D as getPhysicsDef, I as WUIC_BINDING_KEY, H as carouselArrowDir } from './wuic-framework-lib-scene3d-shader-effect-CQLWkuh1.mjs';
+import * as i1 from '@angular/router';
+
+/**
+ * Scene3D Viewer (F7) — runtime read-only della scena 3D autorata nel
+ * Scene3D Designer. Specchio "sola-lettura" di `Scene3dDesignerComponent`:
+ * stesso stack three.js (WebGLRenderer high-performance + OrbitControls +
+ * luci), stessa deserializzazione via {@link deserializeScene}, MA senza
+ * gizmo/palette/property-panel — solo visualizzazione + risoluzione binding.
+ *
+ * Viene caricato SOLO tramite `Scene3dViewerRouteComponent` (lazy) così l'import
+ * di three.js resta in un chunk code-split (mai importato dal barrel o dal route
+ * wrapper) — stesso pattern del designer.
+ *
+ * Runtime "augment": per ogni oggetto con `userData[WUIC_BINDING_KEY]` risolve i
+ * dati della rotta bindata via `DataProviderService.selectByRoute(route)` (il
+ * data-path del framework, lo stesso che alimenta la `<wuic-list-grid>` /
+ * `DataSourceComponent`), legge le colonne mappate da `fieldMap` e applica
+ * `color`/`visible` all'`Object3D`. Click su un oggetto bindato -> apre la CRUD
+ * della rotta con la stessa navigazione router del designer (F5).
+ */
+class Scene3dViewerComponent {
+    dataSrv;
+    metaSrv;
+    route;
+    router;
+    cdr;
+    zone;
+    viewportContainer;
+    /**
+     * Chiave della scena da caricare. Se non passata come input, viene letta dal
+     * route param `scene_key` (mirror del `graph-id` del workflow-runner).
+     */
+    sceneKey = '';
+    /**
+     * Camera della scena da usare come punto di vista (uuid o `name` di una
+     * PerspectiveCamera autorata). Se non passata come input, viene letta dal
+     * route param `camera_id`. Vuota = prima camera della scena; nessuna camera
+     * in scena = viewpoint di default con OrbitControls.
+     */
+    cameraId = '';
+    /** true finche' la scena non e' stata caricata/parsata; pilota lo stato "loading" del template. */
+    loading = true;
+    /** Messaggio d'errore user-facing (scena non trovata / json invalido); '' = nessun errore. */
+    errorMessage = '';
+    // --- three.js runtime (mai serializzati) ---
+    renderer;
+    scene;
+    camera;
+    /** Camera AUTORATA scelta come punto di vista (null = default orbit). */
+    viewCamera;
+    /** Luci di viewport di default (pilotate da `viewport.defaultLightsEnabled` del payload). */
+    defaultLights = [];
+    orbit;
+    /** Gruppo che contiene SOLO il contenuto autorato (deserializzato). */
+    contentGroup;
+    raycaster = new THREE.Raycaster();
+    pointer = new THREE.Vector2();
+    animationFrameId = null;
+    resizeObserver;
+    /** Iter2: mixer per nodo animato (asset glTF/GLB con clip) — runtime-only, auto-play in loop. */
+    animMixers = [];
+    /** Clock che pilota l'avanzamento dei mixer nel render loop. */
+    animClock = new THREE.Clock();
+    /** ShaderMaterial (custom GLSL autorati) con uniform uTime da animare. */
+    shaderMaterials = new Set();
+    shaderClock = new THREE.Clock();
+    /** Fisica runtime (autoplay se la scena e' salvata con physics.autoPlayInViewer). */
+    physicsWorld;
+    /** true quando la view e' montata: consente al load async di innescare il build della scena. */
+    viewReady = false;
+    /** Payload gia' caricato ma in attesa che la view sia pronta (race load-vs-view). */
+    pendingPayload;
+    // --- bound listener (per removeEventListener in ngOnDestroy) ---
+    onCanvasClick = (event) => this.handleClick(event);
+    constructor(dataSrv, metaSrv, route, router, cdr, zone) {
+        this.dataSrv = dataSrv;
+        this.metaSrv = metaSrv;
+        this.route = route;
+        this.router = router;
+        this.cdr = cdr;
+        this.zone = zone;
+    }
+    /** Sub reattiva ai route param (unsubscribe in ngOnDestroy). */
+    routeParamSub;
+    ngOnInit() {
+        // Input ha priorita' (uso embedded): nessuna dipendenza dai route param.
+        if (String(this.sceneKey || '').trim()) {
+            void this.loadSceneByKey();
+            return;
+        }
+        // Route param REATTIVI: navigando tra scene diverse
+        // (#/scene3d_viewer/A -> #/scene3d_viewer/B) Angular RIUSA questo
+        // componente; il solo snapshot mostrerebbe per sempre la prima scena
+        // (bug scoperto dal worker thumbnail: 27 catture identiche).
+        const inputCam = String(this.cameraId || '').trim();
+        this.routeParamSub = this.route.paramMap.subscribe((params) => {
+            const nextKey = String(params.get('scene_key') || params.get('sceneKey') || '').trim();
+            const nextCam = inputCam || String(params.get('camera_id') || params.get('cameraId') || '').trim();
+            const changed = nextKey !== String(this.sceneKey || '') || nextCam !== String(this.cameraId || '');
+            this.sceneKey = nextKey;
+            this.cameraId = nextCam;
+            if (nextKey && changed) {
+                this.loading = true;
+                this.errorMessage = '';
+                this.cdr.markForCheck();
+                void this.loadSceneByKey();
+            }
+        });
+    }
+    ngAfterViewInit() {
+        this.viewReady = true;
+        this.initThree();
+        // Se il payload e' gia' arrivato prima del mount, costruiscilo ora.
+        if (this.pendingPayload) {
+            const payload = this.pendingPayload;
+            this.pendingPayload = undefined;
+            void this.buildScene(payload);
+        }
+    }
+    ngOnDestroy() {
+        this.routeParamSub?.unsubscribe();
+        this.disposeThree();
+    }
+    // ===========================================================================
+    // Load scena (read-only)
+    // ===========================================================================
+    /**
+     * Carica la scena per `sceneKey` via `DataProviderService.loadScene3d`,
+     * parsa `scene_json` e la costruisce (o la mette in pending se la view non e'
+     * ancora montata). Mirror sola-lettura di `Scene3dDesignerComponent.loadScene`.
+     */
+    async loadSceneByKey() {
+        const key = String(this.sceneKey || '').trim();
+        if (!key) {
+            this.loading = false;
+            this.errorMessage = 'scene_key mancante';
+            this.cdr.markForCheck();
+            return;
+        }
+        this.loading = true;
+        this.errorMessage = '';
+        this.cdr.markForCheck();
+        try {
+            const raw = await this.dataSrv.loadScene3d({ user_id: '', scene_key: key });
+            const record = Array.isArray(raw) ? raw[0] : raw;
+            const sceneJson = this.pickFirstDefined(record, ['scene_json', 'sceneJson']);
+            if (sceneJson == null) {
+                this.loading = false;
+                this.errorMessage = 'Scena non trovata';
+                this.cdr.markForCheck();
+                return;
+            }
+            const parsed = typeof sceneJson === 'string' ? JSON.parse(sceneJson) : sceneJson;
+            if (this.viewReady) {
+                await this.buildScene(parsed);
+            }
+            else {
+                // View non ancora montata: costruisci in ngAfterViewInit.
+                this.pendingPayload = parsed;
+            }
+        }
+        catch (err) {
+            this.loading = false;
+            this.errorMessage = 'Errore nel caricamento della scena';
+            this.cdr.markForCheck();
+        }
+    }
+    // ===========================================================================
+    // three.js bootstrap / teardown (read-only: NO gizmo, NO palette)
+    // ===========================================================================
+    initThree() {
+        const container = this.viewportContainer?.nativeElement;
+        if (!container) {
+            return;
+        }
+        const width = Math.max(1, container.clientWidth);
+        const height = Math.max(1, container.clientHeight);
+        const scene = new THREE.Scene();
+        scene.background = new THREE.Color(0x1e1e28);
+        this.scene = scene;
+        const camera = new THREE.PerspectiveCamera(60, width / height, 0.1, 2000);
+        camera.position.set(6, 6, 10);
+        camera.lookAt(0, 0, 0);
+        this.camera = camera;
+        const renderer = new THREE.WebGLRenderer({ powerPreference: 'high-performance', antialias: true });
+        renderer.setPixelRatio(Math.min(globalThis.devicePixelRatio || 1, 2));
+        renderer.setSize(width, height);
+        // Fedelta' col designer: le luci autorate hanno castShadow -> shadow map attiva
+        // (il payload puo' disattivarla via viewport.shadowsEnabled).
+        renderer.shadowMap.enabled = true;
+        renderer.shadowMap.type = THREE.PCFSoftShadowMap;
+        container.appendChild(renderer.domElement);
+        this.renderer = renderer;
+        // Luci di viewport (read-only: come nel designer ma senza il flag transient,
+        // qui nulla viene mai serializzato). Intensita' tenue come nel designer.
+        const ambient = new THREE.AmbientLight(0xffffff, 0.35);
+        scene.add(ambient);
+        const directional = new THREE.DirectionalLight(0xffffff, 0.4);
+        directional.position.set(5, 10, 7);
+        scene.add(directional);
+        this.defaultLights = [ambient, directional];
+        // OrbitControls: sola navigazione camera (NO TransformControls / gizmo).
+        const orbit = new OrbitControls(camera, renderer.domElement);
+        orbit.enableDamping = true;
+        orbit.dampingFactor = 0.08;
+        this.orbit = orbit;
+        // Click -> apri CRUD della rotta bindata (F5 pattern), fuori da Angular.
+        this.zone.runOutsideAngular(() => {
+            renderer.domElement.addEventListener('click', this.onCanvasClick);
+        });
+        this.resizeObserver = new ResizeObserver(() => this.handleResize());
+        this.resizeObserver.observe(container);
+        this.zone.runOutsideAngular(() => this.startRenderLoop());
+    }
+    startRenderLoop() {
+        const tick = () => {
+            this.animationFrameId = globalThis.requestAnimationFrame(tick);
+            this.orbit?.update();
+            // Iter2: avanza le animazioni auto-play (mixer per nodo animato).
+            const delta = this.animClock.getDelta();
+            for (const mixer of this.animMixers) {
+                mixer.update(delta);
+            }
+            // Fisica autoplay: step a timestep fisso + sync dei corpi sulle mesh.
+            if (this.physicsWorld) {
+                this.physicsWorld.step(delta);
+            }
+            // Carousel: anima lo scroll verso il target e ridispone gli item sull'arco.
+            for (const carousel of this.carousels) {
+                carousel.update(delta);
+            }
+            // Shader custom autorati: avanza la uniform uTime.
+            if (this.shaderMaterials.size > 0) {
+                const elapsed = this.shaderClock.getElapsedTime();
+                this.shaderMaterials.forEach((m) => { if (m.uniforms?.['uTime']) {
+                    m.uniforms['uTime'].value = elapsed;
+                } });
+            }
+            if (this.renderer && this.scene && this.camera) {
+                this.renderer.render(this.scene, this.viewCamera || this.camera);
+            }
+        };
+        this.animationFrameId = globalThis.requestAnimationFrame(tick);
+    }
+    disposeThree() {
+        if (this.animationFrameId !== null) {
+            globalThis.cancelAnimationFrame(this.animationFrameId);
+            this.animationFrameId = null;
+        }
+        this.resizeObserver?.disconnect();
+        this.resizeObserver = undefined;
+        const canvas = this.renderer?.domElement;
+        if (canvas) {
+            canvas.removeEventListener('click', this.onCanvasClick);
+        }
+        this.orbit?.dispose();
+        this.orbit = undefined;
+        // Pausa/rilascio sicuro dei mixer PRIMA di smontare il contenuto.
+        this.disposeAnimationMixers();
+        this.physicsWorld?.dispose();
+        this.physicsWorld = undefined;
+        if (this.contentGroup) {
+            this.disposeObjectTree(this.contentGroup);
+        }
+        this.renderer?.dispose();
+        if (canvas?.parentElement) {
+            canvas.parentElement.removeChild(canvas);
+        }
+        this.renderer = undefined;
+        this.scene = undefined;
+        this.camera = undefined;
+        this.contentGroup = undefined;
+    }
+    /** Rilascia geometrie/materiali di un sotto-albero per evitare leak GPU. */
+    disposeObjectTree(root) {
+        root.traverse((obj) => {
+            const mesh = obj;
+            if (mesh.geometry && typeof mesh.geometry.dispose === 'function') {
+                mesh.geometry.dispose();
+            }
+            const material = mesh.material;
+            if (Array.isArray(material)) {
+                material.forEach((m) => m?.dispose?.());
+            }
+            else if (material && typeof material.dispose === 'function') {
+                material.dispose();
+            }
+        });
+    }
+    handleResize() {
+        const container = this.viewportContainer?.nativeElement;
+        if (!container || !this.renderer || !this.camera) {
+            return;
+        }
+        const width = Math.max(1, container.clientWidth);
+        const height = Math.max(1, container.clientHeight);
+        this.camera.aspect = width / height;
+        this.camera.updateProjectionMatrix();
+        if (this.viewCamera) {
+            this.viewCamera.aspect = width / height;
+            this.viewCamera.updateProjectionMatrix();
+        }
+        this.renderer.setSize(width, height);
+    }
+    // ===========================================================================
+    // Costruzione scena + risoluzione binding (runtime augment)
+    // ===========================================================================
+    /**
+     * Deserializza il payload, lo aggancia alla scena e risolve i binding.
+     * Mai lancia nel render path: ogni errore di binding e' isolato.
+     */
+    async buildScene(payload) {
+        if (!this.scene) {
+            return;
+        }
+        let root;
+        try {
+            root = deserializeScene(payload);
+        }
+        catch (err) {
+            this.loading = false;
+            this.errorMessage = 'Scena non valida';
+            this.cdr.markForCheck();
+            return;
+        }
+        // Rimpiazza l'eventuale contenuto precedente.
+        if (this.contentGroup) {
+            this.scene.remove(this.contentGroup);
+            this.disposeObjectTree(this.contentGroup);
+        }
+        root.name = root.name || 'wuicSceneContent';
+        this.scene.add(root);
+        this.contentGroup = root;
+        // Stato di viewport salvato con la scena (luci default / ombre).
+        this.applyViewportSettings(payload.viewport);
+        // Punto di vista: camera autorata (per id/nome o la prima), se presente.
+        this.applySceneCamera(root);
+        // Iter2: auto-play (loop) delle clip presenti nel contenuto deserializzato.
+        this.setupAnimationPlayback(root);
+        // Shader custom ripristinati dal payload: riaggancia l'animazione di uTime.
+        this.shaderMaterials.clear();
+        root.traverse((obj) => {
+            const material = obj.material;
+            const single = Array.isArray(material) ? material[0] : material;
+            if (single?.isShaderMaterial && single.uniforms?.uTime) {
+                this.shaderMaterials.add(single);
+            }
+        });
+        // Effetti JSON: il materiale serializzato e' un placeholder -> rigenera
+        // dal JSON in userData per il backend corrente (di nuovo dopo l'eventuale
+        // upgrade WebGPU asincrono innescato da applyViewportSettings).
+        void this.regenerateShaderEffects(root);
+        this.loading = false;
+        this.cdr.markForCheck();
+        // Mesh Repeater: figlie non persistite -> rigenera dai dati (non blocca il render).
+        void this.setupRepeaters(root);
+        // Fisica autoplay (se la scena la persiste): lazy, non blocca il primo render.
+        void this.setupPhysicsAutoplay(payload, root);
+        // Risoluzione binding: NON blocca il primo render (la scena e' gia' visibile).
+        void this.resolveBindings(root);
+    }
+    /**
+     * Applica i toggle di viewport persistiti col save del designer: luci default
+     * on/off e shadow map on/off. "Guide" non esiste nel viewer (nessun helper).
+     * No-op sui campi assenti (scene salvate prima della feature).
+     */
+    applyViewportSettings(settings) {
+        if (!settings || typeof settings !== 'object') {
+            return;
+        }
+        if (typeof settings.defaultLightsEnabled === 'boolean') {
+            for (const light of this.defaultLights) {
+                light.visible = settings.defaultLightsEnabled;
+            }
+        }
+        if (this.renderer && typeof settings.shadowsEnabled === 'boolean') {
+            this.renderer.shadowMap.enabled = settings.shadowsEnabled;
+        }
+        // Scena salvata col renderer WebGPU: upgrade del renderer (chunk lazy).
+        // Se WebGPU non e' disponibile il viewer resta su WebGL (fedele comunque).
+        if (settings.rendererMode === 'webgpu' && isWebGpuSupported()) {
+            void this.upgradeRendererToWebGpu();
+        }
+    }
+    /**
+     * Sostituisce il WebGLRenderer col WebGPURenderer (scena/camera preservate):
+     * usato quando `viewport.rendererMode === 'webgpu'` nel payload. Gli
+     * ShaderMaterial GLSL autorati non sono supportati dal renderer WebGPU e
+     * vengono rimpiazzati da un materiale standard neutro (il designer mostra
+     * lo stesso fallback in modalita' WebGPU).
+     */
+    async upgradeRendererToWebGpu() {
+        const container = this.viewportContainer?.nativeElement;
+        const old = this.renderer;
+        if (!container || !old) {
+            return;
+        }
+        this.replaceCustomShadersWithFallback();
+        const oldCanvas = old.domElement;
+        oldCanvas.removeEventListener('click', this.onCanvasClick);
+        this.orbit?.dispose();
+        this.orbit = undefined;
+        const shadowsEnabled = old.shadowMap.enabled;
+        old.dispose();
+        oldCanvas.parentElement?.removeChild(oldCanvas);
+        this.renderer = undefined;
+        const { renderer } = await createScene3dRenderer('webgpu', {
+            width: container.clientWidth,
+            height: container.clientHeight,
+            shadowsEnabled
+        });
+        container.appendChild(renderer.domElement);
+        // Effetti JSON ricompilati come node-material PRIMA di attivare il nuovo
+        // renderer (this.renderer ancora undefined -> il loop salta i frame).
+        this.rendererKind = 'webgpu';
+        if (this.contentGroup) {
+            await this.regenerateShaderEffects(this.contentGroup);
+        }
+        this.renderer = renderer;
+        const orbit = new OrbitControls(this.camera, renderer.domElement);
+        orbit.enableDamping = true;
+        orbit.dampingFactor = 0.08;
+        // Con una camera autorata come punto di vista l'orbit resta disabilitato.
+        orbit.enabled = !this.viewCamera;
+        this.orbit = orbit;
+        this.zone.runOutsideAngular(() => {
+            renderer.domElement.addEventListener('click', this.onCanvasClick);
+        });
+    }
+    /** ShaderMaterial GLSL -> materiale standard neutro (WebGPU non li compila). */
+    replaceCustomShadersWithFallback() {
+        this.shaderMaterials.clear();
+        this.scene?.traverse((obj) => {
+            const mesh = obj;
+            const single = Array.isArray(mesh.material) ? mesh.material[0] : mesh.material;
+            // Le mesh con effetto JSON non degradano: vengono rigenerate come node-material.
+            if (mesh.isMesh && single?.isShaderMaterial && !mesh.userData?.[WUIC_SHADER_EFFECT_KEY]) {
+                mesh.material = new THREE.MeshStandardMaterial({ color: 0x9aa4b0, metalness: 0.1, roughness: 0.75 });
+            }
+        });
+    }
+    /** Percorso renderer attivo per la compilazione degli effetti JSON. */
+    rendererKind = 'webgl';
+    /**
+     * Rigenera i materiali delle mesh con effetto JSON (`userData.wuicShaderEffect`)
+     * per il backend corrente: GLSL (uTime nel loop) o node-material TSL.
+     */
+    async regenerateShaderEffects(root) {
+        const targets = [];
+        root.traverse((obj) => {
+            const mesh = obj;
+            const effect = mesh.isMesh ? parseShaderEffect(mesh.userData?.[WUIC_SHADER_EFFECT_KEY]) : null;
+            if (effect) {
+                targets.push({ mesh, effect });
+            }
+        });
+        if (targets.length === 0) {
+            return;
+        }
+        const webgpu = this.rendererKind === 'webgpu' ? await import('three/webgpu') : null;
+        for (const { mesh, effect } of targets) {
+            const current = Array.isArray(mesh.material) ? mesh.material[0] : mesh.material;
+            if (current?.isShaderMaterial) {
+                this.shaderMaterials.delete(current);
+            }
+            const material = webgpu ? buildEffectNodeMaterial(effect, webgpu) : buildEffectShaderMaterial(effect);
+            mesh.material = material;
+            if (material.isShaderMaterial && material.uniforms?.['uTime']) {
+                this.shaderMaterials.add(material);
+            }
+        }
+    }
+    /**
+     * Sceglie la camera-punto-di-vista tra le PerspectiveCamera autorate nella
+     * scena (traverse: anche dentro i gruppi):
+     * - nessuna camera -> viewpoint di default con OrbitControls (design-free);
+     * - `cameraId` valorizzato -> match per `uuid` o `name` (case-insensitive),
+     *   con fallback alla prima camera se non trovato (warn in console);
+     * - altrimenti -> prima camera trovata.
+     * Con una camera autorata l'orbit viene disabilitato (inquadratura fissa).
+     */
+    applySceneCamera(root) {
+        const cameras = [];
+        root.traverse((obj) => {
+            if (obj.isPerspectiveCamera) {
+                cameras.push(obj);
+            }
+        });
+        if (cameras.length === 0) {
+            this.viewCamera = undefined;
+            if (this.orbit) {
+                this.orbit.enabled = true;
+            }
+            return;
+        }
+        const wanted = String(this.cameraId || '').trim().toLowerCase();
+        let chosen = cameras[0];
+        if (wanted) {
+            const match = cameras.find((c) => String(c.uuid || '').toLowerCase() === wanted
+                || String(c.name || '').trim().toLowerCase() === wanted);
+            if (match) {
+                chosen = match;
+            }
+            else {
+                console.warn(`[Scene3dViewer] camera '${this.cameraId}' non trovata nella scena: uso la prima (${cameras[0].uuid})`);
+            }
+        }
+        // Aspect allineato al viewport (le camere autorate nascono con aspect=1).
+        const container = this.viewportContainer?.nativeElement;
+        if (container) {
+            chosen.aspect = Math.max(1, container.clientWidth) / Math.max(1, container.clientHeight);
+            chosen.updateProjectionMatrix();
+        }
+        this.viewCamera = chosen;
+        // Inquadratura fissa della camera autorata: niente orbit.
+        if (this.orbit) {
+            this.orbit.enabled = false;
+        }
+    }
+    /** Cache texture per-URL (repeater). */
+    repeaterTextureCache = new Map();
+    /** Controller dei carousel attivi (scroll animato + click frecce). Runtime-only. */
+    carousels = [];
+    /**
+     * Rigenera le mesh figlie di ogni Mesh Repeater dai dati della rotta (le
+     * figlie non sono persistite). Ogni figlia riceve il binding -> click-through
+     * verso la CRUD del record gia' funzionante nel viewer.
+     */
+    async setupRepeaters(root) {
+        const repeaters = [];
+        root.traverse((obj) => { if (getMeshRepeaterConfig(obj)) {
+            repeaters.push(obj);
+        } });
+        if (repeaters.length === 0) {
+            return;
+        }
+        this.carousels = [];
+        for (const group of repeaters) {
+            const cfg = getMeshRepeaterConfig(group);
+            if (!cfg.route) {
+                continue;
+            }
+            try {
+                const [rows, resolver] = await Promise.all([
+                    this.fetchRouteRows(cfg.route),
+                    this.buildTextureResolver(cfg)
+                ]);
+                regenerateRepeater(group, cfg, rows, this.buildRepeaterDeps(resolver));
+                // Archetipo carousel: attacca il controller (scroll animato + click frecce).
+                if (cfg.layout?.mode === 'carousel') {
+                    const items = group.children.filter((c) => c.name === WUIC_REPEATER_CHILD);
+                    this.carousels.push(new CarouselController(group, items, cfg.carousel || defaultCarouselConfig()));
+                }
+            }
+            catch { /* best-effort per repeater */ }
+        }
+        this.cdr.markForCheck();
+    }
+    /**
+     * Resolver texture per un repeater: colonna upload → URL (filesystem/blob)
+     * come `GetSrcUploadPreviewPipe`; altrimenti `undefined` (valore as-is).
+     */
+    async buildTextureResolver(cfg) {
+        const texCol = cfg.fieldMap?.texture;
+        if (!cfg.route || !texCol) {
+            return undefined;
+        }
+        try {
+            const columns = await this.metaSrv.getMetadati(cfg.route);
+            const app = { uploadPath: WtoolboxService.appSettings?.upload_path || '', apiUrl: WtoolboxService.appSettings?.api_url || '' };
+            return buildUploadTextureResolver(columns || [], cfg.route, texCol, app, (v) => this.unwrap(v)) || undefined;
+        }
+        catch {
+            return undefined;
+        }
+    }
+    /** Factory read-only per le mesh figlie del repeater (primitive standard). */
+    buildRepeaterDeps(resolveTextureSrc) {
+        const geom = (type) => {
+            switch (type) {
+                case 'sphere': return new THREE.SphereGeometry(0.75, 24, 12);
+                case 'plane': return new THREE.PlaneGeometry(1.5, 1.5);
+                case 'cylinder': return new THREE.CylinderGeometry(0.5, 0.5, 1.2, 24);
+                case 'cone': return new THREE.ConeGeometry(0.6, 1.2, 24);
+                case 'torus': return new THREE.TorusGeometry(0.6, 0.22, 12, 32);
+                default: return new THREE.BoxGeometry(1, 1, 1); // box + fallback custom
+            }
+        };
+        return {
+            createMesh: (type) => new THREE.Mesh(geom(String(type).replace(/^custom:/, '')), new THREE.MeshStandardMaterial({ color: 0xcccccc, metalness: 0.1, roughness: 0.75 })),
+            applyColor: (obj, val) => { this.applyColorValue(obj, val); },
+            applyShadow: (obj) => { const m = obj; m.castShadow = true; m.receiveShadow = true; },
+            applyTexture: (obj, value, opts) => this.applyRepeaterTexture(obj, value, opts),
+            createTextMesh: (text) => makeTextSpriteMesh(text),
+            resolveRecordId: (record) => this.resolveRecordPk(record),
+            unwrap: (v) => this.unwrap(v),
+            resolveTextureSrc
+        };
+    }
+    applyRepeaterTexture(obj, value, opts) {
+        applyRepeaterTextureTo(obj, value, opts, this.repeaterTextureCache, (url) => {
+            const t = new THREE.TextureLoader().load(url, () => this.cdr.markForCheck(), undefined, () => { });
+            t.colorSpace = THREE.SRGBColorSpace;
+            return t;
+        }, () => this.cdr.markForCheck());
+    }
+    resolveRecordPk(record) {
+        if (!record || typeof record !== 'object') {
+            return '';
+        }
+        for (const cand of ['id', 'Id', 'ID', 'CityID', 'code', 'codice']) {
+            if (record[cand] != null) {
+                return String(this.unwrap(record[cand]));
+            }
+        }
+        const first = Object.keys(record)[0];
+        return first ? String(this.unwrap(record[first])) : '';
+    }
+    /**
+     * Avvia la simulazione fisica se la scena e' stata salvata con
+     * `physics.enabled && autoPlayInViewer` (import Rapier lazy). Best-effort:
+     * ogni errore e' isolato dal render path.
+     */
+    async setupPhysicsAutoplay(payload, root) {
+        this.physicsWorld?.dispose();
+        this.physicsWorld = undefined;
+        const physics = payload.physics;
+        if (!physics?.enabled || physics.autoPlayInViewer === false) {
+            return;
+        }
+        try {
+            const gravity = Array.isArray(physics.gravity) && physics.gravity.length === 3
+                ? [Number(physics.gravity[0]) || 0, Number(physics.gravity[1]) || -9.81, Number(physics.gravity[2]) || 0]
+                : [0, -9.81, 0];
+            const world = await createPhysicsWorld(gravity);
+            if (physics.ground !== false) {
+                world.addGround();
+            }
+            root.traverse((obj) => {
+                const def = getPhysicsDef(obj);
+                if (def && obj.isMesh) {
+                    world.addBody(obj, def);
+                }
+            });
+            if (world.bodyCount > 0) {
+                this.physicsWorld = world;
+            }
+            else {
+                world.dispose();
+            }
+        }
+        catch (err) {
+            console.warn('[Scene3dViewer] fisica autoplay non avviata', err);
+        }
+    }
+    // ===========================================================================
+    // Iter2: animazioni auto-play (read-only, nessun transport)
+    // ===========================================================================
+    /**
+     * Per ogni nodo del contenuto che porta `Object3D.animations` (clip di asset
+     * glTF/GLB importati, ripristinate da `ObjectLoader.parse`) crea un
+     * `THREE.AnimationMixer` e avvia TUTTE le clip in loop (`LoopRepeat`).
+     * Playback read-only: nessun transport; pausa sicura in `ngOnDestroy` via
+     * {@link disposeAnimationMixers}. Mixer/clock sono runtime-only (mai serializzati).
+     */
+    setupAnimationPlayback(root) {
+        this.disposeAnimationMixers();
+        root.traverse((obj) => {
+            const clips = obj.animations;
+            if (!Array.isArray(clips) || clips.length === 0) {
+                return;
+            }
+            const mixer = new THREE.AnimationMixer(obj);
+            let started = false;
+            for (const clip of clips) {
+                if (!clip) {
+                    continue;
+                }
+                const action = mixer.clipAction(clip);
+                action.setLoop(THREE.LoopRepeat, Infinity);
+                action.play();
+                started = true;
+            }
+            if (started) {
+                this.animMixers.push(mixer);
+            }
+        });
+    }
+    /** Ferma tutte le action e rilascia i mixer (destroy / rebuild della scena). */
+    disposeAnimationMixers() {
+        for (const mixer of this.animMixers) {
+            mixer.stopAllAction();
+            mixer.uncacheRoot(mixer.getRoot());
+        }
+        this.animMixers = [];
+    }
+    /**
+     * Per ogni oggetto con `userData[WUIC_BINDING_KEY]` risolve i dati della rotta
+     * bindata e applica le colonne mappate (`color` -> materiale, `visible` ->
+     * `object.visible`). Robusto: se rotta/dati non disponibili, salta quel
+     * binding senza mai lanciare.
+     */
+    async resolveBindings(root) {
+        // Raccogli gli oggetti bindati (traverse e' sincrono; l'apply e' async).
+        const bound = [];
+        root.traverse((obj) => {
+            const binding = obj.userData ? obj.userData[WUIC_BINDING_KEY] : undefined;
+            if (binding && typeof binding.route === 'string' && binding.route.trim().length > 0) {
+                bound.push({ obj, binding });
+            }
+        });
+        if (bound.length === 0) {
+            return;
+        }
+        // Cache per rotta: un solo fetch anche se piu' oggetti bindano la stessa rotta.
+        const rowsByRoute = new Map();
+        for (const { obj, binding } of bound) {
+            try {
+                const route = binding.route.trim();
+                if (!rowsByRoute.has(route)) {
+                    rowsByRoute.set(route, await this.fetchRouteRows(route));
+                }
+                const rows = rowsByRoute.get(route) || [];
+                const record = this.pickRecord(rows, binding.recordId);
+                if (record) {
+                    this.applyBindingToObject(obj, binding, record);
+                }
+            }
+            catch {
+                // Binding fallito: salta (mai propagare nel render path).
+            }
+        }
+        this.cdr.markForCheck();
+    }
+    /**
+     * Recupera le righe di una rotta scaffoldata via il data-path del framework
+     * `DataProviderService.selectByRoute(route)` — lo stesso metodo che alimenta
+     * `<wuic-list-grid>` / `DataSourceComponent` (che a runtime chiama
+     * `DataProviderService.select(scope, ...)`). Qui non serve un `DataSourceComponent`:
+     * `selectByRoute` incapsula l'user id corrente e ritorna un `ResultInfo` con
+     * `.dato` = array di record. Prima pagina (fino a 200 righe): sufficiente a
+     * risolvere il binding di rotta o del singolo record.
+     * @returns Array di record (mai lancia; `[]` se la rotta/i dati non sono disponibili).
+     */
+    async fetchRouteRows(route) {
+        try {
+            const result = await this.dataSrv.selectByRoute(route, [], [], 200, 1);
+            const rows = (result && Array.isArray(result.dato)) ? result.dato : [];
+            return rows;
+        }
+        catch {
+            return [];
+        }
+    }
+    /**
+     * Seleziona il record target: per `recordId` (match case-insensitive su
+     * qualunque campo il cui valore uguaglia l'id, tipicamente la PK); altrimenti
+     * la prima riga (binding di rotta).
+     */
+    pickRecord(rows, recordId) {
+        if (!Array.isArray(rows) || rows.length === 0) {
+            return undefined;
+        }
+        if (recordId == null || String(recordId).trim() === '') {
+            return rows[0];
+        }
+        const target = String(recordId).trim().toLowerCase();
+        for (const row of rows) {
+            if (!row || typeof row !== 'object') {
+                continue;
+            }
+            for (const key of Object.keys(row)) {
+                const value = this.unwrap(row[key]);
+                if (value != null && String(value).trim().toLowerCase() === target) {
+                    return row;
+                }
+            }
+        }
+        return undefined;
+    }
+    /**
+     * Applica le colonne mappate del `fieldMap` all'`Object3D`:
+     * - colonna `color` -> colore del materiale/luce (hex `#rrggbb`/`0xRRGGBB` o
+     *   nome css tramite `THREE.Color`);
+     * - colonna `visible` -> `object.visible` in base alla truthiness del valore.
+     * Mai lancia.
+     */
+    applyBindingToObject(obj, binding, record) {
+        const fieldMap = binding.fieldMap || {};
+        // color
+        const colorColumn = String(fieldMap['color'] || '').trim();
+        if (colorColumn) {
+            const rawColor = this.unwrap(record[colorColumn]);
+            const applied = this.applyColorValue(obj, rawColor);
+            if (!applied) {
+                // valore non parsabile: lascia il colore autorato invariato.
+            }
+        }
+        // visible
+        const visibleColumn = String(fieldMap['visible'] || '').trim();
+        if (visibleColumn) {
+            const rawVisible = this.unwrap(record[visibleColumn]);
+            obj.visible = this.toBoolean(rawVisible);
+        }
+    }
+    /** Applica un valore-colonna come colore all'oggetto; true se ha applicato qualcosa. */
+    applyColorValue(obj, rawValue) {
+        if (rawValue == null) {
+            return false;
+        }
+        const color = this.getObjectColor(obj);
+        if (!color) {
+            return false;
+        }
+        const str = String(rawValue).trim();
+        if (!str) {
+            return false;
+        }
+        try {
+            if (/^0x[0-9a-fA-F]{6}$/.test(str)) {
+                color.setHex(parseInt(str.slice(2), 16));
+            }
+            else if (/^#?[0-9a-fA-F]{6}$/.test(str) || /^#?[0-9a-fA-F]{3}$/.test(str)) {
+                color.set(str.startsWith('#') ? str : `#${str}`);
+            }
+            else {
+                // Nome css (es. 'red') o 'rgb(...)': delega a THREE.Color.
+                color.set(str);
+            }
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }
+    /** Ritorna il `THREE.Color` editabile dell'oggetto (materiale mesh o colore luce), se presente. */
+    getObjectColor(object) {
+        if (!object) {
+            return undefined;
+        }
+        const material = object.material;
+        if (material) {
+            const single = Array.isArray(material) ? material[0] : material;
+            if (single && single.color instanceof THREE.Color) {
+                return single.color;
+            }
+        }
+        const lightColor = object.color;
+        if (lightColor instanceof THREE.Color) {
+            return lightColor;
+        }
+        return undefined;
+    }
+    /** Coercizione truthiness robusta (bool/numero/stringa 'true'/'1'/'y'/'si'/'yes'). */
+    toBoolean(value) {
+        if (typeof value === 'boolean') {
+            return value;
+        }
+        if (typeof value === 'number') {
+            return value !== 0;
+        }
+        const s = String(value ?? '').trim().toLowerCase();
+        if (s === '') {
+            return false;
+        }
+        return !['0', 'false', 'no', 'n', 'off', 'null', 'undefined'].includes(s);
+    }
+    /** Srotola un valore che potrebbe essere un BehaviorSubject (record framework) o un plain value. */
+    unwrap(value) {
+        if (value && typeof value === 'object' && typeof value.getValue === 'function') {
+            try {
+                return value.getValue();
+            }
+            catch {
+                return value;
+            }
+        }
+        if (value && typeof value === 'object' && 'value' in value && typeof value.subscribe === 'function') {
+            return value.value;
+        }
+        return value;
+    }
+    // ===========================================================================
+    // Click -> apri CRUD della rotta bindata (F5 pattern)
+    // ===========================================================================
+    handleClick(event) {
+        if (!this.renderer || !this.camera || !this.contentGroup) {
+            return;
+        }
+        const rect = this.renderer.domElement.getBoundingClientRect();
+        this.pointer.x = ((event.clientX - rect.left) / rect.width) * 2 - 1;
+        this.pointer.y = -((event.clientY - rect.top) / rect.height) * 2 + 1;
+        this.raycaster.setFromCamera(this.pointer, this.viewCamera || this.camera);
+        const hits = this.raycaster.intersectObjects([this.contentGroup], true);
+        if (hits.length === 0) {
+            return;
+        }
+        // Click su una freccia nav del carousel: scorri, non aprire nessun record.
+        const dir = carouselArrowDir(hits[0].object);
+        if (dir) {
+            const controller = this.carousels.find((c) => this.isDescendant(c.group, hits[0].object));
+            if (controller) {
+                if (dir === 'next') {
+                    controller.next();
+                }
+                else {
+                    controller.prev();
+                }
+            }
+            return;
+        }
+        const picked = this.resolveBoundAncestor(hits[0].object);
+        const binding = picked?.userData?.[WUIC_BINDING_KEY];
+        if (!binding || !String(binding.route || '').trim()) {
+            return;
+        }
+        this.zone.run(() => this.openRecordForBinding(binding));
+    }
+    /**
+     * Dal mesh colpito risale al primo antenato (incluso se stesso) che porta un
+     * binding, così il click su un sub-mesh apre comunque la CRUD dell'oggetto bindato.
+     */
+    resolveBoundAncestor(object) {
+        let current = object;
+        while (current && current !== this.contentGroup) {
+            if (current.userData && current.userData[WUIC_BINDING_KEY]) {
+                return current;
+            }
+            current = current.parent;
+        }
+        return undefined;
+    }
+    /** true se `node` e' `ancestor` o un suo discendente (per associare la freccia al carousel). */
+    isDescendant(ancestor, node) {
+        let cur = node;
+        while (cur) {
+            if (cur === ancestor) {
+                return true;
+            }
+            cur = cur.parent;
+        }
+        return false;
+    }
+    /**
+     * Naviga alla CRUD della rotta bindata — STESSA navigazione router del designer
+     * (F5): `['/', route, 'edit', recordId]` se `recordId` valorizzato, altrimenti
+     * `['/', route, 'list']`. Le permission della rotta sono enforced server-side
+     * dalla CRUD aperta.
+     */
+    openRecordForBinding(binding) {
+        const route = String(binding?.route || '').trim();
+        if (!route) {
+            return;
+        }
+        const recordId = binding?.recordId != null ? String(binding.recordId).trim() : '';
+        if (recordId) {
+            void this.router.navigate(['/', route, 'edit', recordId]);
+        }
+        else {
+            void this.router.navigate(['/', route, 'list']);
+        }
+    }
+    // ===========================================================================
+    // Helpers
+    // ===========================================================================
+    pickFirstDefined(source, keys) {
+        if (!source) {
+            return undefined;
+        }
+        for (const key of keys) {
+            if (source[key] !== undefined && source[key] !== null) {
+                return source[key];
+            }
+        }
+        return undefined;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: Scene3dViewerComponent, deps: [{ token: DataProviderService }, { token: MetadataProviderService }, { token: i1.ActivatedRoute }, { token: i1.Router }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: Scene3dViewerComponent, isStandalone: true, selector: "wuic-scene3d-viewer", inputs: { sceneKey: "sceneKey", cameraId: "cameraId" }, viewQueries: [{ propertyName: "viewportContainer", first: true, predicate: ["viewportContainer"], descendants: true }], ngImport: i0, template: "<!-- F7: viewer WebGL read-only (canvas three.js). NO palette, NO gizmo,\n     NO property panel: solo viewport + overlay stato (loading / errore). -->\n<div class=\"scene3d-viewer-shell\">\n\n  <!-- Viewport (canvas three.js) -->\n  <div #viewportContainer class=\"scene3d-viewer-viewport\"></div>\n\n  <!-- Overlay stato: loading -->\n  @if (loading) {\n    <div class=\"scene3d-viewer-overlay\">\n      <i class=\"pi pi-spin pi-spinner scene3d-viewer-spinner\"></i>\n      <span>Caricamento scena...</span>\n    </div>\n  }\n\n  <!-- Overlay stato: errore -->\n  @if (!loading && errorMessage) {\n    <div class=\"scene3d-viewer-overlay scene3d-viewer-error\">\n      <i class=\"pi pi-exclamation-triangle\"></i>\n      <span>{{ errorMessage }}</span>\n    </div>\n  }\n\n</div>\n", styles: [".scene3d-viewer-shell{position:relative;display:flex;flex-direction:column;width:100%;height:100%;min-height:480px}.scene3d-viewer-viewport{flex:1 1 auto;min-width:0;min-height:0;position:relative;overflow:hidden;background:#1e1e28}.scene3d-viewer-viewport canvas{display:block;width:100%;height:100%}.scene3d-viewer-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;font-size:.9rem;color:#e8e8f0;background:#1e1e288c;pointer-events:none}.scene3d-viewer-spinner{font-size:1.6rem}.scene3d-viewer-error{color:#ffb4b4}.scene3d-viewer-error i{font-size:1.6rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: Scene3dViewerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'wuic-scene3d-viewer', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- F7: viewer WebGL read-only (canvas three.js). NO palette, NO gizmo,\n     NO property panel: solo viewport + overlay stato (loading / errore). -->\n<div class=\"scene3d-viewer-shell\">\n\n  <!-- Viewport (canvas three.js) -->\n  <div #viewportContainer class=\"scene3d-viewer-viewport\"></div>\n\n  <!-- Overlay stato: loading -->\n  @if (loading) {\n    <div class=\"scene3d-viewer-overlay\">\n      <i class=\"pi pi-spin pi-spinner scene3d-viewer-spinner\"></i>\n      <span>Caricamento scena...</span>\n    </div>\n  }\n\n  <!-- Overlay stato: errore -->\n  @if (!loading && errorMessage) {\n    <div class=\"scene3d-viewer-overlay scene3d-viewer-error\">\n      <i class=\"pi pi-exclamation-triangle\"></i>\n      <span>{{ errorMessage }}</span>\n    </div>\n  }\n\n</div>\n", styles: [".scene3d-viewer-shell{position:relative;display:flex;flex-direction:column;width:100%;height:100%;min-height:480px}.scene3d-viewer-viewport{flex:1 1 auto;min-width:0;min-height:0;position:relative;overflow:hidden;background:#1e1e28}.scene3d-viewer-viewport canvas{display:block;width:100%;height:100%}.scene3d-viewer-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;font-size:.9rem;color:#e8e8f0;background:#1e1e288c;pointer-events:none}.scene3d-viewer-spinner{font-size:1.6rem}.scene3d-viewer-error{color:#ffb4b4}.scene3d-viewer-error i{font-size:1.6rem}\n"] }]
+        }], ctorParameters: () => [{ type: DataProviderService }, { type: MetadataProviderService }, { type: i1.ActivatedRoute }, { type: i1.Router }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { viewportContainer: [{
+                type: ViewChild,
+                args: ['viewportContainer', { static: false }]
+            }], sceneKey: [{
+                type: Input
+            }], cameraId: [{
+                type: Input
+            }] } });
+
+export { Scene3dViewerComponent };
+//# sourceMappingURL=wuic-framework-lib-scene3d-viewer.component-imoV3HOs.mjs.map