### Install Production Dependencies

Source: https://github.com/rse/studio-canvas/blob/master/README.md

Installs all necessary dependencies for the production build. Ensure Node.js is installed.

```bash
npm install --production
```

--------------------------------

### Start Server with Command Line Options

Source: https://context7.com/rse/studio-canvas/llms.txt

Start the server with custom configuration options for network, directories, and FreeD camera tracking. Options include logging level, directory paths, HTTP and FreeD addresses/ports, and camera mappings.

```bash
# Start with default settings
npm start server

# Start with custom HTTP port and address
node dst/server/index.js -a 0.0.0.0 -p 12345

# Full configuration with FreeD camera tracking
node dst/server/index.js \
  -v 3 \
  -l server.log \
  -c ./res/canvas \
  -m ./res/media \
  -s ./var \
  -a 0.0.0.0 \
  -p 8080 \
  -A 0.0.0.0 \
  -P 5555 \
  -C "192.168.1.100:CAM1"
  -C "192.168.1.101:CAM2"
  -C "192.168.1.102:CAM3"
  -C "192.168.1.103:CAM4"

# Command line options:
# -h, --help         Show usage help
# -V, --version      Show program version
# -v, --log-level    Logging verbosity (0-3, default: 2)
# -l, --log-file     Log file path (default: stdout)
# -c, --canvas-dir   Canvas images directory
# -m, --media-dir    Media files directory
# -s, --state-dir    State persistence directory
# -a, --http-addr    HTTP listen address (default: 0.0.0.0)
# -p, --http-port    HTTP listen port (default: 8080)
# -A, --freed-addr   FreeD UDP listen address (default: 0.0.0.0)
# -P, --freed-port   FreeD UDP listen port (default: 5555)
# -C, --freed-cam    Camera IP to name mapping (format: ip:name)
```

--------------------------------

### Install Development Dependencies

Source: https://github.com/rse/studio-canvas/blob/master/README.md

Installs all dependencies required for development, including development-specific packages. Ensure Node.js is installed.

```bash
npm install
```

--------------------------------

### Run Production Build

Source: https://github.com/rse/studio-canvas/blob/master/README.md

Executes the production build process once. This command should be run after installing dependencies.

```bash
npm start build
```

--------------------------------

### Run Production Server

Source: https://github.com/rse/studio-canvas/blob/master/README.md

Starts the bare server component for production use. Access the client via a web browser.

```bash
npm start server
```

--------------------------------

### Get Current Studio-Canvas Scene State

Source: https://context7.com/rse/studio-canvas/llms.txt

Retrieves the complete current state of the virtual studio scene. Use this to get all display elements, camera configurations, canvas settings, and renderer options.

```bash
# Get the complete scene state
curl -X GET "http://localhost:8080/state"
```

```json
{
  "streams": {
    "device": "",
    "width": 1920,
    "height": 1080,
    "fps": 30
  },
  "canvas": {
    "id": "hexagons",
    "texture1": "/canvas/STD/hexagons-1.jpg",
    "texture2": "/canvas/STD/hexagons-2.jpg",
    "fadeTrans": 150,
    "fadeWait": 10000,
    "transType": "fade",
    "transTime": 2.0,
    "rotationZ": 0,
    "textureLit": false
  },
  "monitor": {
    "enable": false,
    "source": "S2",
    "fadeTime": 2.0,
    "scale": 1.0,
    "rotate": 10,
    "lift": 0,
    "distance": 0,
    "opacity": 1.0,
    "chromaKey": {
      "enable": false,
      "threshold": 0.4,
      "smoothing": 0.1
    }
  },
  "decal": {
    "enable": false,
    "source": "S1",
    "fadeTime": 2.0,
    "scale": 1.0,
    "rotate": -25,
    "lift": -2.5,
    "opacity": 1.0,
    "borderRad": 40,
    "borderCrop": 0,
    "chromaKey": {
      "enable": false,
      "threshold": 0.4,
      "smoothing": 0.1
    }
  },
  "lights": {
    "intensity1": 300,
    "intensity2": 300,
    "intensity3": 300
  },
  "CAM1": {
    "hullPosition": { "x": 0, "y": 0, "z": 0 },
    "caseRotation": { "x": 0, "y": 0, "z": 0, "ym": 1 },
    "lensRotation": { "x": 0, "xm": 1 },
    "fov": { "m": 1 }
  },
  "renderer": {
    "program": 30,
    "preview": 15,
    "other": 0,
    "overlay": false
  }
}
```

