Concepts
Async Collaboration
- Comments
- In-app Notifications
- Recorder
- Recorder Control Panel
- Recorder Player
- Recorder Player Expanded
- Recorder Preview Steps Dialog
- Recorder Tool
- Media Source Settings
- Subtitles
- Transcription
- Video Editor
- Inline Reactions
- Arrows
Realtime Collaboration
- Presence
- Cursors
- Live Selection
- Huddle
- Single Editor Mode
Recorder Control Panel
Overview
Recorder control panel component.
<VeltWireframe>
<VeltRecorderControlPanelWireframe>
{/* Floating Mode */}
<VeltRecorderControlPanelWireframe.FloatingMode>
<VeltRecorderControlPanelWireframe.FloatingMode.Container>
<VeltRecorderControlPanelWireframe.FloatingMode.Video />
<VeltRecorderControlPanelWireframe.FloatingMode.Waveform />
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton>
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton.On />
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton.Off />
</VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton>
<VeltRecorderControlPanelWireframe.FloatingMode.Paused />
</VeltRecorderControlPanelWireframe.FloatingMode.Container>
<VeltRecorderControlPanelWireframe.FloatingMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.FloatingMode.Video />
<VeltRecorderControlPanelWireframe.FloatingMode.Screen />
</VeltRecorderControlPanelWireframe.FloatingMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.FloatingMode.Loading />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.TypeIcon />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Time />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Waveform />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle.Pause />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle.Play />
</VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Stop />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Clear />
</VeltRecorderControlPanelWireframe.FloatingMode.ActionBar>
</VeltRecorderControlPanelWireframe.FloatingMode>
{/* Thread Mode */}
<VeltRecorderControlPanelWireframe.ThreadMode>
<VeltRecorderControlPanelWireframe.ThreadMode.Video />
<VeltRecorderControlPanelWireframe.ThreadMode.Loading />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.TypeIcon />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Time />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Waveform />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle.Pause />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle.Play />
</VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Stop />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Clear />
</VeltRecorderControlPanelWireframe.ThreadMode.ActionBar>
<VeltRecorderControlPanelWireframe.ThreadMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.ThreadMode.Video />
<VeltRecorderControlPanelWireframe.ThreadMode.Screen />
</VeltRecorderControlPanelWireframe.ThreadMode.ScreenMiniContainer>
</VeltRecorderControlPanelWireframe.ThreadMode>
</VeltRecorderControlPanelWireframe>
</VeltWireframe>
We recommend that you familiarize yourselves with UI Customization Concepts before attempting to modify any components.
<VeltWireframe>
<VeltRecorderControlPanelWireframe>
{/* Floating Mode */}
<VeltRecorderControlPanelWireframe.FloatingMode>
<VeltRecorderControlPanelWireframe.FloatingMode.Container>
<VeltRecorderControlPanelWireframe.FloatingMode.Video />
<VeltRecorderControlPanelWireframe.FloatingMode.Waveform />
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton>
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton.On />
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton.Off />
</VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton>
<VeltRecorderControlPanelWireframe.FloatingMode.Paused />
</VeltRecorderControlPanelWireframe.FloatingMode.Container>
<VeltRecorderControlPanelWireframe.FloatingMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.FloatingMode.Video />
<VeltRecorderControlPanelWireframe.FloatingMode.Screen />
</VeltRecorderControlPanelWireframe.FloatingMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.FloatingMode.Loading />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.TypeIcon />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Time />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Waveform />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle.Pause />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle.Play />
</VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Stop />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Clear />
</VeltRecorderControlPanelWireframe.FloatingMode.ActionBar>
</VeltRecorderControlPanelWireframe.FloatingMode>
{/* Thread Mode */}
<VeltRecorderControlPanelWireframe.ThreadMode>
<VeltRecorderControlPanelWireframe.ThreadMode.Video />
<VeltRecorderControlPanelWireframe.ThreadMode.Loading />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.TypeIcon />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Time />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Waveform />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle.Pause />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle.Play />
</VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Stop />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Clear />
</VeltRecorderControlPanelWireframe.ThreadMode.ActionBar>
<VeltRecorderControlPanelWireframe.ThreadMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.ThreadMode.Video />
<VeltRecorderControlPanelWireframe.ThreadMode.Screen />
</VeltRecorderControlPanelWireframe.ThreadMode.ScreenMiniContainer>
</VeltRecorderControlPanelWireframe.ThreadMode>
</VeltRecorderControlPanelWireframe>
</VeltWireframe>
Was this page helpful?
<VeltWireframe>
<VeltRecorderControlPanelWireframe>
{/* Floating Mode */}
<VeltRecorderControlPanelWireframe.FloatingMode>
<VeltRecorderControlPanelWireframe.FloatingMode.Container>
<VeltRecorderControlPanelWireframe.FloatingMode.Video />
<VeltRecorderControlPanelWireframe.FloatingMode.Waveform />
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton>
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton.On />
<VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton.Off />
</VeltRecorderControlPanelWireframe.FloatingMode.CollapsedButton>
<VeltRecorderControlPanelWireframe.FloatingMode.Paused />
</VeltRecorderControlPanelWireframe.FloatingMode.Container>
<VeltRecorderControlPanelWireframe.FloatingMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.FloatingMode.Video />
<VeltRecorderControlPanelWireframe.FloatingMode.Screen />
</VeltRecorderControlPanelWireframe.FloatingMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.FloatingMode.Loading />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.TypeIcon />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Time />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Waveform />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle.Pause />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle.Play />
</VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Stop />
<VeltRecorderControlPanelWireframe.FloatingMode.ActionBar.Clear />
</VeltRecorderControlPanelWireframe.FloatingMode.ActionBar>
</VeltRecorderControlPanelWireframe.FloatingMode>
{/* Thread Mode */}
<VeltRecorderControlPanelWireframe.ThreadMode>
<VeltRecorderControlPanelWireframe.ThreadMode.Video />
<VeltRecorderControlPanelWireframe.ThreadMode.Loading />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.TypeIcon />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Time />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Waveform />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle.Pause />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle.Play />
</VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Toggle>
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Stop />
<VeltRecorderControlPanelWireframe.ThreadMode.ActionBar.Clear />
</VeltRecorderControlPanelWireframe.ThreadMode.ActionBar>
<VeltRecorderControlPanelWireframe.ThreadMode.ScreenMiniContainer>
<VeltRecorderControlPanelWireframe.ThreadMode.Video />
<VeltRecorderControlPanelWireframe.ThreadMode.Screen />
</VeltRecorderControlPanelWireframe.ThreadMode.ScreenMiniContainer>
</VeltRecorderControlPanelWireframe.ThreadMode>
</VeltRecorderControlPanelWireframe>
</VeltWireframe>