1.3.0 update (#18)

* 1.3.0 update
zoom · May 31, 2022 · cde79d7 · cde79d7
1 parent 144fccd
commit cde79d7
Show file tree

Hide file tree

Showing 27 changed files with 952 additions and 283 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,9 +1,38 @@
 ## CHANGELOG
+## v1.3.0
+
+* The `role_type` attribute in the JWT token is required. See [SDK Authorization](https://marketplace.zoom.us/docs/sdk/video/auth) for details.
+
+### Added
+* Virtual background support, and APIs
+  * APIs include: `isSupportVirtualBackground`,  `previewVirtualBackground`, `updateVirtualBackgroundImage`, `stopPreviewVirtualBackground`, and `virtualBackground` option in `startVideo` method
+  * See API reference for more details
+* Audio and video statistic information. 
+  * Subscribe to audio and video data via `subscribeAudioStatisticData` and `subscribeVideoStatisticData`
+  * Data will be sent every second via the `audio-statistic-data-change` and `video-statistic-data-change` events
+* Support for sharing audio only while screen sharing a Chrome tab
+* Support for sharing “Content from 2nd Camera” (e.g. a document camera, or the integrated camera on your laptop)
+  * New `ScreenShareOption` option for the `startShareScreen` method
+  * New secondaryCamera-related method: `switchSharingSecondaryCamera`
+  * See [here](https://support.zoom.us/hc/en-us/articles/201362153-Sharing-your-screen-or-desktop-on-Zoom) for more details on functionality, and the API reference for usage
+
+### Enhanced
+* Datacenter selection algorithm for reduced latency and improved in-meeting performance
+  * Improvements include geo-fencing and greater prioritization of geographically-close servers
+* QoS for in-meeting video streams (e.g. participant videos)
+
+### Fixed
+* Occasional conflicts when starting 720p videos with virtual background
+* Issue where the start audio with `speakerOnly` option on iOS mobile browser could lead to users not hearing audio
+* Video rendering issue on Android mobile browsers
+
 ## v1.2.7
+
 ### Fixed:
 * Issue where two-or-more videos could not be properly, simultaneously shown on Firefox and Safari
 
 ## v1.2.5
+
 ### Added:
 * Support for audio on iOS Safari
 * Support for multiple videos (3 others + 1 self) on Chromium browsers without SharedArrayBuffer. Set the value of `enforceMultipleVideos` to `true` in the `init` method to enable this feature

diff --git a/README.md b/README.md
@@ -1,154 +1,80 @@
-# Zoom Video SDK
+# Zoom Video SDK for Web
 
 Use of this SDK is subject to our [Terms of Use](https://zoom.us/docs/en-us/zoom_api_license_and_tou.html).
 
-Add Video, Audio, Screen Share, and Chat features to your web applications with the [Zoom Video SDK](https://marketplace.zoom.us/docs/sdk/video/introduction).
+The [Zoom Video SDK](https://marketplace.zoom.us/docs/sdk/video/web) enables you to build custom video experiences with Zoom's core technology through a highly optimized WebAssembly module.
 
 ## Installation
 
 In your frontend project, install the Video SDK:
 
-`$ npm install @zoom/videosdk --save`
+```bash
+$ npm install @zoom/videosdk --save
+```
 
 ## Usage
 
-In the component file where you want to use the Video SDK, import `ZoomVideo`.
+![Zoom Video SDK](https://marketplace.zoom.us/docs/images/sdk/vsdk-example.gif)
 
-```js
-import ZoomVideo from '@zoom/videosdk';
-```
+> The Video SDK provides video, audio, screen sharing, chat, data streams, and more, as a service. You can build with all of these features, or pick and choose. The Video SDK also comes with a full set of server side [APIs](https://marketplace.zoom.us/docs/api-reference/video-sdk/methods) and [Webhooks](https://marketplace.zoom.us/docs/api-reference/video-sdk/events).
 
-Create the Zoom Video Client, and initialize the dependencies.
+In the component file where you want to use the Video SDK, import `ZoomVideo` and create the client.
 
 ```js
-const client = ZoomVideo.createClient()
+import ZoomVideo from '@zoom/videosdk'
 
-client.init('en-US', `http://localhost:9999/node_modules/@zoom/videosdk/dist/lib/`);
+const client = ZoomVideo.createClient()
 ```
 
-NOTE: The following directory in node_modules must be accessible in your url path:
-
-- `node_modules/@zoom/videosdk/dist/lib`
-
-   For example, you could place the `lib` directory in your projects public assets directory, or use webpack's copy plugin to copy it to the public directory when starting the server up. You can test it by navigating to one of the included files: http://localhost:9999/assets/lib/webim.min.js
-
-Set the config variables (reference below):
+Then init the SDK and declare the `stream` which we will define later:
 
 ```js
-// setup your signature endpoint here: https://github.com/zoom/videosdk-sample-signature-node.js
-const signatureEndpoint = 'http://localhost:4000'
-const sessionName = 'VideoSDK-Test'
-const userName = 'VideoSDK'
-const sessionPasscode = '1234ABC'
-let stream;
-```
+client.init('en-US', `CDN`)
 
+let stream
+```
 
-Config variables reference:
+Now we will start or join the session.  Here are the required parameters for the `client.join()` function.
 
-| Variable                   | Description |
+| Parameter              | Parameter Description |
 | -----------------------|-------------|
-| signatureEndpoint          | Required, the endpoint url that returns a signature. [Get a signature endpoint here.](https://github.com/zoom/videosdk-sample-signature-node.js) |
-| sessionName  | Required, the name of your session. |
-| userName | Required, the name of the user joining your session. |
-| sessionPasscode | Required, the passcode for your session. |
-| stream | Required, the stream variable that you define after your session is joined. |
+| topic  | Required, a session name of your choice or the name of the session you are joining. |
+| token  | Required, your [Video SDK JWT](https://marketplace.zoom.us/docs/sdk/video/auth). |
+| userName | Required, a name for the participant. |
+| password | Required, a session passcode of your choice or the passcode of the session you are joining. |
 
-
-Generate the session signature to authenticate, [instructions here](https://github.com/zoom/videosdk-sample-signature-node.js).
+Then start or join the session and define the stream, which will be used for [core features](#core-features).
 
 ```js
-const signature = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9eyJhcHBfa2V5IjoiVklERU9fU0RLX0tFWV9IRVJFIiwiaWF0IjoxNjIzNDQyNTYzLCJleHAiOjE2MjM0NDk3NjMsInRwYyI6IlZpZGVvU0RLLVRlc3QiLCJwd2QiOiIxMjM0QUJDIn0='
-```
-
-Then join the session.
-
-```js
-client.join(sessionName, signature, userName, sessionPasscode).then((data) => {
-  console.log(data);
+client.join(topic, token, userName, password).then(() => {
+  stream = client.getMediaStream()
 }).catch((error) => {
-  console.log(error);
-});
-
-// Using "await" syntactical sugar:
-try {
-  const data = await client.join(sessionName, signature, userName, sessionPasscode);
-  console.log(data);
-} catch (error) {
-  console.error(error);
-}
-```
-
-Define the stream variable in the `connection-change` event listener to use the Video, Audio, Screen Share, and Chat APIs.
-
-```js
-client.on("connection-change", (payload) => {
-  stream = client.getMediaStream();
+  console.log(error)
 })
 ```
-Alternatively, retrieve the mediaStream object after having successfully joined the meeting
-```js
-try {
-  const data = await client.join(sessionName, signature, userName, sessionPasscode);
-  stream = zmClient.getMediaStream();
-} catch (error) {
-  console.error(error);
-}
-```
-
-Add the following HTML for the user interface (if using a framework like React, do the framework's equivalent). The start button will turn on your video and display it on the canvas in your web page.
 
-```html
-<button onclick="startVideo()">Start Video</button>
-<button onclick="stopVideo()">Stop Video</button>
+Now that we are in a session, we can start using core features like `stream.startVideo()`.
 
-<canvas id="my-video" width="640" height="360"></canvas>
-```
+### Core Features:
 
-Then, in your component file, connect the buttons to the Video SDK start and stop video functions.
+- [Video](https://marketplace.zoom.us/docs/sdk/video/web/essential/video)
+- [Audio](https://marketplace.zoom.us/docs/sdk/video/web/essential/audio)
+- [Chat](https://marketplace.zoom.us/docs/sdk/video/web/essential/chat)
+- [Call Out](https://marketplace.zoom.us/docs/sdk/video/web/advanced/call-out)
+- [Screen Share](https://marketplace.zoom.us/docs/sdk/video/web/essential/screen-share)
+- [Cloud Recording](https://marketplace.zoom.us/docs/sdk/video/web/essential/recording)
+- [Command Channel](https://marketplace.zoom.us/docs/sdk/video/web/advanced/command-channel)
+- [Audio Video Preview](https://marketplace.zoom.us/docs/sdk/video/web/essential/test)
+- [Subsessions](https://marketplace.zoom.us/docs/sdk/video/web/advanced/breakout-rooms)
 
-```js
-// Try to use the same aspect ratio as your webcam, and match it with the canvas
-// If you cannot, the SDK will add black bars to maintain correct aspect ratio
-const canvas = document.querySelector('#my-video')
-const canvasWidth = 640;
-const canvasHeight = 360;
-const xOffset = 0;
-const yOffset = 0;
-const videoQuality = 2;   // equivalent to 360p; refer to the API reference for more info
-
-async function startVideo() {
-  if (!stream.isCapturingVideo()) {
-    try {
-      await stream.startVideo();
-
-      const session = client.getSessionInfo();
-      stream.renderVideo(canvas, session.userId, canvasWidth, canvasHeight, xOffset, yOffset, videoQuality);
-    } catch (error) {
-      console.log(error);
-    }
-  }
-}
-
-async function stopVideo() {
-  if (stream.isCapturingVideo()) {
-    try {
-      await stream.stopVideo();
-
-      const session = client.getSessionInfo();
-      stream.stopRenderVideo(canvas, session.userId);
-    } catch (error) {
-      console.log(error);
-    }
-  }
-}
-```
+For the full list of features and event listeners, as well as additional guides, see our [Video SDK docs](https://marketplace.zoom.us/docs/sdk/video/web).
 
-For the full list of features and event listeners including [Audio](https://marketplace.zoom.us/docs/sdk/video/web/essential/audio), [Screen Sharing](https://marketplace.zoom.us/docs/sdk/video/web/essential/screen-share), and [Chat](https://marketplace.zoom.us/docs/sdk/video/web/essential/chat), as well as additional guides, please see our [Video SDK docs](https://marketplace.zoom.us/docs/sdk/video/web).
+## Sample Apps
 
-## Sample App
+Checkout the Video SDK sample apps:
 
-Checkout the Zoom [Web Video SDK Sample App](https://github.com/zoom/sample-app-videosdk), and the [Simple Signature Setup Sample App](https://github.com/zoom/videosdk-sample-signature-node.js).
+- [Web](https://github.com/zoom/sample-app-videosdk)
+- [Signature Generator](https://github.com/zoom/videosdk-sample-signature-node.js)
 
 ## Need help?
 

diff --git a/dist/index.esm.js b/dist/index.esm.js
diff --git a/dist/index.js b/dist/index.js
diff --git a/dist/index.umd.js b/dist/index.umd.js
diff --git a/dist/lib/audio.encode.wasm b/dist/lib/audio.encode.wasm
diff --git a/dist/lib/audio.simd.wasm b/dist/lib/audio.simd.wasm
diff --git a/dist/lib/audio_simd.min.js b/dist/lib/audio_simd.min.js
diff --git a/dist/lib/js_audio_process.min.js b/dist/lib/js_audio_process.min.js
diff --git a/dist/lib/js_media.min.js b/dist/lib/js_media.min.js
diff --git a/dist/lib/sharing_m.min.js b/dist/lib/sharing_m.min.js
diff --git a/dist/lib/sharing_mtsimd.min.js b/dist/lib/sharing_mtsimd.min.js
diff --git a/dist/lib/sharing_s.min.js b/dist/lib/sharing_s.min.js
diff --git a/dist/lib/sharing_simd.min.js b/dist/lib/sharing_simd.min.js
diff --git a/dist/lib/video.decode.wasm b/dist/lib/video.decode.wasm
diff --git a/dist/lib/video.mt.wasm b/dist/lib/video.mt.wasm
diff --git a/dist/lib/video.mtsimd.wasm b/dist/lib/video.mtsimd.wasm
diff --git a/dist/lib/video.simd.wasm b/dist/lib/video.simd.wasm
diff --git a/dist/lib/video_m.min.js b/dist/lib/video_m.min.js
diff --git a/dist/lib/video_mtsimd.min.js b/dist/lib/video_mtsimd.min.js
diff --git a/dist/lib/video_s.min.js b/dist/lib/video_s.min.js
diff --git a/dist/lib/video_simd.min.js b/dist/lib/video_simd.min.js
diff --git a/dist/types/common.d.ts b/dist/types/common.d.ts
@@ -30,6 +30,56 @@ interface ExecutedFailure {
  */
 export type ExecutedResult = Promise<'' | ExecutedFailure>;
 
+/**
+ * Interface of a participant
+ */
+interface Participant {
+  /**
+   * Identify of a user.
+   */
+  userId: number;
+  /**
+   * Display name of a user.
+   */
+  displayName: string;
+  /**
+   * Audio state of a user.
+   * - `''`: No audio.
+   * - `computer`: Joined by computer audio.
+   * - `phone`: Joined by phone
+   */
+  audio: '' | 'computer' | 'phone';
+  /**
+   * Whether audio is muted.
+   */
+  muted: boolean;
+  /**
+   * Whether the user is host.
+   */
+  isHost: boolean;
+  /**
+   * Whether the user is manager.
+   */
+  isManager: boolean;
+  /**
+   * The avatar of a user.
+   * You can set the avatar in the [web profile](https://zoom.us/profile).
+   */
+  avatar?: string;
+  /**
+   * Whether the user is started video.
+   */
+  bVideoOn: boolean;
+  /**
+   * Whether the user is started share.
+   */
+  sharerOn: boolean;
+  /**
+   * Whether the share is paused
+   */
+  sharePause: boolean;
+}
+
 /**
  * The state of dial out state
  *
@@ -127,3 +177,13 @@ export enum AudioChangeAction {
    */
   Unmuted = 'unmuted',
 }
+
+/**
+ * Payload of connection-change, the reconnecting reason
+ */
+export enum ReconnectReason {
+  /**
+   * meeting failover
+   */
+  Failover = 'failover',
+}