--------------------------------

### Run Development Build and Server Continuously

Source: https://github.com/rse/studio-canvas/blob/master/README.md

Starts the development build process and the server component continuously. This is ideal for active development work.

```bash
npm start dev
```

--------------------------------

### Get Media Files Index

Source: https://context7.com/rse/studio-canvas/llms.txt

Returns a list of all available media files (images and videos) that can be used for display overlays.

```APIDOC
## GET /media

### Description
Returns a list of all available media files.

### Method
GET

### Endpoint
/media

### Response
#### Success Response (200)
- **media** (array) - A list of media file objects.
  - **id** (string) - Unique identifier for the media file.
  - **name** (string) - Display name of the media file.
  - **group** (string) - Group identifier for the media file.
  - **texture** (string) - Path to the media file.
  - **type** (string) - MIME type of the media file.
  - **loop** (boolean) - Whether the media should loop.
  - **stack** (boolean) - Whether the media can be stacked.

#### Response Example
```json
{
  "media": [
    {
      "id": "STD/placeholder-black-1",
      "name": "Placeholder Black 1",
      "group": "STD",
      "texture": "/media/STD/placeholder-black-1.png",
      "type": "Image/PNG",
      "loop": false,
      "stack": false
    }
  ]
}
```
```

--------------------------------

### GET /state

Source: https://context7.com/rse/studio-canvas/llms.txt

Retrieves the complete current state of the virtual studio scene, including all display elements, camera configurations, canvas settings, and renderer options.

```APIDOC
## GET /state

### Description
Retrieves the complete current state of the virtual studio scene, including all display elements, camera configurations, canvas settings, and renderer options.

### Method
GET

### Endpoint
/state

### Response
#### Success Response (200)
- **streams** (object) - Stream configuration.
- **canvas** (object) - Canvas configuration.
- **monitor** (object) - Monitor overlay configuration.
- **decal** (object) - Decal overlay configuration.
- **lights** (object) - Lighting configuration.
- **CAM1** (object) - Camera 1 configuration.
- **renderer** (object) - Renderer configuration.

#### Response Example
{
  "streams": {
    "device": "",
    "width": 1920,
    "height": 1080,
    "fps": 30
  },
  "canvas": {
    "id": "hexagons",
    "texture1": "/canvas/STD/hexagons-1.jpg",
    "texture2": "/canvas/STD/hexagons-2.jpg",
    "fadeTrans": 150,
    "fadeWait": 10000,
    "transType": "fade",
    "transTime": 2.0,
    "rotationZ": 0,
    "textureLit": false
  },
  "monitor": {
    "enable": false,
    "source": "S2",
    "fadeTime": 2.0,
    "scale": 1.0,
    "rotate": 10,
    "lift": 0,
    "distance": 0,
    "opacity": 1.0,
    "chromaKey": {
      "enable": false,
      "threshold": 0.4,
      "smoothing": 0.1
    }
  },
  "decal": {
    "enable": false,
    "source": "S1",
    "fadeTime": 2.0,
    "scale": 1.0,
    "rotate": -25,
    "lift": -2.5,
    "opacity": 1.0,
    "borderRad": 40,
    "borderCrop": 0,
    "chromaKey": {
      "enable": false,
      "threshold": 0.4,
      "smoothing": 0.1
    }
  },
  "lights": {
    "intensity1": 300,
    "intensity2": 300,
    "intensity3": 300
  },
  "CAM1": {
    "hullPosition": { "x": 0, "y": 0, "z": 0 },
    "caseRotation": { "x": 0, "y": 0, "z": 0, "ym": 1 },
    "lensRotation": { "x": 0, "xm": 1 },
    "fov": { "m": 1 }
  },
  "renderer": {
    "program": 30,
    "preview": 15,
    "other": 0,
    "overlay": false
  }
}
```

--------------------------------

### Get Media Files Index

Source: https://context7.com/rse/studio-canvas/llms.txt

Returns a list of all available media files, including images and videos, that can be used for display overlays. Each entry contains an ID, name, texture path, and type.

```bash
curl -X GET "http://localhost:8080/media"
```

--------------------------------

### Mixer State

Source: https://context7.com/rse/studio-canvas/llms.txt

Get the current mixer preview/program state for camera switching.

