@supersoniks/concorde 4.9.98-visual-stack.1 → 5.0.0

package/src/core/components/functional/3d/boot.ts

@@ -1,77 +0,0 @@
-import * as THREE from "three";
-import {
-  DEFAULT_EXPOSURE,
-  DEFAULT_FOV,
-  DEFAULT_MAX_DISTANCE,
-  DEFAULT_MIN_DISTANCE,
-  DEFAULT_MIN_POLAR_RAD,
-  Sonic3dCameraMode,
-} from "./constants";
-import { demoContent } from "./demo-content";
-import { createRenderer } from "./gl";
-import type { OrbitLimits } from "./orbit";
-import type { SceneRuntimeOptions } from "./opts";
-
-export type BootedScene = {
-  scene: THREE.Scene;
-  renderer: THREE.WebGLRenderer;
-  canvas: HTMLCanvasElement;
-  perspCam: THREE.PerspectiveCamera;
-  orthoCam: THREE.OrthographicCamera;
-  activeCam: THREE.Camera;
-  root: THREE.Group;
-  lights: THREE.Light[];
-  dprMax: number;
-  mode: Sonic3dCameraMode;
-  fov: number;
-  fitEnabled: boolean;
-  limits: OrbitLimits;
-  autoRotate: boolean;
-};
-
-/** Alloue scène / caméras / renderer / lumières (sans OrbitControls). */
-export function bootScene(opts: SceneRuntimeOptions): BootedScene {
-  const dprMax = opts.dprMax ?? 2;
-  const mode = opts.camera ?? Sonic3dCameraMode.Orbit;
-  const fov = opts.fov ?? DEFAULT_FOV;
-  const fitEnabled = opts.fit !== false;
-  const limits: OrbitLimits = {
-    minDistance: opts.minDistance ?? DEFAULT_MIN_DISTANCE,
-    maxDistance: opts.maxDistance ?? DEFAULT_MAX_DISTANCE,
-    minPolar: opts.minPolar ?? DEFAULT_MIN_POLAR_RAD,
-    maxPolar: opts.maxPolar ?? Math.PI - DEFAULT_MIN_POLAR_RAD,
-  };
-
-  const scene = new THREE.Scene();
-  scene.background = new THREE.Color(0x0a0a0a);
-  const root = new THREE.Group();
-  scene.add(root);
-
-  const perspCam = new THREE.PerspectiveCamera(fov, 1, 0.01, 2000);
-  perspCam.position.set(2.2, 1.6, 2.8);
-  const orthoCam = new THREE.OrthographicCamera(-1, 1, 1, -1, 0.01, 2000);
-  orthoCam.position.set(2.2, 1.6, 2.8);
-
-  const renderer = createRenderer(opts.canvas);
-  renderer.outputColorSpace = THREE.SRGBColorSpace;
-  renderer.toneMapping = THREE.ACESFilmicToneMapping;
-  renderer.toneMappingExposure = opts.exposure ?? DEFAULT_EXPOSURE;
-  renderer.setPixelRatio(1);
-
-  return {
-    scene,
-    renderer,
-    canvas: opts.canvas,
-    perspCam,
-    orthoCam,
-    activeCam: perspCam,
-    root,
-    lights: demoContent.setupLights(scene),
-    dprMax,
-    mode,
-    fov,
-    fitEnabled,
-    limits,
-    autoRotate: !!opts.autoRotate,
-  };
-}

package/src/core/components/functional/3d/constants.ts

