Video

A textured plane playing a video file, with optional chroma-keying (green-screen) so you can composite the video over the live scene.

import { Behaviour } from "@relu-interactives/spatial-ecs";

export default class SpawnVideo extends Behaviour {
  init() {
    const objects = this.world.getObjectManagementSystem();
    objects?.requestCreate("video", {
      name: "Promo",
      path: "/assets/videos/promo.mp4",
      transform: { position: { x: 0, y: 1.5, z: -3 } },
      options: {
        autoplay: true,
        loop: true,
        volume: 0.8,
        width: 1.6,
        height: 0.9,
      },
    });
  }
}

Payload

Field	Type	Default	Description
name	string	"Video"	Display name.
path	string	""	URL or local-asset path to the video file.
transform	TransformData	identity	Position / rotation / scale.
parentId	EntityId | null	null	Optional parent entity.

options

Option	Type	Default	Description
autoplay	boolean	false	Start playback as soon as the video is ready.
loop	boolean	true	Loop playback.
volume	number (0–1)	1	Playback volume.
width	number	1	Plane width in world units.
height	number	1	Plane height in world units.
isGreenScreen	boolean	false	Enable chroma-key shader.
backgroundColor	string	"#00ff00"	Color to key out (CSS hex).
similarity	number (0.01–1)	0.4	Chroma similarity threshold.
smoothness	number (0.001–1)	0.08	Edge smoothing.
spill	number (0–1)	0.12	Spill-suppression strength.

Components attached

Transform, Object3DRef, Name, EntityType, ParentId, Selectable, Video.