```APIDOC
## GET /mixer/state

### Description
Retrieves the current preview and program camera states for the mixer.

### Method
GET

### Endpoint
/mixer/state

### Response
#### Success Response (200)
- **preview** (string) - The camera currently in preview mode.
- **program** (string) - The camera currently in program mode.

#### Response Example
```json
{
  "preview": "CAM1",
  "program": "CAM2"
}
```
```

--------------------------------

### Get Presets Overview

Source: https://context7.com/rse/studio-canvas/llms.txt

Retrieves the status of all 12 preset slots, indicating the number of state fields and their lock status for each slot.

```bash
curl -X GET "http://localhost:8080/state/preset"
```

--------------------------------

### Get all available canvas images

Source: https://context7.com/rse/studio-canvas/llms.txt

Retrieves a list of all available canvas images that can be used in the studio.

```APIDOC
## GET /canvas

### Description
Retrieves a list of all available canvas images.

### Method
GET

### Endpoint
/canvas

### Response
#### Success Response (200)
- **images** (array) - A list of canvas image objects.
  - **id** (string) - Unique identifier for the canvas image.
  - **name** (string) - Display name of the canvas image.
  - **group** (string) - Group identifier for the canvas image.
  - **texture1** (string) - Path to the primary texture file.
  - **texture2** (string) - Path to the secondary texture file.
  - **fadeTrans** (integer) - Fade transition time in milliseconds.
  - **fadeWait** (integer) - Fade wait time in milliseconds.

#### Response Example
```json
{
  "images": [
    {
      "id": "hexagons",
      "name": "Hexagons",
      "group": "STD",
      "texture1": "/canvas/STD/hexagons-1.jpg",
      "texture2": "/canvas/STD/hexagons-2.jpg",
      "fadeTrans": 1500,
      "fadeWait": 10000
    }
  ]
}
```
```

--------------------------------

### Get Presets Overview

Source: https://context7.com/rse/studio-canvas/llms.txt

Returns the status of all 12 preset slots showing how many state fields each preset contains and their lock status.

```APIDOC
## GET /state/preset

### Description
Returns the status of all preset slots.

### Method
GET

### Endpoint
/state/preset

### Response
#### Success Response (200)
- **status** (array) - An array of integers representing the number of state fields in each preset slot.
- **locked** (array) - An array of booleans indicating whether each preset slot is locked.
```

--------------------------------

### Get Mixer State

Source: https://context7.com/rse/studio-canvas/llms.txt

Retrieves the current mixer preview and program states, indicating which cameras are currently assigned to these modes.

```bash
curl -X GET "http://localhost:8080/mixer/state"
```

--------------------------------

### Get Available Canvas Images

Source: https://context7.com/rse/studio-canvas/llms.txt

Retrieves a list of all available canvas images. The response includes details like ID, name, texture paths, and fade transition parameters.

```bash
curl -X GET "http://localhost:8080/canvas"
```

--------------------------------

### Run Development Build

Source: https://github.com/rse/studio-canvas/blob/master/README.md

Executes the development build process once. This command is used for setting up the development environment.

```bash
npm start build-dev
```

--------------------------------

### Perform Mixer Cut Transition

Source: https://context7.com/rse/studio-canvas/llms.txt

Executes a cut transition, swapping the current preview camera with the program camera. This is a direct, instantaneous switch.

```bash
curl -X GET "http://localhost:8080/mixer/cut"
```

--------------------------------

### Load Preset from Slot

Source: https://context7.com/rse/studio-canvas/llms.txt

Retrieves the partial state configuration stored in a specific preset slot. The response contains the canvas and monitor settings.

```bash
curl -X GET "http://localhost:8080/state/preset/1"
```

--------------------------------

### Select/Apply Preset

Source: https://context7.com/rse/studio-canvas/llms.txt

Merges a preset's state into the current state and notifies all connected clients.

```APIDOC
## GET /state/preset/{slot}/select

### Description
Applies the state from a specific preset slot to the current state.

### Method
GET

### Endpoint
/state/preset/{slot}/select

### Parameters
#### Path Parameters
- **slot** (integer) - Required - The preset slot number to apply.
```

--------------------------------

### Set Mixer Preview Camera

Source: https://context7.com/rse/studio-canvas/llms.txt

Sets a specific camera to be in preview mode. This prepares the camera for a potential cut or transition.

```bash
curl -X GET "http://localhost:8080/mixer/preview/CAM3"
```

--------------------------------

### Access Client URLs

Source: https://context7.com/rse/studio-canvas/llms.txt