@@ -1,101 +0,0 @@
-/** Modes caméra V1 (défaut : Orbit). */
-export const Sonic3dCameraMode = {
-  Orbit: "orbit",
-  Perspective: "perspective",
-  Ortho: "ortho",
-} as const;
-export type Sonic3dCameraMode =
-  (typeof Sonic3dCameraMode)[keyof typeof Sonic3dCameraMode];
-
-/** Seuil de changement form→orbit (évite de combattre autoRotate). */
-export const ORBIT_CHANGE_EPSILON = 1e-4;
-
-export const DEFAULT_OUT_INTERVAL_MS = 80;
-export const MIN_OUT_INTERVAL_MS = 16;
-/** Throttle capture canvas → `frameUrl` / `snapshot` (plus lourd que la télémétrie). */
-export const DEFAULT_SNAPSHOT_INTERVAL_MS = 250;
-export const MIN_SNAPSHOT_INTERVAL_MS = 80;
-/** MIME / qualité JPEG pour `canvas.toBlob` (frameUrl / snapshot). */
-export const SNAPSHOT_JPEG_MIME = "image/jpeg";
-export const SNAPSHOT_JPEG_QUALITY = 0.85;
-
-export const DEFAULT_FOV = 45;
-export const DEFAULT_EXPOSURE = 1;
-export const DEFAULT_MIN_DISTANCE = 0.5;
-export const DEFAULT_MAX_DISTANCE = 50;
-/** Polar Lit attrs (degrés). */
-export const DEFAULT_MIN_POLAR_DEG = 8;
-export const DEFAULT_MAX_POLAR_DEG = 172;
-/** Polar runtime avant apply des attrs (= DEFAULT_MIN_POLAR_DEG). */
-export const DEFAULT_MIN_POLAR_RAD =
-  (DEFAULT_MIN_POLAR_DEG * Math.PI) / 180;
-
-/**
- * Champs form → viewer (auto via `dataProvider` / ancêtre `formDataProvider`).
- */
-export const FORM_CONTROL_KEYS = [
-  "src",
-  "asset",
-  "camera",
-  "fov",
-  "exposure",
-  "autoRotate",
-  "minDistance",
-  "maxDistance",
-  "minPolar",
-  "maxPolar",
-  "distance",
-  "yaw",
-  "pitch",
-] as const;
-
-/**
- * Entrées « pures » : ne jamais les réécrire en out si form et out partagent le DP.
- * (`yaw` / `pitch` / `distance` restent publiables — télémétrie / two-way).
- */
-export const FORM_INPUT_ONLY_KEYS = [
-  "src",
-  "asset",
-  "camera",
-  "fov",
-  "exposure",
-  "autoRotate",
-  "minDistance",
-  "maxDistance",
-  "minPolar",
-  "maxPolar",
-] as const;
-
-/**
- * Clés qui comptent comme consommateurs out (gate publication paresseuse).
- * yaw / pitch / distance exclus : un `sonic-input name="yaw"` ne doit pas
- * activer la pub télémétrie (sinon boucle form ↔ out).
- */
-export const OUT_CONSUMER_KEYS = [
-  "time",
-  "frame",
-  "ready",
-  "loading",
-  "hovering",
-  "pointerX",
-  "pointerY",
-  "camX",
-  "camY",
-  "camZ",
-  "targetX",
-  "targetY",
-  "targetZ",
-  "zoom",
-  "hitX",
-  "hitY",
-  "hitZ",
-  "hitObjectId",
-  /** Canvas → ObjectURL (SonicMediaRef) pour chaînage shader. */
-  "frameUrl",
-  "snapshot",
-  /** Pont live → sonic-shader (`{ element }`), publié une fois au ready. */
-  "frameSource",
-  "moving",
-] as const;
-
-export type Sonic3dFormControlKey = (typeof FORM_CONTROL_KEYS)[number];

package/src/core/components/functional/3d/demo-content.ts

