json-render/examples/react-three-fiber/app/scenes/starfield.ts

import type { Scene } from "./_helpers";

export const starfield: Scene = {
  name: "Starfield",
  description:
    "Classic Windows starfield screensaver -- flying through stars at warp speed",
  spec: {
    root: "scene",
    elements: {
      scene: {
        type: "Group",
        props: { position: null, rotation: null, scale: null },
        children: [
          "cam",
          "ambient",
          "tunnel",
          "stars1",
          "stars2",
          "sparkle-dust",
          "shake",
          "post",
          "controls",
        ],
      },
      cam: {
        type: "PerspectiveCamera",
        props: {
          position: [0, 0, 0],
          rotation: null,
          scale: null,
          fov: 75,
          near: 0.1,
          far: 1000,
          makeDefault: true,
        },
        children: [],
      },
      ambient: {
        type: "AmbientLight",
        props: { color: "#111122", intensity: 0.15 },
        children: [],
      },
      tunnel: {
        type: "WarpTunnel",
        props: {
          position: [0, 0, 0],
          rotation: null,
          scale: null,
          ringCount: 120,
          radius: 4,
          length: 40,
          speed: 12,
          tubeRadius: 0.008,
          color1: "#ffffff",
          color2: "#aabbff",
        },
        children: [],
      },
      stars1: {
        type: "Stars",
        props: {
          radius: 50,
          depth: 80,
          count: 10000,
          factor: 6,
          saturation: 0,
          fade: true,
          speed: 3,
        },
        children: [],
      },
      stars2: {
        type: "Stars",
        props: {
          radius: 30,
          depth: 50,
          count: 5000,
          factor: 3,
          saturation: 0.1,
          fade: true,
          speed: 5,
        },
        children: [],
      },
      "sparkle-dust": {
        type: "Sparkles",
        props: {
          position: [0, 0, -5],
          rotation: null,
          scale: [8, 8, 30],
          count: 300,
          speed: 2,
          opacity: 0.6,
          color: "#ffffff",
          size: 1,
          noise: 4,
        },
        children: [],
      },
      shake: {
        type: "CameraShake",
        props: {
          intensity: 0.15,
          maxYaw: 0.02,
          maxPitch: 0.02,
          maxRoll: 0.01,
        },
        children: [],
      },
      post: {
        type: "EffectComposer",
        props: { enabled: true, multisampling: 8 },
        children: ["bloom", "vignette"],
      },
      bloom: {
        type: "Bloom",
        props: {
          intensity: 1.5,
          luminanceThreshold: 0.15,
          luminanceSmoothing: null,
          mipmapBlur: true,
        },
        children: [],
      },
      vignette: {
        type: "Vignette",
        props: { offset: 0.1, darkness: 0.9 },
        children: [],
      },
      controls: {
        type: "OrbitControls",
        props: {
          enableDamping: null,
          dampingFactor: null,
          enableZoom: false,
          enablePan: false,
          enableRotate: false,
          minDistance: null,
          maxDistance: null,
          minPolarAngle: null,
          maxPolarAngle: null,
          autoRotate: false,
          autoRotateSpeed: null,
        },
        children: [],
      },
    },
  },
};