Access the control interface or embed renderer instances in broadcast software. URLs specify the layer, camera, and whether to enable FreeD PTZ tracking.

```bash
# Control UI - for adjusting scene parameters
# Open in Google Chrome:
https://localhost:8080/

# Renderer mode - for embedding in OBS Studio or vMix browser sources
# Back layer render with PTZ tracking:
https://localhost:8080/#/render/back/CAM1?ptzFreeD=true

# Front layer render with PTZ tracking:
https://localhost:8080/#/render/front/CAM2?ptzFreeD=true

# Renderer without PTZ tracking:
https://localhost:8080/#/render/back/CAM3?ptzFreeD=false

# URL format: /#/render/{layer}/{camera}?ptzFreeD={true|false}
# layer: "back" or "front"
# camera: CAM1, CAM2, CAM3, or CAM4
# ptzFreeD: enable/disable FreeD PTZ tracking
```

--------------------------------

### Define Canvas with YAML

Source: https://context7.com/rse/studio-canvas/llms.txt

Define canvas images with fade transitions using YAML configuration files. Specify textures, fade durations, wait times, and exclusivity.

```yaml
# res/canvas/STD/hexagons.yaml
id:        hexagons
name:      Hexagons
texture1:  hexagons-1.jpg
texture2:  hexagons-2.jpg
fadeTrans: 1500
fadeWait:  10000
exclusive: false
```

```yaml
# res/canvas/custom/corporate.yaml
id:        corporate-blue
name:      Corporate Blue
group:     custom
texture1:  corporate-blue-1.jpg
texture2:  corporate-blue-2.jpg
fadeTrans: 2000
fadeWait:  30000
exclusive: true
```

--------------------------------

### POST /state

Source: https://context7.com/rse/studio-canvas/llms.txt

Replaces the complete scene state with a new configuration. All connected clients are notified via WebSocket of the state change.

```APIDOC
## POST /state

### Description
Replaces the complete scene state with a new configuration. All connected clients are notified via WebSocket of the state change.

### Method
POST

### Endpoint
/state

### Request Body
- **streams** (object) - Stream configuration.
- **canvas** (object) - Canvas configuration.
- **monitor** (object) - Monitor overlay configuration.
- **decal** (object) - Decal overlay configuration.
- **lights** (object) - Lighting configuration.
- **renderer** (object) - Renderer configuration.

### Request Example
{
  "streams": { "device": "", "width": 1920, "height": 1080, "fps": 30 },
  "canvas": {
    "id": "townhall",
    "texture1": "/canvas/STD/townhall-1.jpg",
    "texture2": "/canvas/STD/townhall-2.jpg",
    "fadeTrans": 2000,
    "fadeWait": 15000,
    "transType": "slide-l",
    "transTime": 1.5,
    "rotationZ": 0,
    "textureLit": true
  },
  "monitor": { "enable": true, "source": "S1", "fadeTime": 2.0, "scale": 1.2, "rotate": 0, "lift": 0, "distance": 0, "opacity": 1.0, "chromaKey": { "enable": false, "threshold": 0.4, "smoothing": 0.1 } },
  "decal": { "enable": false, "source": "S1", "fadeTime": 2.0, "scale": 1.0, "rotate": 0, "lift": 0, "opacity": 1.0, "borderRad": 0, "borderCrop": 0, "chromaKey": { "enable": false, "threshold": 0.4, "smoothing": 0.1 } },
  "lights": { "intensity1": 400, "intensity2": 400, "intensity3": 400 },
  "renderer": { "program": 30, "preview": 15, "other": 0, "overlay": false }
}

### Response
#### Success Response (204)
No Content is returned on successful update.
```

--------------------------------

### Configure Image Fade Transition

Source: https://github.com/rse/studio-canvas/blob/master/res/canvas/README.md

Use this YAML structure to define parameters for fading between two images on a canvas. Ensure images and the YAML file are in the same directory.

```yaml
id:        UniqueId
name:      DescriptiveName
texture1:  filenameOfTheFirstImage.png
texture2:  filenameOfTheSecondImage.png
fadeTrans: 1500
fadeWait:  10000
exclusive: true
```

--------------------------------

### Connect to WebSocket Server

Source: https://context7.com/rse/studio-canvas/llms.txt

Connect to the Studio-Canvas WebSocket endpoint as either a control or renderer client. Handles incoming messages for state updates, camera PTZ data, mixer changes, and synchronization signals. Use `ws.send` to subscribe or unsubscribe from camera data.

