# Output Preview

The Output Preview is a floating, draggable window that displays a live thumbnail of one or all of the engine's rendered outputs directly inside the web UI — no external NDI monitor or physical display connection required.

![Output preview window](/files/uedhvDVHfBFfkNgcUBj0)

## Opening the Preview

Click the **monitor icon** (🖥) in the header toolbar. The button lights up when the preview is active. Click it again to close the preview.

The preview persists when you navigate between the Editor, Control, and User views.

## Controls

| Control             | Description                                                                                                                           |
| ------------------- | ------------------------------------------------------------------------------------------------------------------------------------- |
| **Output selector** | Choose a single display, a project screen, or "All" to view all outputs combined. Displays and screens are listed in separate groups. |
| **Frame rate**      | 2, 4, 10, or 30 fps — lower rates reduce CPU and network load                                                                         |
| **Resolution**      | Width tier (400, 600, or 800 px). The height adjusts automatically to match the aspect ratio of the selected display or screen.       |
| **Drag**            | Drag the title bar to reposition anywhere in the browser window                                                                       |
| **Resize**          | Drag the bottom-right corner to resize                                                                                                |
| **Close**           | Click × or click the toolbar button again                                                                                             |

## Connection Status

A small indicator in the preview title bar shows the connection state:

| Colour    | Meaning                                          |
| --------- | ------------------------------------------------ |
| 🟢 Green  | Receiving frames from the engine                 |
| 🟡 Yellow | Reconnecting (exponential back-off retry active) |
| 🔴 Red    | Engine not reachable                             |

## Performance Notes

* The preview polls the engine via HTTP. It is **not** a live stream — it refreshes at the selected frame rate.
* The preview uses an off-screen `<canvas>` for JPEG conversion, minimising main-thread blocking.
* The preview **automatically pauses** after 2 seconds of inactivity (e.g. tab hidden, window minimised) to conserve CPU and GPU resources.
* Closing the preview panel stops all polling immediately.

> **Tip:** Use 2 fps for a "confidence monitor" that lets you verify output without any noticeable performance impact.

## Intended Uses

* **Remote operation:** Verify the engine output from a laptop or tablet without a dedicated HDMI monitor.
* **Rehearsal:** Quickly check that the right media is playing on the right screen.
* **Debugging:** Confirm that warping and effects are applying correctly without leaving your desk.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.exaplay.one/v3/user-interface/output-preview.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