@@ -1,45 +0,0 @@
-import * as THREE from "three";
-
-/** Cube + sol de démo quand aucun asset n’est fourni. */
-function create(): THREE.Object3D {
-  const group = new THREE.Group();
-  group.name = "sonic-3d-demo";
-
-  const geo = new THREE.BoxGeometry(1, 1, 1);
-  const mat = new THREE.MeshStandardMaterial({
-    color: 0x3b82f6,
-    metalness: 0.25,
-    roughness: 0.4,
-  });
-  const box = new THREE.Mesh(geo, mat);
-  box.name = "demo-box";
-  box.position.y = 0.5;
-  group.add(box);
-
-  const ground = new THREE.Mesh(
-    new THREE.CircleGeometry(2.2, 48),
-    new THREE.MeshStandardMaterial({
-      color: 0x1a1a1a,
-      metalness: 0,
-      roughness: 0.9,
-    }),
-  );
-  ground.name = "demo-ground";
-  ground.rotation.x = -Math.PI / 2;
-  group.add(ground);
-
-  return group;
-}
-
-function setupLights(scene: THREE.Scene): THREE.Light[] {
-  const amb = new THREE.AmbientLight(0xffffff, 0.55);
-  const key = new THREE.DirectionalLight(0xffffff, 1.1);
-  key.position.set(4, 6, 3);
-  const fill = new THREE.DirectionalLight(0xb0c4ff, 0.35);
-  fill.position.set(-3, 1, -2);
-  const lights = [amb, key, fill];
-  for (const l of lights) scene.add(l);
-  return lights;
-}
-
-export const demoContent = { create, setupLights } as const;

package/src/core/components/functional/3d/ensure.ts

@@ -1,107 +0,0 @@
-import type { Sonic3dCameraMode } from "./constants";
-import { parse } from "./parse";
-import { playback, wantsOffscreenPlay } from "./playback";
-import { reload } from "./reload";
-import { SceneRuntime } from "./scene-runtime";
-
-export type EnsureHost = {
-  releasing: boolean;
-  runtime: SceneRuntime | null;
-  dprMax: number;
-  camera: Sonic3dCameraMode;
-  fov: number;
-  exposure: number;
-  fit: boolean;
-  minDistance: number;
-  maxDistance: number;
-  minPolar: number;
-  maxPolar: number;
-  damping: number;
-  loadToken: number;
-  ready: boolean;
-  inView: boolean;
-  releaseOffscreen: boolean;
-  playOffscreen: boolean;
-  frameConsumerCount: number;
-  getBoundingClientRect: () => DOMRect;
-  clientWidth: number;
-  clientHeight: number;
-  renderRoot: ShadowRoot | null | undefined;
-  syncPlayback: () => void;
-};
-
-function getCanvas(host: EnsureHost): HTMLCanvasElement | null {
-  return (
-    (host.renderRoot?.querySelector("canvas") as HTMLCanvasElement | null) ??
-    null
-  );
-}
-
-async function ensureRuntime(host: EnsureHost) {
-  if (host.releasing || host.runtime) return;
-  const canvas = getCanvas(host);
-  if (!canvas) return;
-  try {
-    host.runtime = new SceneRuntime({
-      canvas,
-      dprMax: host.dprMax,
-      camera: parse.cameraMode(host.camera),
-      fov: host.fov,
-      exposure: host.exposure,
-      autoRotate: false,
-      fit: host.fit,
-      minDistance: host.minDistance,
-      maxDistance: host.maxDistance,
-      minPolar: reload.degToRad(host.minPolar),
-      maxPolar: reload.degToRad(host.maxPolar),
-    });
-    host.runtime.setDamping(host.damping);
-    reload.applyOrbitLimits(host as never);
-    syncSize(host);
-    await reload.run(host as never);
-  } catch (err) {
-    reload.emitError(host as never, err);
-  }
-}
-
-function releaseRuntime(host: EnsureHost) {
-  host.loadToken++;
-  playback.stopLoop(host as never);
-  host.ready = false;
-  host.releasing = true;
-  host.runtime?.dispose(false);
-  host.runtime = null;
-  host.releasing = false;
-}
-
-function syncVisibility(host: EnsureHost) {
-  const keepOffscreen = wantsOffscreenPlay(host);
-  if (!host.inView && host.releaseOffscreen && !keepOffscreen) {
-    releaseRuntime(host);
-    return;
-  }
-  if (
-    (!host.runtime || host.runtime.isLost) &&
-    (host.inView || keepOffscreen || !host.releaseOffscreen)
-  ) {
-    void ensureRuntime(host);
-    return;
-  }
-  host.syncPlayback();
-}
-
-function syncSize(host: EnsureHost) {
-  if (!host.runtime) return;
-  const rect = host.getBoundingClientRect();
-  const cssW = Math.max(rect.width, host.clientWidth, 1);
-  const cssH = Math.max(rect.height, host.clientHeight, 1);
-  host.runtime.resize(cssW, cssH);
-  if (host.ready) host.runtime.render();
-}
-
-export const ensure = {
-  ensureRuntime,
-  releaseRuntime,
-  syncVisibility,
-  syncSize,
-} as const;