```javascript
// Connect as control client
const ws = new WebSocket('wss://localhost:8080/ws/control');

// Connect as renderer client
const ws = new WebSocket('wss://localhost:8080/ws/render');

ws.onopen = () => {
  console.log('Connected to Studio-Canvas server');
};

ws.onmessage = (event) => {
  const message = JSON.parse(event.data);

  switch (message.cmd) {
    case 'STATE':
      // Partial state update received
      console.log('State changed:', message.arg.state);
      applyStateChanges(message.arg.state);
      break;

    case 'PTZ':
      // Camera PTZ data received (for subscribed cameras)
      console.log(`Camera ${message.arg.cam} PTZ:`, message.arg.state);
      updateCameraPosition(message.arg.cam, message.arg.state);
      break;

    case 'MIXER':
      // Mixer preview/program changed
      console.log('Mixer state:', message.arg.mixer);
      break;

    case 'VIEWPOINT':
      // Camera viewpoint mapping changed
      console.log('Viewpoint state:', message.arg.viewpoint);
      break;

    case 'SYNC':
      // Renderer sync signal received
      console.log('Sync timestamp:', message.arg.timestamp);
      synchronizeRenderers(message.arg.timestamp);
      break;

    case 'STATS':
      // Connection statistics update
      console.log('Connected peers:', message.arg.stats.peers);
      break;
  }
};

// Subscribe to PTZ data for a specific camera
ws.send(JSON.stringify({ cmd: 'SUBSCRIBE', arg: 'CAM1' }));

// Unsubscribe from camera PTZ data
ws.send(JSON.stringify({ cmd: 'UNSUBSCRIBE', arg: 'CAM1' }));
```

--------------------------------

### Load Preset

Source: https://context7.com/rse/studio-canvas/llms.txt

Retrieves the partial state stored in a specific preset slot.

```APIDOC
## GET /state/preset/{slot}

### Description
Retrieves the partial state stored in a specific preset slot.

### Method
GET

### Endpoint
/state/preset/{slot}

### Parameters
#### Path Parameters
- **slot** (integer) - Required - The preset slot number to load.
```

--------------------------------

### Synchronize Renderer Clients

Source: https://context7.com/rse/studio-canvas/llms.txt

Triggers a synchronization event to all connected renderer clients. This is useful for ensuring multiple render outputs are in sync.

```bash
curl -X GET "http://localhost:8080/canvas/sync"
```

--------------------------------

### Mixer Cut

Source: https://context7.com/rse/studio-canvas/llms.txt

Swaps preview and program cameras (performs a cut transition).

```APIDOC
## GET /mixer/cut

### Description
Performs a cut transition by swapping the preview and program cameras.

### Method
GET

### Endpoint
/mixer/cut
```

--------------------------------

### Apply Preset to Current State

Source: https://context7.com/rse/studio-canvas/llms.txt

Merges the state from a specified preset slot into the current active state and notifies all connected clients. This effectively applies the preset.

```bash
curl -X GET "http://localhost:8080/state/preset/3/select"
```

--------------------------------

### Save Preset

Source: https://context7.com/rse/studio-canvas/llms.txt

Stores a partial state configuration into a preset slot. Fails if the slot is locked.

```APIDOC
## POST /state/preset/{slot}

### Description
Saves the current state configuration to a specified preset slot.

### Method
POST

### Endpoint
/state/preset/{slot}

### Parameters
#### Path Parameters
- **slot** (integer) - Required - The preset slot number to save to.

#### Request Body
- **canvas** (object) - Canvas settings.
  - **id** (string) - Required - The ID of the canvas.
  - **texture1** (string) - Required - Path to the first texture.
  - **texture2** (string) - Required - Path to the second texture.
  - **transType** (string) - Optional - Transition type.
  - **transTime** (number) - Optional - Transition time in seconds.
- **monitor** (object) - Monitor settings.
  - **enable** (boolean) - Required - Whether the monitor is enabled.
  - **source** (string) - Optional - The source for the monitor.
  - **scale** (number) - Optional - The scale factor for the monitor.
- **decal** (object) - Decal settings.
  - **enable** (boolean) - Required - Whether the decal is enabled.

### Request Example
```json
{
  "canvas": {
    "id": "townhall",
    "texture1": "/canvas/STD/townhall-1.jpg",
    "texture2": "/canvas/STD/townhall-2.jpg",
    "transType": "fade",
    "transTime": 2.0
  },
  "monitor": {
    "enable": true,
    "source": "S1",
    "scale": 1.0
  },
  "decal": {
    "enable": false
  }
}
```

### Response
#### Success Response (204)
No Content.
```

