@corensystem/coren-ui 1.0.0-next.20260924.75108.887a9c2

package/dist/footprint-viewer.mjs

@@ -0,0 +1,657 @@
+import { TilesRenderer } from "3d-tiles-renderer";
+import * as OBC from "@thatopen/components";
+import * as THREE from "three";
+import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader.js";
+import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
+//#region src/footprint-viewer.ts
+const SEED = {
+	offX: 512,
+	offY: -560,
+	scale: 3.29,
+	rot: -170,
+	zoff: 26.9
+};
+const CENTER = {
+	x: -452.29,
+	z: 1069.75
+};
+const FLOOR_Y = 0;
+const UNASSIGNED = "#9ca3af";
+const OPEN_POSE = {
+	elevationDeg: 42,
+	azimuthDeg: 78,
+	zoom: .95,
+	panX: .14,
+	panZ: .66
+};
+const LABEL_ZOOM_FRAC = .2;
+const BLOCK_LABEL_FRAC = .5;
+const ZONE_LABEL_FRAC = .8;
+const BACKDROP_ZOOM_FADE = .3;
+const BACKDROP_ZOOMOUT_FADE = .1;
+const BACKDROP_BASE_BLUR = 4;
+const BACKDROP_TILT_FADE = .05;
+async function createFootprintViewer(container, options = {}) {
+	const o = {
+		tilesetUrl: "/reality-mesh/capture2/mesh_3d/tileset.json",
+		dracoPath: "/reality-mesh/draco/gltf/",
+		workerUrl: "/worker.mjs",
+		footprintsUrl: "/footprints.json",
+		progressUrls: ["/house-progress.json", "/house-progress-IMA.json"],
+		meshOpacity: .85,
+		projectionStrength: .85,
+		colorMode: "progress",
+		...options
+	};
+	let meshOp = o.meshOpacity;
+	let strength = o.projectionStrength;
+	let colorMode = o.colorMode;
+	const components = new OBC.Components();
+	const world = components.get(OBC.Worlds).create();
+	world.scene = new OBC.SimpleScene(components);
+	world.scene.setup();
+	world.scene.three.background = o.transparent ? null : new THREE.Color("#1a1d21");
+	world.renderer = new OBC.SimpleRenderer(components, container);
+	world.renderer.showLogo = false;
+	world.camera = new OBC.OrthoPerspectiveCamera(components);
+	await world.camera.controls.setLookAt(12, 10, 12, 0, 0, 0);
+	components.init();
+	const gl = world.renderer.three;
+	gl.setPixelRatio(Math.min(window.devicePixelRatio, 1.5));
+	if (o.transparent) gl.setClearColor(0, 0);
+	const FAR = 5e6;
+	const MAX_DOLLY = 2e6;
+	const raiseClip = () => {
+		const cam = world.camera.three;
+		if (cam.far !== FAR) {
+			cam.far = FAR;
+			cam.updateProjectionMatrix();
+		}
+		if (world.camera.controls.maxDistance !== MAX_DOLLY) world.camera.controls.maxDistance = MAX_DOLLY;
+	};
+	raiseClip();
+	world.camera.controls.addEventListener("update", raiseClip);
+	const workerResponse = await fetch(o.workerUrl);
+	if (!workerResponse.ok) throw new Error("Fragments worker (/worker.mjs) not found.");
+	const workerBlob = await workerResponse.blob();
+	const workerUrl = URL.createObjectURL(new File([workerBlob], "worker.mjs", { type: "text/javascript" }));
+	const fragments = components.get(OBC.FragmentsManager);
+	fragments.init(workerUrl);
+	world.camera.controls.addEventListener("update", () => fragments.core.update());
+	const footRes = await fetch(o.footprintsUrl);
+	if (!footRes.ok) throw new Error("Could not load footprints.json");
+	const footprints = await footRes.json();
+	const entries = Object.entries(footprints);
+	const progress = /* @__PURE__ */ new Map();
+	await Promise.all(o.progressUrls.map(async (url) => {
+		try {
+			const res = await fetch(url);
+			if (!res.ok) return;
+			const doc = await res.json();
+			for (const [code, rec] of Object.entries(doc.houses)) progress.set(code, rec);
+		} catch {}
+	}));
+	const overrideColours = /* @__PURE__ */ new Map();
+	const colourFor = (code) => overrideColours.get(code) ?? progress.get(code)?.color ?? UNASSIGNED;
+	const MARGIN = 40;
+	let minX = Infinity;
+	let minZ = Infinity;
+	let maxX = -Infinity;
+	let maxZ = -Infinity;
+	for (const [, fp] of entries) for (const [x, z] of fp.p) {
+		if (x < minX) minX = x;
+		if (x > maxX) maxX = x;
+		if (z < minZ) minZ = z;
+		if (z > maxZ) maxZ = z;
+	}
+	minX -= MARGIN;
+	minZ -= MARGIN;
+	maxX += MARGIN;
+	maxZ += MARGIN;
+	const bw = maxX - minX;
+	const bh = maxZ - minZ;
+	const MAXPX = 2048;
+	const cw = bw >= bh ? MAXPX : Math.max(1, Math.round(MAXPX * bw / bh));
+	const ch = bw >= bh ? Math.max(1, Math.round(MAXPX * bh / bw)) : MAXPX;
+	const canvas = document.createElement("canvas");
+	canvas.width = cw;
+	canvas.height = ch;
+	const ctx2d = canvas.getContext("2d");
+	if (!ctx2d) throw new Error("Could not create 2D canvas context.");
+	const brighten = (hex, amount = .45) => `#${new THREE.Color(hex).lerp(new THREE.Color(1, 1, 1), amount).getHexString()}`;
+	let hoverCode = null;
+	let selectedCode = null;
+	let visibleCodes = null;
+	function drawTexture() {
+		ctx2d.clearRect(0, 0, cw, ch);
+		for (const [code, fp] of entries) {
+			if (fp.p.length < 3) continue;
+			if (visibleCodes && !visibleCodes.has(code)) continue;
+			ctx2d.beginPath();
+			for (let i = 0; i < fp.p.length; i++) {
+				const [x, z] = fp.p[i];
+				const px = (x - minX) / bw * cw;
+				const py = (z - minZ) / bh * ch;
+				if (i === 0) ctx2d.moveTo(px, py);
+				else ctx2d.lineTo(px, py);
+			}
+			ctx2d.closePath();
+			const base = colourFor(code);
+			ctx2d.fillStyle = code === hoverCode || code === selectedCode ? brighten(base) : base;
+			ctx2d.fill();
+		}
+	}
+	drawTexture();
+	const texture = new THREE.CanvasTexture(canvas);
+	texture.colorSpace = THREE.SRGBColorSpace;
+	texture.flipY = false;
+	texture.needsUpdate = true;
+	const projUniforms = {
+		uMin: { value: new THREE.Vector2(minX, minZ) },
+		uSize: { value: new THREE.Vector2(bw, bh) },
+		uTex: { value: texture },
+		uStrength: { value: colorMode === "off" ? 0 : strength }
+	};
+	const effectiveStrength = () => colorMode === "off" ? 0 : strength;
+	function patchMaterial(m) {
+		const mm = m;
+		if (mm.userData.__fpPatched) return;
+		mm.userData.__fpPatched = true;
+		m.onBeforeCompile = (shader) => {
+			shader.uniforms.uMin = projUniforms.uMin;
+			shader.uniforms.uSize = projUniforms.uSize;
+			shader.uniforms.uTex = projUniforms.uTex;
+			shader.uniforms.uStrength = projUniforms.uStrength;
+			shader.vertexShader = "varying vec3 vWorldPos;\n" + shader.vertexShader;
+			shader.vertexShader = shader.vertexShader.replace("#include <begin_vertex>", "#include <begin_vertex>\n	vWorldPos = (modelMatrix * vec4(transformed, 1.0)).xyz;");
+			shader.fragmentShader = "uniform vec2 uMin;\nuniform vec2 uSize;\nuniform sampler2D uTex;\nuniform float uStrength;\nvarying vec3 vWorldPos;\n" + shader.fragmentShader;
+			shader.fragmentShader = shader.fragmentShader.replace("#include <dithering_fragment>", "#include <dithering_fragment>\n	vec2 fpUv = (vWorldPos.xz - uMin) / uSize;\n	if (fpUv.x >= 0.0 && fpUv.x <= 1.0 && fpUv.y >= 0.0 && fpUv.y <= 1.0) {\n		vec4 fpCol = texture2D(uTex, fpUv);\n		gl_FragColor.rgb = mix(gl_FragColor.rgb, fpCol.rgb, fpCol.a * uStrength);\n	}");
+		};
+		m.needsUpdate = true;
+	}
+	const index = [];
+	for (const [code, fp] of entries) {
+		if (fp.p.length < 3) continue;
+		let ix = Infinity;
+		let ax = -Infinity;
+		let iz = Infinity;
+		let az = -Infinity;
+		for (const [x, z] of fp.p) {
+			if (x < ix) ix = x;
+			if (x > ax) ax = x;
+			if (z < iz) iz = z;
+			if (z > az) az = z;
+		}
+		index.push({
+			code,
+			poly: fp.p,
+			minx: ix,
+			maxx: ax,
+			minz: iz,
+			maxz: az
+		});
+	}
+	function pointInPoly(x, z, poly) {
+		let inside = false;
+		for (let i = 0, j = poly.length - 1; i < poly.length; j = i++) {
+			const xi = poly[i][0];
+			const zi = poly[i][1];
+			const xj = poly[j][0];
+			const zj = poly[j][1];
+			if (zi > z !== zj > z && x < (xj - xi) * (z - zi) / (zj - zi) + xi) inside = !inside;
+		}
+		return inside;
+	}
+	function villaAt(x, z) {
+		for (const it of index) {
+			if (x < it.minx || x > it.maxx || z < it.minz || z > it.maxz) continue;
+			if (pointInPoly(x, z, it.poly)) return it.code;
+		}
+		return null;
+	}
+	const fpBox = new THREE.Box3(new THREE.Vector3(minX, -5, minZ), new THREE.Vector3(maxX, 40, maxZ));
+	async function fitAll() {
+		await resetView(true);
+	}
+	function poseDistance(zoom) {
+		const size = fpBox.getSize(new THREE.Vector3());
+		const radius = Math.hypot(size.x, size.z) / 2 || 100;
+		const vfov = (world.camera.three.fov ?? 60) * Math.PI / 180;
+		return radius / Math.tan(vfov / 2) * zoom;
+	}
+	async function applyPose(target, elevDeg, azimDeg, dist, animate) {
+		const elev = elevDeg * Math.PI / 180;
+		const azim = azimDeg * Math.PI / 180;
+		const dir = new THREE.Vector3(Math.cos(elev) * Math.sin(azim), Math.sin(elev), Math.cos(elev) * Math.cos(azim));
+		await world.camera.controls.setLookAt(target.x + dir.x * dist, target.y + dir.y * dist, target.z + dir.z * dist, target.x, target.y, target.z, animate);
+	}
+	let curElev = OPEN_POSE.elevationDeg;
+	let curAzim = OPEN_POSE.azimuthDeg;
+	let curZoom = OPEN_POSE.zoom;
+	let curPanX = OPEN_POSE.panX ?? 0;
+	let curPanZ = OPEN_POSE.panZ ?? 0;
+	function poseTarget() {
+		const c = fpBox.getCenter(new THREE.Vector3());
+		const s = fpBox.getSize(new THREE.Vector3());
+		c.x += curPanX * (s.x / 2);
+		c.z += curPanZ * (s.z / 2);
+		return c;
+	}
+	async function resetView(animate = true) {
+		curElev = OPEN_POSE.elevationDeg;
+		curAzim = OPEN_POSE.azimuthDeg;
+		curZoom = OPEN_POSE.zoom;
+		curPanX = OPEN_POSE.panX ?? 0;
+		curPanZ = OPEN_POSE.panZ ?? 0;
+		await applyPose(poseTarget(), curElev, curAzim, poseDistance(curZoom), animate);
+	}
+	async function setView(pose, animate = false) {
+		if (pose.elevationDeg != null) curElev = pose.elevationDeg;
+		if (pose.azimuthDeg != null) curAzim = pose.azimuthDeg;
+		if (pose.zoom != null) curZoom = pose.zoom;
+		if (pose.panX != null) curPanX = pose.panX;
+		if (pose.panZ != null) curPanZ = pose.panZ;
+		await applyPose(poseTarget(), curElev, curAzim, poseDistance(curZoom), animate);
+	}
+	await resetView(false);
+	const satGroup = new THREE.Group();
+	const enuGroup = new THREE.Group();
+	satGroup.add(enuGroup);
+	world.scene.three.add(satGroup);
+	const tiles = new TilesRenderer(o.tilesetUrl);
+	tiles.errorTarget = 16;
+	tiles.maxDepth = 7;
+	tiles.lruCache.maxSize = 200;
+	tiles.lruCache.minSize = 100;
+	tiles.lruCache.maxBytesSize = .2 * 2 ** 30;
+	tiles.lruCache.unloadPercent = .25;
+	const draco = new DRACOLoader(tiles.manager);
+	draco.setDecoderPath(o.dracoPath);
+	const gltfLoader = new GLTFLoader(tiles.manager);
+	gltfLoader.setDRACOLoader(draco);
+	tiles.manager.addHandler(/\.(gltf|glb)$/i, gltfLoader);
+	tiles.setCamera(world.camera.three);
+	tiles.setResolutionFromRenderer(world.camera.three, gl);
+	enuGroup.add(tiles.group);
+	function styleTile(root) {
+		root.traverse((n) => {
+			const mesh = n;
+			if (!mesh.isMesh) return;
+			const mats = Array.isArray(mesh.material) ? mesh.material : [mesh.material];
+			for (const m of mats) {
+				if (!m) continue;
+				m.transparent = meshOp < 1;
+				m.opacity = meshOp;
+				m.depthWrite = meshOp >= 1;
+				patchMaterial(m);
+				m.needsUpdate = true;
+			}
+		});
+	}
+	tiles.addEventListener("load-model", (e) => {
+		if (e.scene) styleTile(e.scene);
+		fragments.core.update();
+	});
+	function applyMeshPlacement() {
+		satGroup.position.set(CENTER.x + SEED.offX, -.05 + SEED.zoff, CENTER.z - SEED.offY);
+		satGroup.scale.setScalar(SEED.scale);
+		satGroup.rotation.y = SEED.rot * Math.PI / 180;
+		tiles.group.traverse((n) => styleTile(n));
+		projUniforms.uStrength.value = effectiveStrength();
+		fragments.core.update();
+	}
+	let framed = false;
+	tiles.addEventListener("load-tile-set", () => {
+		const sphere = new THREE.Sphere();
+		if (framed || !tiles.getBoundingSphere(sphere)) return;
+		framed = true;
+		tiles.group.position.copy(sphere.center).multiplyScalar(-1);
+		enuGroup.quaternion.setFromUnitVectors(sphere.center.clone().normalize(), new THREE.Vector3(0, 1, 0));
+		applyMeshPlacement();
+		if (selectedCode) api.fitVilla(selectedCode);
+		else resetView();
+		api.onReady_?.();
+	});
+	world.renderer.onBeforeUpdate.add(() => {
+		tiles.setResolutionFromRenderer(world.camera.three, gl);
+		tiles.update();
+	});
+	const raycaster = new THREE.Raycaster();
+	raycaster.far = FAR;
+	const ndc = new THREE.Vector2();
+	function codeAtClient(clientX, clientY) {
+		const rect = gl.domElement.getBoundingClientRect();
+		ndc.x = (clientX - rect.left) / rect.width * 2 - 1;
+		ndc.y = -((clientY - rect.top) / rect.height) * 2 + 1;
+		raycaster.setFromCamera(ndc, world.camera.three);
+		const hits = raycaster.intersectObject(tiles.group, true);
+		const pt = hits.length ? hits[0].point : null;
+		return pt ? villaAt(pt.x, pt.z) : null;
+	}
+	function setHover(code) {
+		if (code === hoverCode) return;
+		hoverCode = code;
+		drawTexture();
+		texture.needsUpdate = true;
+		fragments.core.update();
+		api.onHover?.(code);
+	}
+	let hoverClient = null;
+	let hoverRAF = 0;
+	const onMove = (ev) => {
+		hoverClient = {
+			x: ev.clientX,
+			y: ev.clientY
+		};
+		if (!hoverRAF) hoverRAF = requestAnimationFrame(() => {
+			hoverRAF = 0;
+			if (!hoverClient) return;
+			setHover(codeAtClient(hoverClient.x, hoverClient.y));
+		});
+	};
+	const onLeave = () => {
+		hoverClient = null;
+		setHover(null);
+	};
+	const onClick = (ev) => {
+		api.selectVilla(codeAtClient(ev.clientX, ev.clientY));
+	};
+	container.addEventListener("mousemove", onMove);
+	container.addEventListener("mouseleave", onLeave);
+	container.addEventListener("click", onClick);
+	let labelsVisible = true;
+	const LABEL_Y = -.05 + SEED.zoff;
+	const styleLabel = (el, light) => {
+		el.style.background = light ? "#ffffff" : "#000000";
+		el.style.color = light ? "#111827" : "#ffffff";
+	};
+	const CHIP_CSS = "padding:2px 6px;border-radius:5px;font:600 12px/1 ui-sans-serif,system-ui,-apple-system,sans-serif;white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.35)";
+	const makeChip = (text) => {
+		const el = document.createElement("div");
+		el.style.cssText = "position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;will-change:transform";
+		const inner = document.createElement("div");
+		inner.textContent = text;
+		inner.style.cssText = CHIP_CSS;
+		styleLabel(inner, false);
+		el.appendChild(inner);
+		return {
+			el,
+			inner
+		};
+	};
+	const labelEls = index.map((it) => {
+		const { el, inner } = makeChip(it.code.split("-").pop() ?? it.code);
+		return {
+			code: it.code,
+			el,
+			inner,
+			center: new THREE.Vector3((it.minx + it.maxx) / 2, LABEL_Y, (it.minz + it.maxz) / 2)
+		};
+	});
+	const labelLayer = document.createElement("div");
+	labelLayer.style.cssText = "position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:2";
+	for (const L of labelEls) labelLayer.appendChild(L.el);
+	container.appendChild(labelLayer);
+	const restyleLabels = () => {
+		for (const L of labelEls) styleLabel(L.inner, L.code === selectedCode);
+	};
+	const makeGroupLabels = (keyOf) => {
+		const groups = /* @__PURE__ */ new Map();
+		for (const it of index) {
+			const rec = progress.get(it.code);
+			const info = rec ? keyOf(rec) : null;
+			if (!info) continue;
+			const cx = (it.minx + it.maxx) / 2;
+			const cz = (it.minz + it.maxz) / 2;
+			const g = groups.get(info.key) ?? {
+				text: info.text,
+				sx: 0,
+				sz: 0,
+				n: 0
+			};
+			g.sx += cx;
+			g.sz += cz;
+			g.n += 1;
+			groups.set(info.key, g);
+		}
+		return [...groups.values()].map((g) => {
+			const { el } = makeChip(g.text);
+			labelLayer.appendChild(el);
+			return {
+				el,
+				center: new THREE.Vector3(g.sx / g.n, LABEL_Y, g.sz / g.n)
+			};
+		});
+	};
+	const zoneLabels = makeGroupLabels((rec) => rec.zone ? {
+		key: rec.zone,
+		text: `Zone 1 - ${rec.zone.slice(1)}`
+	} : null);
+	const blockLabels = makeGroupLabels((rec) => rec.block ? {
+		key: `${rec.zone}-${rec.block}`,
+		text: `Block-${String(rec.block).padStart(2, "0")}`
+	} : null);
+	const _labelTarget = new THREE.Vector3();
+	const _proj = new THREE.Vector3();
+	const placeLabel = (L, show, cam, wpx, hpx) => {
+		if (show) {
+			_proj.copy(L.center).project(cam);
+			show = _proj.z > -1 && _proj.z < 1 && Math.abs(_proj.x) < 1.15 && Math.abs(_proj.y) < 1.15;
+		}
+		if (!show) {
+			if (L.el.style.visibility !== "hidden") L.el.style.visibility = "hidden";
+			return;
+		}
+		L.el.style.visibility = "visible";
+		L.el.style.transform = `translate(-50%,-50%) translate(${(_proj.x * .5 + .5) * wpx}px,${(-_proj.y * .5 + .5) * hpx}px)`;
+	};
+	function updateLabels() {
+		const wpx = container.clientWidth;
+		const hpx = container.clientHeight;
+		const cam = world.camera.three;
+		const target = world.camera.controls.getTarget(_labelTarget);
+		const frac = cam.position.distanceTo(target) / poseDistance(1);
+		const showVilla = labelsVisible && frac <= LABEL_ZOOM_FRAC;
+		const showBlock = labelsVisible && frac > LABEL_ZOOM_FRAC && frac <= BLOCK_LABEL_FRAC;
+		const showZone = labelsVisible && frac > BLOCK_LABEL_FRAC && frac <= ZONE_LABEL_FRAC;
+		for (const L of labelEls) placeLabel(L, showVilla, cam, wpx, hpx);
+		for (const L of blockLabels) placeLabel(L, showBlock, cam, wpx, hpx);
+		for (const L of zoneLabels) placeLabel(L, showZone, cam, wpx, hpx);
+	}
+	world.renderer.onBeforeUpdate.add(updateLabels);
+	const D0 = poseDistance(OPEN_POSE.zoom);
+	const _bdTarget = new THREE.Vector3();
+	function updateBackdrop() {
+		if (!options.onBackdrop) return;
+		const target = world.camera.controls.getTarget(_bdTarget);
+		const cam = world.camera.three;
+		const dx = cam.position.x - target.x;
+		const dy = cam.position.y - target.y;
+		const dz = cam.position.z - target.z;
+		const dist = Math.hypot(dx, dy, dz) || D0;
+		const zoomInFrac = (D0 - dist) / D0;
+		const p = zoomInFrac >= 0 ? Math.min(1, zoomInFrac / BACKDROP_ZOOM_FADE) : Math.min(1, -zoomInFrac / BACKDROP_ZOOMOUT_FADE);
+		const elevationDeg = Math.atan2(dy, Math.hypot(dx, dz)) * 180 / Math.PI;
+		const azimuthDeg = Math.atan2(dx, dz) * 180 / Math.PI;
+		let azDev = Math.abs(azimuthDeg - OPEN_POSE.azimuthDeg) % 360;
+		if (azDev > 180) azDev = 360 - azDev;
+		const dev = Math.max(azDev / 360, Math.abs(elevationDeg - OPEN_POSE.elevationDeg) / 84);
+		const orientOpacity = 1 - Math.min(1, Math.max(0, (dev - BACKDROP_TILT_FADE) / BACKDROP_TILT_FADE));
+		options.onBackdrop({
+			opacity: (1 - p) * orientOpacity,
+			blurPx: BACKDROP_BASE_BLUR + p * 18,
+			scale: Math.min(3, Math.max(.3, D0 / dist))
+		});
+	}
+	world.renderer.onBeforeUpdate.add(updateBackdrop);
+	const api = {
+		setMeshOpacity(op) {
+			meshOp = op;
+			tiles.group.traverse((n) => styleTile(n));
+			fragments.core.update();
+		},
+		setProjectionStrength(s) {
+			strength = s;
+			projUniforms.uStrength.value = effectiveStrength();
+			fragments.core.update();
+		},
+		setColorMode(mode) {
+			colorMode = mode;
+			projUniforms.uStrength.value = effectiveStrength();
+			fragments.core.update();
+		},
+		setVillaColours(map) {
+			for (const [code, hex] of Object.entries(map)) overrideColours.set(code, hex);
+			drawTexture();
+			texture.needsUpdate = true;
+			fragments.core.update();
+		},
+		setVisibleVillas(codes) {
+			visibleCodes = codes ? new Set(codes) : null;
+			drawTexture();
+			texture.needsUpdate = true;
+			fragments.core.update();
+		},
+		getVillaCodes() {
+			return entries.map(([code]) => code);
+		},
+		getVillaRecord(code) {
+			if (!footprints[code]) return null;
+			const rec = progress.get(code);
+			return {
+				code,
+				zone: rec?.zone,
+				batch: rec?.batch,
+				block: rec?.block,
+				actual: rec?.actual,
+				planned: rec?.planned,
+				variance: rec?.variance,
+				color: colourFor(code),
+				contractor: rec?.contractor,
+				model: rec?.model,
+				plot: rec?.plot,
+				unitType: rec?.unitType,
+				typology: rec?.typology
+			};
+		},
+		selectVilla(code) {
+			selectedCode = code;
+			drawTexture();
+			texture.needsUpdate = true;
+			restyleLabels();
+			fragments.core.update();
+			api.onSelect?.(code);
+		},
+		getSelectedVilla() {
+			return selectedCode;
+		},
+		fitAll,
+		resetView,
+		setView,
+		getZoomFactor() {
+			const t = world.camera.controls.getTarget(new THREE.Vector3());
+			const dist = world.camera.three.position.distanceTo(t);
+			const siteFit = poseDistance(1);
+			return dist > .001 ? siteFit / dist : 1;
+		},
+		isZoomedIn() {
+			const t = world.camera.controls.getTarget(new THREE.Vector3());
+			return world.camera.three.position.distanceTo(t) < poseDistance(OPEN_POSE.zoom) * .98;
+		},
+		zoomIn() {
+			const t = world.camera.controls.getTarget(new THREE.Vector3());
+			world.camera.controls.dolly(world.camera.three.position.distanceTo(t) * .3, true);
+		},
+		zoomOut() {
+			const t = world.camera.controls.getTarget(new THREE.Vector3());
+			world.camera.controls.dolly(-world.camera.three.position.distanceTo(t) * .3, true);
+		},
+		setInteractionMode(mode) {
+			const controls = world.camera.controls;
+			const ACTION = controls.constructor.ACTION ?? {
+				ROTATE: 1,
+				TRUCK: 2
+			};
+			controls.mouseButtons.left = mode === "pan" ? ACTION.TRUCK : ACTION.ROTATE;
+		},
+		async topDownView() {
+			const c = fpBox.getCenter(new THREE.Vector3());
+			const up = poseDistance(1);
+			await world.camera.controls.setLookAt(c.x, c.y + up, c.z + up * .001, c.x, c.y, c.z, false);
+			await world.camera.controls.fitToBox(fpBox, true);
+		},
+		getCameraPose() {
+			const p = world.camera.three.position;
+			const t = world.camera.controls.getTarget(new THREE.Vector3());
+			const dx = p.x - t.x;
+			const dy = p.y - t.y;
+			const dz = p.z - t.z;
+			const horiz = Math.hypot(dx, dz);
+			return {
+				position: [
+					p.x,
+					p.y,
+					p.z
+				],
+				target: [
+					t.x,
+					t.y,
+					t.z
+				],
+				elevationDeg: Math.atan2(dy, horiz) * 180 / Math.PI,
+				azimuthDeg: Math.atan2(dx, dz) * 180 / Math.PI,
+				distance: Math.hypot(dx, dy, dz)
+			};
+		},
+		async fitVilla(code) {
+			const it = index.find((i) => i.code === code);
+			if (!it) return;
+			const cx = (it.minx + it.maxx) / 2;
+			const cz = (it.minz + it.maxz) / 2;
+			const radius = Math.max(it.maxx - it.minx, it.maxz - it.minz) * 6 / 2 || 20;
+			const vfov = (world.camera.three.fov ?? 60) * Math.PI / 180;
+			await applyPose(new THREE.Vector3(cx, FLOOR_Y, cz), curElev, curAzim, radius / Math.tan(vfov / 2), true);
+		},
+		setMeshVisible(v) {
+			satGroup.visible = v;
+			fragments.core.update();
+		},
+		setModelVisible(v) {
+			colorMode = v ? "progress" : "off";
+			projUniforms.uStrength.value = effectiveStrength();
+			fragments.core.update();
+		},
+		setModelOpacity(op) {
+			strength = op;
+			projUniforms.uStrength.value = effectiveStrength();
+			fragments.core.update();
+		},
+		setColourMode(mode) {
+			colorMode = mode === "off" || mode === "material" ? "off" : "progress";
+			projUniforms.uStrength.value = effectiveStrength();
+			fragments.core.update();
+		},
+		setLabelsVisible(v) {
+			labelsVisible = v;
+			updateLabels();
+		},
+		onHover: options.onHover,
+		onSelect: options.onSelect,
+		dispose() {
+			container.removeEventListener("mousemove", onMove);
+			container.removeEventListener("mouseleave", onLeave);
+			container.removeEventListener("click", onClick);
+			try {
+				tiles.dispose();
+			} catch {}
+			components.dispose();
+			container.replaceChildren();
+		}
+	};
+	api.onReady_ = () => options.onReady?.(api);
+	return api;
+}
+//#endregion
+export { OPEN_POSE, createFootprintViewer };
+
+//# sourceMappingURL=footprint-viewer.mjs.map