package/src/core/components/functional/3d/form-bind.ts

@@ -1,40 +0,0 @@
-import HTML from "@supersoniks/concorde/core/utils/HTML";
-import { asset } from "./asset";
-import {
-  formParams,
-  type FormBindHost,
-  type FormOrbit,
-} from "./form-params";
-
-export type { FormBindHost, FormOrbit };
-
-function resolveFormProviderId(
-  el: HTMLElement,
-  dataProvider: string,
-): string {
-  const own = dataProvider?.trim();
-  if (own) return own;
-  return (
-    HTML.getAncestorAttributeValue(el, "dataProvider") ||
-    HTML.getAncestorAttributeValue(el, "formDataProvider") ||
-    ""
-  );
-}
-
-function resolveOutProviderId(
-  el: HTMLElement,
-  outDataProvider: string,
-  dataProvider: string,
-): string {
-  const own = outDataProvider?.trim();
-  if (own) return own;
-  return resolveFormProviderId(el, dataProvider);
-}
-
-/** Form DP resolve + apply. Paths: `formBind.asset.*`, `formBind.formParams.*`. */
-export const formBind = {
-  resolveFormProviderId,
-  resolveOutProviderId,
-  asset,
-  formParams,
-} as const;

package/src/core/components/functional/3d/form-fields.ts

@@ -1,80 +0,0 @@
-import { parse } from "./parse";
-import { playback } from "./playback";
-import { reload } from "./reload";
-import type { FormBindHost } from "./form-params";
-
-/** Applique les scalaires / flags form → propriétés host. */
-function applyScalars(host: FormBindHost, data: Record<string, unknown>) {
-  if ("fov" in data) host.fov = parse.toNum(data.fov, host.fov);
-  if ("exposure" in data) {
-    host.exposure = parse.toNum(data.exposure, host.exposure);
-  }
-  if ("minDistance" in data) {
-    host.minDistance = parse.toNum(data.minDistance, host.minDistance);
-  }
-  if ("maxDistance" in data) {
-    host.maxDistance = parse.toNum(data.maxDistance, host.maxDistance);
-  }
-  if ("minPolar" in data) {
-    host.minPolar = parse.toNum(data.minPolar, host.minPolar);
-  }
-  if ("maxPolar" in data) {
-    host.maxPolar = parse.toNum(data.maxPolar, host.maxPolar);
-  }
-  if ("autoRotate" in data) {
-    host.autoRotate = parse.isFormFlagOn(data.autoRotate);
-  }
-  if ("camera" in data && typeof data.camera === "string") {
-    host.camera = parse.cameraMode(data.camera);
-  }
-}
-
-/** Asset / src → host ; retourne true si reload requis. */
-function applyAsset(
-  host: FormBindHost,
-  data: Record<string, unknown>,
-): boolean {
-  let reload = false;
-  if ("asset" in data) {
-    const a = parse.asset(data.asset);
-    if (a) {
-      host.asset = a;
-      reload = true;
-    }
-  }
-  if ("src" in data && typeof data.src === "string" && !("asset" in data)) {
-    if (host.src !== data.src) {
-      host.src = data.src;
-      reload = true;
-    }
-  }
-  return reload;
-}
-
-function orbitLimitsTouched(data: Record<string, unknown>): boolean {
-  return (
-    "minDistance" in data ||
-    "maxDistance" in data ||
-    "minPolar" in data ||
-    "maxPolar" in data ||
-    "camera" in data
-  );
-}
-
-/** Pousse les champs déjà appliqués vers le runtime live. */
-function pushToRuntime(host: FormBindHost, data: Record<string, unknown>) {
-  if (!host.runtime) return;
-  if ("exposure" in data) host.runtime.setExposure(host.exposure);
-  if ("fov" in data) host.runtime.setFov(host.fov);
-  if ("camera" in data) {
-    host.runtime.applyCameraMode(parse.cameraMode(host.camera));
-  }
-  if (orbitLimitsTouched(data)) reload.applyOrbitLimits(host as never);
-  if ("autoRotate" in data) playback.syncAutoRotate(host as never);
-}
-
-export const formFields = {
-  applyScalars,
-  applyAsset,
-  pushToRuntime,
-} as const;