--------------------------------

### Save Current State to Preset Slot

Source: https://context7.com/rse/studio-canvas/llms.txt

Stores the current canvas, monitor, and decal settings into a specified preset slot. This operation fails if the target slot is locked.

```bash
curl -X POST "http://localhost:8080/state/preset/2" \
  -H "Content-Type: application/json" \
  -d '{ \
    "canvas": { \
      "id": "townhall", \
      "texture1": "/canvas/STD/townhall-1.jpg", \
      "texture2": "/canvas/STD/townhall-2.jpg", \
      "transType": "fade", \
      "transTime": 2.0 \
    }, \
    "monitor": { \
      "enable": true, \
      "source": "S1", \
      "scale": 1.0 \
    }, \
    "decal": { \
      "enable": false \
    } \
  }'
```

--------------------------------

### Save Current Studio-Canvas Scene State

Source: https://context7.com/rse/studio-canvas/llms.txt

Replaces the complete scene state with a new configuration. All connected clients are notified via WebSocket of the state change. Use this to set a new scene configuration.

```bash
# Save a complete new state
curl -X POST "http://localhost:8080/state" \
  -H "Content-Type: application/json" \
  -d '{ "streams": { "device": "", "width": 1920, "height": 1080, "fps": 30 }, "canvas": { "id": "townhall", "texture1": "/canvas/STD/townhall-1.jpg", "texture2": "/canvas/STD/townhall-2.jpg", "fadeTrans": 2000, "fadeWait": 15000, "transType": "slide-l", "transTime": 1.5, "rotationZ": 0, "textureLit": true }, "monitor": { "enable": true, "source": "S1", "fadeTime": 2.0, "scale": 1.2, "rotate": 0, "lift": 0, "distance": 0, "opacity": 1.0, "chromaKey": { "enable": false, "threshold": 0.4, "smoothing": 0.1 } }, "decal": { "enable": false, "source": "S1", "fadeTime": 2.0, "scale": 1.0, "rotate": 0, "lift": 0, "opacity": 1.0, "borderRad": 0, "borderCrop": 0, "chromaKey": { "enable": false, "threshold": 0.4, "smoothing": 0.1 } }, "lights": { "intensity1": 400, "intensity2": 400, "intensity3": 400 }, "renderer": { "program": 30, "preview": 15, "other": 0, "overlay": false } }'
```

--------------------------------

### Set Mixer Preview

Source: https://context7.com/rse/studio-canvas/llms.txt

Sets which camera is in preview mode.

```APIDOC
## GET /mixer/preview/{camera}

### Description
Sets the specified camera to preview mode.

### Method
GET

### Endpoint
/mixer/preview/{camera}

### Parameters
#### Path Parameters
- **camera** (string) - Required - The identifier of the camera to set to preview.
```

--------------------------------

### Display Configuration Type Definition

Source: https://context7.com/rse/studio-canvas/llms.txt

Defines the structure for display configurations, used for overlays like monitors, decals, plates, holograms, panes, and pillars. It includes settings for enabling, source selection, fading, scaling, rotation, positioning, opacity, and chroma keying.

```typescript
// Display configuration (monitor, decal, plate, hologram, pane, pillar)
type DisplayConfig = {
  enable: boolean;       // Enable this display
  source: string;        // Source: S1, S2 (streams) or M1-M4 (media)
  fadeTime: number;      // Fade in/out duration (seconds)
  scale: number;         // Scale factor
  rotate: number;        // Rotation (degrees)
  lift: number;          // Vertical offset
  distance?: number;     // Distance from camera
  opacity: number;       // Opacity (0-1)
  borderRad?: number;    // Border radius
  borderCrop?: number;   // Border crop amount
  chromaKey: {
    enable: boolean;     // Enable chroma keying
    threshold: number;   // Key threshold
    smoothing: number;   // Edge smoothing
  };
};

```

--------------------------------

### Synchronize Renderers

Source: https://context7.com/rse/studio-canvas/llms.txt

Triggers a sync event to all connected renderer clients, useful for synchronizing multiple render outputs.

```APIDOC
## GET /canvas/sync

### Description
Triggers a synchronization event to all connected renderer clients.

### Method
GET

### Endpoint
/canvas/sync

### Response
#### Success Response (204)
No Content.
```

