# Recorder

Record audio and video from your camera, microphone, or screen share directly in the browser.

## Live Demo

<iframe id="rec-demo" src="/online/webapp/recorder" width="100%" height="500" frameborder="0" allow="camera; microphone; display-capture" style="border:1px solid #ccc; border-radius:4px;"></iframe>

<script>window._wsConnect('rec-demo', 'recSocket');</script>

## Embed

```html
<iframe src="https://sgapps.io/online/webapp/recorder"
    width="100%" height="600" frameborder="0"
    allow="camera; microphone; display-capture"></iframe>
```

> **Required permissions:** The `allow` attribute must include `camera`, `microphone`, and `display-capture` for the recorder to access media devices.

## Features

- Record from webcam, microphone, or screen share
- Real-time preview during recording
- Save recordings to GridFS file system
- Multiple stream sources with position control
- Stream capture for advanced use cases

## Embed Mode

```html
<script src="https://sgapps.io/components/window-socket/index.js"></script>
<script>
    var socket = new WindowSocket(document.getElementById('rec-demo').contentWindow);
    socket.start();
    socket.on("webapp::connection::ping", function () {
        socket.fire("webapp::instance::embed-mode", true);
    });
</script>
```