package/src/core/components/functional/3d/form-params.ts

@@ -1,99 +0,0 @@
-import { ORBIT_CHANGE_EPSILON } from "./constants";
-import { formFields } from "./form-fields";
-import { parse } from "./parse";
-import { playback } from "./playback";
-import { postBind } from "./post-bind";
-import { reload } from "./reload";
-import type { SceneRuntime } from "./runtime";
-import type { Sonic3dAsset, Sonic3dCameraMode } from "./types";
-
-export type FormOrbit = { yaw: number; pitch: number; distance: number };
-
-/** Host minimal pour appliquer les champs form → viewer. */
-export type FormBindHost = {
-  fov: number;
-  exposure: number;
-  minDistance: number;
-  maxDistance: number;
-  minPolar: number;
-  maxPolar: number;
-  autoRotate: boolean;
-  camera: Sonic3dCameraMode;
-  asset: Sonic3dAsset | null;
-  src: string;
-  runtime: SceneRuntime | null;
-  frame: number;
-  hovering: boolean;
-  pointerX: number;
-  pointerY: number;
-  lastFormOrbit: FormOrbit | null;
-};
-
-function orbitChanged(prev: FormOrbit | null, next: FormOrbit): boolean {
-  if (!prev) return true;
-  return (
-    Math.abs(prev.yaw - next.yaw) > ORBIT_CHANGE_EPSILON ||
-    Math.abs(prev.pitch - next.pitch) > ORBIT_CHANGE_EPSILON ||
-    Math.abs(prev.distance - next.distance) > ORBIT_CHANGE_EPSILON
-  );
-}
-
-/**
- * Orbit depuis le form : uniquement si yaw/pitch/distance ont changé
- * (sinon chaque mutation télémétrie / checkbox réapplique et combat autoRotate).
- */
-function readOrbit(
-  host: FormBindHost,
-  data: Record<string, unknown>,
-): FormOrbit {
-  const cur = host.runtime!.snapshot({
-    time: 0,
-    frame: host.frame,
-    hovering: host.hovering ? 1 : 0,
-    pointerX: host.pointerX,
-    pointerY: host.pointerY,
-  });
-  return {
-    yaw: "yaw" in data ? parse.toNum(data.yaw, cur.yaw) : cur.yaw,
-    pitch: "pitch" in data ? parse.toNum(data.pitch, cur.pitch) : cur.pitch,
-    distance:
-      "distance" in data
-        ? parse.toNum(data.distance, cur.distance)
-        : cur.distance,
-  };
-}
-
-function applyFormOrbit(host: FormBindHost, data: Record<string, unknown>) {
-  if (!host.runtime) return;
-  if (!("distance" in data || "yaw" in data || "pitch" in data)) return;
-  const next = readOrbit(host, data);
-  const prev = host.lastFormOrbit;
-  if (!orbitChanged(prev, next)) return;
-  host.lastFormOrbit = next;
-  if (host.autoRotate && prev) {
-    host.autoRotate = false;
-    playback.syncAutoRotate(host as never);
-  }
-  host.runtime.setOrbitSpherical(next.yaw, next.pitch, next.distance);
-  host.runtime.render();
-}
-
-/**
- * Auto-bind form → viewer : champs `FORM_CONTROL_KEYS` sur le DP / form ancêtre.
- */
-function applyFormParams(host: FormBindHost, data: Record<string, unknown>) {
-  formFields.applyScalars(host, data);
-  const needReload = formFields.applyAsset(host, data);
-
-  if (!host.runtime) {
-    if (needReload) void reload.run(host as never);
-    return;
-  }
-
-  formFields.pushToRuntime(host, data);
-  applyFormOrbit(host, data);
-  postBind.applyFormPost(host as never, data);
-  if (needReload) void reload.run(host as never);
-}
-
-export const formParams = { applyFormParams, applyFormOrbit } as const;