--------------------------------

### Patch Studio-Canvas Scene State

Source: https://context7.com/rse/studio-canvas/llms.txt

Partially updates the scene state with only the specified fields. This is the recommended method for real-time adjustments from the control UI. It allows for granular changes without replacing the entire scene configuration.

```bash
# Enable the monitor with specific settings
curl -X PATCH "http://localhost:8080/state" \
  -H "Content-Type: application/json" \
  -d '{ "monitor": { "enable": true, "scale": 1.5, "opacity": 0.9 } }'
```

```bash
# Change canvas with transition effect
curl -X PATCH "http://localhost:8080/state" \
  -H "Content-Type: application/json" \
  -d '{ "canvas": { "id": "hexagons2", "texture1": "/canvas/STD/hexagons2-1.jpg", "texture2": "/canvas/STD/hexagons2-2.jpg", "transType": "morph", "transTime": 3.0 } }'
```

```bash
# Adjust camera calibration
curl -X PATCH "http://localhost:8080/state" \
  -H "Content-Type: application/json" \
  -d '{ "CAM2": { "hullPosition": { "x": 0.5, "y": 0, "z": -0.2 }, "caseRotation": { "x": 0, "y": 5, "z": 0, "ym": 1.02 }, "fov": { "m": 0.98 } } }'
```

--------------------------------

### PATCH /state

Source: https://context7.com/rse/studio-canvas/llms.txt

Partially updates the scene state with only the specified fields. This is the recommended method for real-time adjustments from the control UI.

```APIDOC
## PATCH /state

### Description
Partially updates the scene state with only the specified fields. This is the recommended method for real-time adjustments from the control UI.

### Method
PATCH

### Endpoint
/state

### Request Body
- **monitor** (object) - Optional. Monitor overlay configuration to update.
- **canvas** (object) - Optional. Canvas configuration to update.
- **CAM2** (object) - Optional. Camera 2 configuration to update.

### Request Example
```json
{
  "monitor": {
    "enable": true,
    "scale": 1.5,
    "opacity": 0.9
  }
}
```

```json
{
  "canvas": {
    "id": "hexagons2",
    "texture1": "/canvas/STD/hexagons2-1.jpg",
    "texture2": "/canvas/STD/hexagons2-2.jpg",
    "transType": "morph",
    "transTime": 3.0
  }
}
```

```json
{
  "CAM2": {
    "hullPosition": { "x": 0.5, "y": 0, "z": -0.2 },
    "caseRotation": { "x": 0, "y": 5, "z": 0, "ym": 1.02 },
    "fov": { "m": 0.98 }
  }
}
```

### Response
#### Success Response (204)
No Content is returned on successful update.
```

--------------------------------

### Camera Calibration Configuration Type Definition

Source: https://context7.com/rse/studio-canvas/llms.txt

Defines the structure for camera calibration settings. This includes parameters for hull position, case rotation, lens rotation, and field of view, essential for accurate virtual camera tracking and integration.

```typescript
// Camera calibration configuration
type CameraConfig = {
  hullPosition: { x: number; y: number; z: number };
  caseRotation: { x: number; y: number; z: number; ym: number };
  lensRotation: { x: number; xm: number };
  fov: { m: number };
};

```

--------------------------------

### Complete Scene State Type Definition

Source: https://context7.com/rse/studio-canvas/llms.txt

Defines the entire structure of the scene state object used in the API. This includes settings for video streams, media sources, canvas rendering, display overlays (monitor, decal, plate, hologram, pane, pillar), lighting, avatars, reference objects, camera calibrations, and renderer output.

