Veeting Blocks always require an active meeting. You can schedule meetings through our web application or through our REST APIs.
If you don't have an account yet and just want to try out the blocks, generate a demo meeting ID here:
If you have an existing meeting ID, copy it into the text field below and click Join meeting
:
The video Block displays the videos of the meeting participants
<vrb-video
has-mute-control-buttons="true"
has-action-control-buttons="true"
container-layout="standard">
</vrb-video>
Name | Type | Description |
---|---|---|
has-mute-control-buttons | Boolean | Optional, hides the mute buttons if set to false, defaults to true |
has-action-control-buttons | Boolean | Optional, hides the volume control and raise hand buttons if set to false, defaults to true |
container-layout | "standard" or "fill" | Optional, switches the video display layout between "standard" and "fill". In most cases you would like to set this to "fill". Defaults for historical reasons to "standard" |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
This blocks displays a form for the users to select the audio and video devices
<vrb-device-selection
camera="true"
auto-apply-new-devices="true">
</vrb-device-selection>
Name | Type | Description |
---|---|---|
Camera | Boolean | Optional, hides the camera selection dropdown if set to false. This is useful for audio only meetings for instance. Defaults to true. |
auto-apply-new-devices | Boolean | Automatically apply the newly selected devices. You need to restart the connection manually if this is set to false. Defaults to false. |
The following events are available to subscribe to. Example:
document.querySelector("vrb-device-selection").on("selection", (saved) => {
console.log("Have the devices changed?", saved ? "Yes" : "No");
});
Name | Callback type | Description |
---|---|---|
selection | Boolean | Triggered when the user clicks on "Save" or "Cancel". The callback parameter will be true if the users saved the selection, otherwise false. |
Changing the media devices will store the selected IDs in the local storage. If the user is currently in a meeting and you want to immediately apply the newly selected devices, you must do so explicitly by restarting the media connections:
document.querySelector("vrb-device-selection").on("selection", (saved) => {
if (saved) {
veeting.Blocks.api.restartMediaConnections();
}
})
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The screensharing Block displays the Meeting Screensharing tool.
<vrb-screensharing
show-toolbar="true">
</vrb-screensharing>
Name | Type | Description |
---|---|---|
show-toolbar | Boolean | Optional, shows the toolbar to manage polls, defaults to true |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The whiteboard Block displays the Meeting Whiteboard tool.
<vrb-whiteboard
show-reduced-width="false"
show-external-whiteboard-link="false"
show-toolbar="true">
</vrb-whiteboard>
Name | Type | Description |
---|---|---|
show-reduced-width | Boolean | Optional, displays a smaller toolbar in the documents viewer, defaults to false |
show-external-whiteboard-link | Boolean | Optional, adds a QR-code button to the toolbar to share the whiteboard with an external device, defaults to false |
show-toolbar | Boolean | Optional, shows the toolbar to manage polls, defaults to true |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The meeting documents Block displays the Documents Sharing tool.
<vrb-documents
show-reduced-width="false"
show-toolbar="true">
</vrb-documents>
Name | Type | Description |
---|---|---|
show-reduced-width | Boolean | Optional, displays a smaller toolbar in the documents viewer, defaults to false |
show-toolbar | Boolean | Optional, decides if the toolbar of the agenda should be visible or not, defaults to true |
Note: Check out "How to run the Block Examples" to see how you can run this example.
The meeting agenda Block displays the Meeting Agenda.
<vrb-agenda
show-on-small-screen="false"
show-toolbar="true">
</vrb-agenda>
Name | Type | Description |
---|---|---|
show-on-small-screen | Boolean | Optional, displays a smaller toolbar, defaults to false |
show-toolbar | Boolean | Optional, decides if the toolbar of the agenda should be visible or not, defaults to true |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The meeting chat Block displays the Meeting Chat.
<vrb-chat
with="">
</vrb-chat>
Name | Type | Description |
---|---|---|
with | String | Optional, a meeting participant ID of an active participant. If a meeting participant ID is provided the chat will be a private chat with that person. If no meeting participant ID is provided then this is the global group chat available to all users. It defaults to the global group chat. |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The polls Block displays the Meeting Polls.
<vrb-polls
show-toolbar="true">
</vrb-polls>
Name | Type | Description |
---|---|---|
show-toolbar | Boolean | Optional, shows the toolbar to manage polls, defaults to true |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The meeting minutes Block displays the Meeting Minutes.
<vrb-minutes
show-on-small-screen="false"
show-toolbar="true">
</vrb-minutes>
Name | Type | Description |
---|---|---|
show-on-small-screen | Boolean | Optional, displays a smaller toolbar, defaults to false |
show-toolbar | Boolean | Optional, decides if the toolbar of the minutes should be visible or not, defaults to true |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The meeting notes Block displays the Private Notes.
<vrb-notes
show-on-small-screen="false"
show-toolbar="true">
</vrb-notes>
Name | Type | Description |
---|---|---|
show-on-small-screen | Boolean | Optional, displays a smaller toolbar, defaults to false |
show-toolbar | Boolean | Optional, decides if the toolbar of the notes should be visible or not, defaults to true |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The meeting participants Block displays the full list of all meeting participants which are currently in the room.
<vrb-participants
hide-toolbar="false"
show-filter="false">
</vrb-participants>
Name | Type | Description |
---|---|---|
hide-toolbar | Boolean | Optional, hides the toolbar to invite additional participants, defaults to false |
show-filter | Boolean | Optional, shows the participants list filter, defaults to false |
Hinweis: Sehen Sie unter "Wie stelle ich die Blocks dar" wie Sie dieses Beispiel ausführen können.
The join meeting Block displays the standard screen to join the meeting. You can use ths Block instead of using the Veeting Blocks APIs to join the meeting.
<vrb-join
meeting-id="0000-0000-0000-0000"
meeting-password="">
</vrb-join>
Name | Type | Description |
---|---|---|
meeting-id | String | Required, the meeting ID of the meeting to join |
meeting-password | String | Optional, the meeting password which should be pre-filled in the form input |
The following events are available to subscribe to. Example:
document.querySelector("vrb-join").on("success", () => {
console.log("Meeting joined successfully");
});
Name | Callback type | Description |
---|---|---|
meeting-loaded | IMeetingRoomConfig | Triggered when the meeting is loaded. Useful to receive the meeting room configuration, for instance to check if the meeting is currently open. |
success | void | Triggered when the user successfully joined the meeting. |
cancel | void | Triggered when the user clicks on the logo of the screen. Useful if you want to send the user to a different screen. |
authenticate | {meetingId: string, meetingAuthType: MeetingRoomAuthType} | Triggered if the meeting is protected with additional security mechanisms. |
Sprechen Sie mit unserem Team über Ihre Pläne.