Release PR (#2293)

* workspace documentation and member invites - 10th june 2024 (#2262) * workspace documentation * Update workspaces.mdx * Changes the text color of selected tab and makes it bolder * Changes the bottom selector color to new blue for existing tabs * Update virtual-background.mdx (#2279) * Update virtual-background.mdx * Update custom-video-plugins.mdx * Create audio-levels.mdx (#2280) * Create audio-levels.mdx * Update audio-levels.mdx * Update release notes (#2281) * Android API reference docs PR (#2282) Updating the API reference for SDK version * chore: room json fix * Android API reference docs PR (#2284) Updating the API reference for SDK version * fix: release notes * fix: release notes * resolved typos * feat: update effects doc * fix: update * fix: prebuilt customisation * fix: readme casing * Whiteboard feature doc 10 june 2024 (#2292) * whiteboard doc and policy api update * whiteboard overview doc * Update whiteboard.mdx * Update whiteboard.mdx * Update create-template-via-api.mdx --------- Co-authored-by: Mantra Manan Saraswat <[email protected]> Co-authored-by: Kaustubh Kumar <[email protected]> Co-authored-by: Aditya Thakur <[email protected]> Co-authored-by: Pawan Dixit <[email protected]> Co-authored-by: Aniket Kadam <[email protected]> Co-authored-by: Pratish Bodhale <[email protected]> Co-authored-by: Yogesh Singh <[email protected]>
100mslive · Jun 19, 2024 · 08b436d · 08b436d
1 parent aa28d29
commit 08b436d
Show file tree

Hide file tree

Showing 6 changed files with 202 additions and 4 deletions.
diff --git a/docs/get-started/v2/get-started/100ms-dashboard/export-import-template.mdx b/docs/get-started/v2/get-started/100ms-dashboard/export-import-template.mdx
@@ -14,8 +14,8 @@ Export templates directly from the dashboard and import them into any workspace
 ![Export Template](/docs/v2/100ms-dashboard/export-template.png)
 
 1. Click on the **Templates** dropdown in the sidebar, and pick a template you want to export 
-1. Once you've selected your template, click on the three dot menu near the top right
-1. From the dropdown, click on **Export Template** and you're done
+2. Once you've selected your template, click on the three dot menu near the top right
+3. From the dropdown, click on **Export Template** and you're done
 
 You should now see `<template-name>.json` in your downloads.
 
@@ -36,8 +36,8 @@ The \<template-name\>.json file contains the configuration for your template. Mo
 <br></br>
 
 1. Click on **Create Template**
-1. Click on **Import Template** and choose the `<template-name>.json` you exported in the previous step
-1. Enter a template name, subdomain, and select a region for your template and then click on **Experience**
+2. Click on **Import Template** and choose the `<template-name>.json` you exported in the previous step
+3. Enter a template name, subdomain, and select a region for your template and then click on **Experience**
 
 That's it. You have successfully imported your template into your current workspace and account.
 

diff --git a/docs/get-started/v2/get-started/features/whiteboard.mdx b/docs/get-started/v2/get-started/features/whiteboard.mdx
@@ -0,0 +1,128 @@
+---
+title: Whiteboard
+nav: 3.7
+---
+
+The Whiteboard feature in 100ms is designed to enhance collaborative and interactive experiences across various setups, particularly in educational environments where student-teacher interactions are crucial. 
+
+The Whiteboard is invaluable in a range of setups, including:
+- Education: Facilitates interactive learning sessions between students and teachers.
+- Corporate Training: Enhances training programs with real-time annotations and visual aids.
+- Remote Team Collaboration: Supports brainstorming and planning sessions with a shared visual space.
+- Creative Workshops: Enables collaborative drawing and design tasks.
+
+This is a guide to enabling, configuring and using the Whiteboard on 100ms.
+
+<StepsToc
+    parentId="whiteboard"
+    descriptions={[
+        "General information on 100ms Whiteboard.",
+        "Enabling the Whiteboard for your room(s).",
+        "Exploring platforms and methods of integration.",
+        "Launching, interacting, and stopping the Whiteboard and its default behaviour."
+    ]}
+/>
+
+<StepsContainer id="whiteboard">
+
+### Getting Started
+
+100ms has developed a collaborative whiteboard using [tldraw 2.0](https://tldraw.dev/), powered entirely by 100ms' signaling backend.
+
+<Note type='warning'>
+**IMPORTANT** <br/>
+This feature is currently in Beta and access is limited to selected users. To be a part of the early access cohort, request to enable this using the support widget on 100ms dashboard.
+</Note>
+
+### Enabling and Configuring the Whiteboard
+
+Whiteboard can be configured from the 100ms dashboard.
+
+#### Enabling the Whiteboard
+
+1. Navigate to a specific Template where you wish to enable the Whiteboard.
+2. Click on **‘Advanced Settings’** tab in the Template configuration.
+3. Enable ‘**Whiteboard**’.
+
+<video loop="true" autoplay="autoPlay" controls="false" id="vid" muted>
+    <source src="/docs/docs/v2/whiteboard/enable-whiteboard-config.mp4" type="video/mp4" />
+</video>
+
+#### Recording and live streaming the Whiteboard
+
+To record or live stream whiteboard activities, this permission toggle must be enabled. If disabled, the whiteboard will not appear in room composite recordings or live streams. Ensure recording or live streaming is activated in the template settings to enable this feature.
+
+#### Configuring the permissions
+
+There are three permission levels for managing the whiteboard:
+
+1. **Launch, Close, and View Whiteboard**  
+   Assign to roles (at least one) that should have the ability to launch or close the whiteboard. Users in these roles can view the whiteboard but cannot write or collaborate unless additional permissions are granted.
+
+2. **Collaborate and View Whiteboard**  
+   Assign to roles (at least one) that should have the ability to draw and collaborate on the whiteboard. Users in these roles can write, collaborate, and view the whiteboard. The whiteboard will automatically launch for them whenever it is initiated by someone with launch permissions.
+
+3. **Only View Whiteboard**  
+   Assign to roles that should only have the ability to view the whiteboard. These users cannot launch, close, or draw on the whiteboard unless further permissions are assigned. The whiteboard will automatically launch for them when initiated by someone with launch permissions. Participants with this permission will not be able to see the different collaboration toolbars.
+
+![whiteboard-permissions](/docs/v2/whiteboard/whiteboard-config-permissions.png)
+
+> **Note on Multiple Permissions**
+>
+> A role can be assigned multiple permission levels. For example, a **‘teacher’** role can have both the 'Launch, Close, and View Whiteboard' and 'Collaborate and View Whiteboard' permissions, allowing them to launch and write on the whiteboard. But a 'student
+>
+
+### Integrating the Whiteboard
+The Whiteboard is part of [100ms' Prebuilt SDKs](/prebuilt/v2/prebuilt/quickstart#embed-as-component) and is available across all platforms (iOS, Android, Flutter, React Native and Web). In case a more custom integration is desired within the SDK, refer to the following platform SDK specific guides:
+- [iOS](/ios/v2/how-to-guides/set-up-video-conferencing/whiteboard)
+- [Android](/android/v2/how-to-guides/extend-capabilities/whiteboard)
+- [React Native](/react-native/v2/how-to-guides/extend-capabilities/whiteboard)
+- [Flutter](/flutter/v2/how-to-guides/extend-capabilities/whiteboard)
+- Web - Coming soon
+
+### Using the Whiteboard
+Once you’ve enabled and saved the configuration, the Whiteboard can be launched by the peers with launch permissions on any supported device.
+
+<video loop="true" autoplay="autoPlay" controls="false" id="vid" muted>
+    <source src="/docs/docs/v2/whiteboard/launch-whiteboard.mp4" type="video/mp4" />
+</video>
+
+#### Default behaviour
+1. **Session Persistence** - The whiteboard does not retain any information after a session ends. However, during a session, it maintains all drawn shapes and information even if it is closed and reopened multiple times.
+2. **No Follow-along** - The current version of the whiteboard does not support a true follow-along feature. This means participants cannot follow the presenter’s cursor movements across different parts of the canvas or see the exact zoom level that the presenter is using. This has been solved in Prebuilt by limiting the canvas and disabling the zoom on web.
+3. **Canvas Limitations** - Although the whiteboard inherently supports an infinite canvas, its movement is restricted to fit the device’s viewport in Prebuilt Web to avoid canvas scrolling beyond the visible area.
+4. **Zoom Capabilities** - Zoom-in and zoom-out functionality have been disabled on the whiteboard in Prebuilt Web. Although, it is available on Prebuilt Mweb, Android, iOS, React Native and Flutter.
+5. **Unified Page View** - When one participant changes the whiteboard page, it synchronizes across all participants’ views. Current implementation does not support independent page navigation by different users, but future updates will include this capability.
+6. **Launch and Closure Control** - Only the participant who launches the whiteboard can close it. If this participant disconnects, the whiteboard will automatically close. Other participants with the required role permissions can relaunch the whiteboard if needed.
+7. **Screenshare Priority** - Screenshare takes precedence over the whiteboard. If screenshare is initiated, the whiteboard will automatically close. Additionally, the option to launch the whiteboard is disabled in the Prebuilt UI during an active screenshare session. To access the whiteboard, the screenshare must be stopped first.
+
+#### Features
+The following features are supported within the Whiteboard:
+1. Bottom Toolbar - Select, Hand, Pen, Eraser, Arrows, Text, Note, Image Upload, Shapes (Cloud, Star, Square, Circle etc.)
+2. Colour selection, masking, font control
+3. Insert embed 
+4. Support for multiple pages
+5. Export individual pages as PNGs
+6. Image upload and annotation - Images can be upload by either drag-and-drop method or by clicking the ‘Assets’ icon in the bottom toolbar. This is only supported on web as of now.
+7. Dark mode - This can be set locally for a user with collaborate permissions.
+
+There are additional minor options and features available that can be used or adjusted.
+
+#### Whiteboard on Mobile
+Whiteboard is supported across Mweb, Android, iOS, React Native and Flutter.
+
+#### Errors
+- Timeout error will occur for the whiteboard in case the tab is left inactive for sometime.
+
+</StepsContainer>
+
+
+### Frequently Asked Questions (FAQ)
+
+1. **Is whiteboard a chargeable feature?**
+
+    Yes, 100ms Whiteboard is charged based on per peer usage minutes. This means that for every peer that is either collaborating on or viewing the whiteboard, their individual usage minutes will be aggregated. Reach out to us for the pricing.
+
+2. **How many participants can the whiteboard support?**
+
+    We have tested the whiteboard with up to 1500 participants. In case the requirement is higher than this, please reach out to us.
diff --git a/docs/server-side/v2/api-reference/policy/create-template-via-api.mdx b/docs/server-side/v2/api-reference/policy/create-template-via-api.mdx
@@ -268,6 +268,21 @@ curl --location --request POST 'https://api.100ms.live/v2/templates' \
             }
         }
     }
+    "plugins": {
+        "whiteboard": {
+            "permissions": {
+                 "admin": ["host"],
+                "writer": ["host"],
+                "reader": ["guest"]
+            }
+        },
+        "transcriptions": {
+            "permissions": {
+                "admin": ["host","guest"]
+            },
+            "mode": "caption"
+        }
+    }
 }'
 ```
 
@@ -533,6 +548,21 @@ curl --location --request POST 'https://api.100ms.live/v2/templates' \
                 }
             }
         }
+    "plugins": {
+        "whiteboard": {
+            "permissions": {
+                 "admin": ["host"],
+                "writer": ["host"],
+                "reader": ["guest"]
+            }
+        },
+        "transcriptions": {
+            "permissions": {
+                "admin": ["host","guest"]
+            },
+            "mode": "caption"
+        }
+    }
     },
     "createdAt": "2022-09-16T12:03:40.068Z",
     "updatedAt": "2022-09-16T12:03:40.068Z",
@@ -790,3 +820,43 @@ Minimum between `width` and `height` should be in range [144, 1080] and Maximum
 | ------ | -------- | ------------------------------------------------------------------------------------------------------------------ | -------- |
 | title  | `string` | Title of the section `Agenda`, `Short Summary`, `Follow Up Action Items`, `Short Summary`. (limit: 100 characters) | Yes      |
 | format | `string` | Format of the section. Valid values: [`bullets`, `paragraph`]                                                      | Yes      |
+
+
+## plugins object
+
+| Name           | Type     | Description                                                                                                                            | Required |
+|:---------------|:---------|:---------------------------------------------------------------------------------------------------------------------------------------|:---------|
+| whiteboard     | `object` | Object of type `whiteboard`. This can be used enable and configure permissions of the whiteboard.                                      | No       |
+| transcriptions | `object` | Object of type `transcriptions`. This can be used configure permission levels for transcriptions, and specifically, closed captioning. | No       |
+
+### plugins - whiteboard object
+
+| Name        | Type     | Description                                                                                                                                                           | Required |
+|-------------|----------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|
+| permissions | `object` | Object of type `permissions`. This is used to classify roles in different permission levels of the whiteboard. Same role can be a part of multiple permission levels. | No       |
+
+#### plugins - whiteboard - permissions object
+
+| Name   | Type    | Description                                                                                                                                                                                                                                                   | Required |
+|--------|---------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|
+| admin  | `array` | This contains an array of roles with the permission to launch, close and view the whiteboard. Users in this role, unless other explicitly added to `writer` permission level, will only be able to launch, close or view the whiteboard, but not draw on it.  | No       |
+| writer | `array` | This contains an array of roles with the permission to write and collaborate on the whiteboard. Users in this role, unless other explicitly added to `admin` permission levels will only be able to draw and view the whiteboard, but not launch or close it. | No       |
+| reader | `array` | This contains an array of roles with the permission to only view the whiteboard. Users in this role, unless other explicitly added to `admin` or `writer` permission levels, will only be able to view the whiteboard, but not launch, close or draw on it.   | No       |
+
+> **Note on Multiple Permissions**
+>
+> A role can be a part multiple permission level array. For example, a ‘teacher’ role can be a part both the `admin` and `writer` permission arrays, allowing them to launch, close and write on the whiteboard. But a 'student' which is a part of `reader` but not of other permission levels will only be able to view the whiteboard.
+>
+
+### plugins - transcriptions object
+
+| Name        | Type     | Description                                                                                                                      | Required |
+|-------------|----------|----------------------------------------------------------------------------------------------------------------------------------|----------|
+| permissions | `object` | Object of type `permissions`. This is used to classify roles in different permission levels for specific mode of transcription.  | No       |
+| mode        | `string` | Mode defines the transcription mode that the permission level is defined for. Currently, it only accepts `caption` as its value. | No       |
+
+#### plugins - transcriptions - permissions object
+
+| Name  | Type    | Description                                                                                                                                                                                                                | Required |
+|-------|---------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|
+| admin | `array` | This contains an array of roles with the permission to enable or disable closed captioning for a given room during a live session. They can enable closed captions so that all the participants in the room can access it. | No       |
diff --git a/public/docs/v2/whiteboard/enable-whiteboard-config.mp4 b/public/docs/v2/whiteboard/enable-whiteboard-config.mp4
diff --git a/public/docs/v2/whiteboard/launch-whiteboard.mp4 b/public/docs/v2/whiteboard/launch-whiteboard.mp4
diff --git a/public/docs/v2/whiteboard/whiteboard-config-permissions.png b/public/docs/v2/whiteboard/whiteboard-config-permissions.png