```typescript
type StateType = {
  streams: {
    device: string;      // Video device name
    width: number;       // Stream width (default: 1920)
    height: number;      // Stream height (default: 1080)
    fps: number;         // Frames per second (default: 30)
  };
  media: {
    media1: string;      // Media slot 1 URL
    media2: string;      // Media slot 2 URL
    media3: string;      // Media slot 3 URL
    media4: string;      // Media slot 4 URL
  };
  canvas: {
    id: string;          // Canvas identifier
    texture1: string;    // Primary texture URL
    texture2?: string;   // Secondary texture URL (for fading)
    fadeTrans?: number;  // Fade transition duration (ms)
    fadeWait?: number;   // Wait time between fades (ms)
    transType: string;   // Transition type: fade|slide-l|slide-r|slice|perlin|morph|ripple|grid|square
    transTime: number;   // Transition duration (seconds)
    rotationZ: number;   // Canvas Z rotation (degrees)
    textureLit: boolean; // Apply lighting to texture
  };
  monitor: DisplayConfig;   // Monitor overlay settings
  decal: DisplayConfig;     // Decal overlay settings
  plate: DisplayConfig;     // Plate overlay settings
  hologram: DisplayConfig;  // Hologram overlay settings
  pane: DisplayConfig;      // Pane overlay settings
  pillar: DisplayConfig;    // Pillar overlay settings
  mask: {
    enable: boolean;     // Enable mask
    source: string;      // Source stream (S1-S4, M1-M4)
    scale: number;       // Scale factor
    borderRad: number;   // Border radius
  };
  lights: {
    intensity1: number;  // Light 1 intensity (0-1000)
    intensity2: number;  // Light 2 intensity
    intensity3: number;  // Light 3 intensity
  };
  avatars: {
    enable1: boolean;    // Enable avatar 1
    size1: number;       // Avatar 1 size
    rotate1: number;     // Avatar 1 rotation
    enable2: boolean;    // Enable avatar 2
    size2: number;       // Avatar 2 size
    rotate2: number;     // Avatar 2 rotation
  };
  references: {
    enable: boolean;     // Show reference objects
  };
  CAM1: CameraConfig;    // Camera 1 calibration
  CAM2: CameraConfig;    // Camera 2 calibration
  CAM3: CameraConfig;    // Camera 3 calibration
  CAM4: CameraConfig;    // Camera 4 calibration
  renderer: {
    program: number;     // Program output FPS target
    preview: number;     // Preview output FPS target
    other: number;       // Other outputs FPS target
    overlay: boolean;    // Show FPS overlay
  };
};
```

--------------------------------

### Delete Preset

Source: https://context7.com/rse/studio-canvas/llms.txt

Clears a preset slot. Fails if the slot is locked.

```APIDOC
## DELETE /state/preset/{slot}

### Description
Clears the content of a specified preset slot.

### Method
DELETE

### Endpoint
/state/preset/{slot}

### Parameters
#### Path Parameters
- **slot** (integer) - Required - The preset slot number to clear.
```

--------------------------------

### Lock/Unlock Preset Slot

Source: https://context7.com/rse/studio-canvas/llms.txt

Protects or unprotects a specified preset slot from further modifications. Use the 'lock' endpoint to protect and 'unlock' to allow changes.

```bash
curl -X GET "http://localhost:8080/state/preset/1/lock"
```

```bash
curl -X GET "http://localhost:8080/state/preset/1/unlock"
```

--------------------------------

### Set Camera Viewpoint

Source: https://context7.com/rse/studio-canvas/llms.txt

Changes which camera's viewpoint a specific camera render uses. This allows one camera to effectively 'look' through another's lens.

```bash
curl -X GET "http://localhost:8080/viewpoint/CAM1/CAM2"
```

--------------------------------

### Set Viewpoint

Source: https://context7.com/rse/studio-canvas/llms.txt

Changes which camera's viewpoint a specific camera render uses.

```APIDOC
## GET /viewpoint/{render_camera}/{viewpoint_camera}

### Description
Sets the viewpoint for a rendering camera to match another camera's viewpoint.

### Method
GET

### Endpoint
/viewpoint/{render_camera}/{viewpoint_camera}

### Parameters
#### Path Parameters
- **render_camera** (string) - Required - The camera whose render will use another's viewpoint.
- **viewpoint_camera** (string) - Required - The camera whose viewpoint will be used.
```

--------------------------------

### Lock/Unlock Preset

Source: https://context7.com/rse/studio-canvas/llms.txt

Protects or unprotects a preset slot from modifications.

```APIDOC
## GET /state/preset/{slot}/lock
## GET /state/preset/{slot}/unlock

### Description
Locks or unlocks a specified preset slot, preventing or allowing modifications.

### Method
GET

### Endpoint
/state/preset/{slot}/lock
/state/preset/{slot}/unlock

### Parameters
#### Path Parameters
- **slot** (integer) - Required - The preset slot number to lock or unlock.
```

--------------------------------

### Delete Preset Slot

Source: https://context7.com/rse/studio-canvas/llms.txt

Clears the contents of a specified preset slot. This action will fail if the preset slot is locked.

```bash
curl -X DELETE "http://localhost:8080/state/preset/2"
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.