package/src/core/components/functional/3d/frame-capture.spec.ts

@@ -1,72 +0,0 @@
-import { describe, expect, it, vi, beforeEach } from "vitest";
-import { DEFAULT_SNAPSHOT_INTERVAL_MS } from "./constants";
-import { frameCapture, type FrameCaptureHost } from "./frame-capture";
-
-function makeHost(
-  overrides: Partial<FrameCaptureHost> = {},
-): FrameCaptureHost {
-  return {
-    outPublisher: null,
-    runtime: null,
-    snapshotInterval: DEFAULT_SNAPSHOT_INTERVAL_MS,
-    frameOut: false,
-    snapshotBusy: false,
-    lastSnapshotAt: 0,
-    frameUrls: [],
-    snapshotSeq: 0,
-    ...overrides,
-  };
-}
-
-describe("frameCapture.wantsFrameCapture", () => {
-  beforeEach(() => {
-    URL.createObjectURL = vi.fn(() => "blob:x") as typeof URL.createObjectURL;
-    URL.revokeObjectURL = vi.fn() as typeof URL.revokeObjectURL;
-  });
-
-  it("exige un outPublisher", () => {
-    expect(
-      frameCapture.wantsFrameCapture(makeHost({ frameOut: true })),
-    ).toBe(false);
-  });
-
-  it("active avec frameOut", () => {
-    expect(
-      frameCapture.wantsFrameCapture(
-        makeHost({ outPublisher: {}, frameOut: true }),
-      ),
-    ).toBe(true);
-  });
-
-  it("active si listener sur frameUrl", () => {
-    const proxies = new Map([["frameUrl", { hasListener: () => true }]]);
-    expect(
-      frameCapture.wantsFrameCapture(
-        makeHost({
-          outPublisher: { _proxies_: proxies },
-          frameOut: false,
-        }),
-      ),
-    ).toBe(true);
-  });
-});
-
-describe("frameCapture.revokeAll", () => {
-  it("révoque les urls et invalide la séquence", () => {
-    const revoke = vi.fn();
-    URL.revokeObjectURL = revoke as typeof URL.revokeObjectURL;
-    const host = makeHost({
-      outPublisher: {},
-      frameOut: true,
-      snapshotBusy: true,
-      lastSnapshotAt: 1,
-      frameUrls: ["blob:a", "blob:b"],
-      snapshotSeq: 3,
-    });
-    frameCapture.revokeAll(host);
-    expect(revoke).toHaveBeenCalledTimes(2);
-    expect(host.frameUrls).toEqual([]);
-    expect(host.snapshotBusy).toBe(false);
-    expect(host.snapshotSeq).toBe(4);
-  });
-});