agora-electron-sdk 4.1.1-rc.1 → 4.2.0-dev.13

package/ts/Renderer/RendererManager.ts

@@ -1,14 +1,14 @@
-import { VideoSourceType } from '../Private/AgoraBase';
-import { RenderModeType } from '../Private/AgoraMediaBase';
+import { ErrorCodeType } from '../Private/AgoraBase';
+import { RenderModeType, VideoSourceType } from '../Private/AgoraMediaBase';
 import {
   AgoraElectronBridge,
   Channel,
   ChannelIdMap,
   FormatRendererVideoConfig,
+  RENDER_MODE,
   RenderConfig,
-  RendererVideoConfig,
   RenderMap,
-  RENDER_MODE,
+  RendererVideoConfig,
   ShareVideoFrame,
   UidMap,
   VideoFrameCacheConfig,
@@ -22,14 +22,16 @@ import {
   logInfo,
   logWarn,
 } from '../Utils';
-import GlRenderer from './GlRenderer';
+
 import { IRenderer, RenderFailCallback } from './IRenderer';
+import { IRendererManager } from './IRendererManager';
+import WebGLRenderer from './WebGLRenderer';
 import { YUVCanvasRenderer } from './YUVCanvasRenderer';
 
 /**
  * @ignore
  */
-class RendererManager {
+export class RendererManager extends IRendererManager {
   /**
    * @ignore
    */
@@ -51,26 +53,37 @@ class RendererManager {
    * @ignore
    */
   msgBridge: AgoraElectronBridge;
-
   /**
    * @ignore
    */
+  defaultRenderConfig: RendererVideoConfig;
+
   constructor() {
+    super();
     this.renderFps = 10;
     this.renderers = new Map();
     this.renderMode = this.checkWebglEnv()
       ? RENDER_MODE.WEBGL
       : RENDER_MODE.SOFTWARE;
-
     this.msgBridge = AgoraEnv.AgoraElectronBridge;
+    this.defaultRenderConfig = {
+      rendererOptions: {
+        contentMode: RenderModeType.RenderModeFit,
+        mirror: false,
+      },
+    };
   }
 
   /**
-   * Registers an audio frame observer object.
+   * Sets the channel mode of the current audio file.
+   * In a stereo music file, the left and right channels can store different audio data. According to your needs, you can set the channel mode to original mode, left channel mode, right channel mode, or mixed channel mode. For example, in the KTV scenario, the left channel of the music file stores the musical accompaniment, and the right channel stores the singing voice. If you only need to listen to the accompaniment, call this method to set the channel mode of the music file to left channel mode; if you need to listen to the accompaniment and the singing voice at the same time, call this method to set the channel mode to mixed channel mode.Call this method after calling open .This method only applies to stereo audio files.
+   *
+   * @param mode The channel mode. See AudioDualMonoMode .
    *
-   * @param mode The use mode of the audio frame. See RawAudioFrameOpModeType .
+   * @returns
+   * 0: Success.< 0: Failure.
    */
-  setRenderMode(mode: RENDER_MODE) {
+  public setRenderMode(mode: RENDER_MODE) {
     this.renderMode = mode;
     logInfo(
       'setRenderMode:  new render mode will take effect only if new view bind to render'
@@ -80,20 +93,20 @@ class RendererManager {
   /**
    * @ignore
    */
-  setFPS(fps: number) {
+  public setFPS(fps: number) {
     this.renderFps = fps;
     this.restartRender();
   }
 
+  /**
+   * @ignore
+   */
   public setRenderOption(
     view: HTMLElement,
     contentMode = RenderModeType.RenderModeFit,
     mirror: boolean = false
   ): void {
     if (!view) {
-      /**
-       * @ignore
-       */
       logError('setRenderOption: view not exist', view);
     }
     this.forEachStream(({ renders }) => {
@@ -105,6 +118,9 @@ class RendererManager {
     });
   }
 
+  /**
+   * @ignore
+   */
   public setRenderOptionByConfig(rendererConfig: RendererVideoConfig): number {
     const {
       uid,
@@ -112,52 +128,47 @@ class RendererManager {
       rendererOptions,
       videoSourceType,
     }: FormatRendererVideoConfig =
-      /**
-       * @ignore
-       */
       getDefaultRendererVideoConfig(rendererConfig);
 
-    if (!rendererConfig.view) {
-      logError('setRenderOptionByView: view not exist');
-      return -1;
-    }
-
     const renderList = this.getRenderers({ uid, channelId, videoSourceType });
     renderList
       ? renderList
-          .filter((renderItem) =>
-            renderItem.equalsElement(rendererConfig.view!)
-          )
+          .filter((renderItem) => {
+            if (rendererConfig.view) {
+              return renderItem.equalsElement(rendererConfig.view);
+            } else {
+              return true;
+            }
+          })
           .forEach((renderItem) => renderItem.setRenderOption(rendererOptions))
       : logWarn(
           `RenderStreamType: ${videoSourceType} channelId:${channelId} uid:${uid} have no render view, you need to call this api after setView`
         );
-    return 0;
+    return ErrorCodeType.ErrOk;
   }
 
+  /**
+   * @ignore
+   */
   public checkWebglEnv(): boolean {
     let gl;
-    const canvas = document.createElement('canvas');
+    let canvas: HTMLCanvasElement = document.createElement('canvas');
 
     try {
       gl =
         canvas.getContext('webgl') || canvas.getContext('experimental-webgl');
-      /**
-       * @ignore
-       */
       logInfo('Your browser support webGL');
     } catch (e) {
       logWarn('Your browser may not support webGL');
       return false;
     }
 
-    if (gl) {
-      return true;
-    } else {
-      return false;
-    }
+    return !!gl;
   }
 
+  /**
+   * @ignore
+   */
   public setupVideo(rendererVideoConfig: RendererVideoConfig): number {
     const formatConfig = getDefaultRendererVideoConfig(rendererVideoConfig);
 
@@ -166,19 +177,15 @@ class RendererManager {
 
     if (!formatConfig.view) {
       logWarn('setupVideo->destroyRenderersByConfig, because of view is null');
-      AgoraRendererManager.destroyRenderersByConfig(
-        videoSourceType,
-        channelId,
-        uid
-      );
-      return -1;
+      this.destroyRenderersByConfig(videoSourceType, channelId, uid);
+      return -ErrorCodeType.ErrInvalidArgument;
     }
 
     // ensure a render to RenderMap
     const render = this.bindHTMLElementToRender(formatConfig, view!);
 
     // render config
-    render.setRenderOption(rendererOptions);
+    render?.setRenderOption(rendererOptions);
 
     // enable iris videoFrame
     this.enableVideoFrameCache({
@@ -189,32 +196,40 @@ class RendererManager {
 
     // enable render
     this.enableRender(true);
-    return 0;
+    return ErrorCodeType.ErrOk;
   }
 
+  /**
+   * @ignore
+   */
   public setupLocalVideo(rendererConfig: RendererVideoConfig): number {
     const { videoSourceType } = rendererConfig;
     if (videoSourceType === VideoSourceType.VideoSourceRemote) {
       logError('setupLocalVideo videoSourceType error', videoSourceType);
-      return -1;
+      return -ErrorCodeType.ErrInvalidArgument;
     }
     this.setupVideo({ ...rendererConfig });
-    return 0;
+    return ErrorCodeType.ErrOk;
   }
 
+  /**
+   * @ignore
+   */
   public setupRemoteVideo(rendererConfig: RendererVideoConfig): number {
     const { videoSourceType } = rendererConfig;
     if (videoSourceType !== VideoSourceType.VideoSourceRemote) {
       logError('setupRemoteVideo videoSourceType error', videoSourceType);
-      return -1;
+      return -ErrorCodeType.ErrInvalidArgument;
     }
-    this.setupVideo({
-      ...rendererConfig,
-      videoSourceType: VideoSourceType.VideoSourceRemote,
-    });
-    return 0;
+    this.setupVideo({ ...rendererConfig });
+    return ErrorCodeType.ErrOk;
   }
 
+  /**
+   * Destroys a video renderer object.
+   *
+   * @param view The HTMLElement object to be destroyed.
+   */
   public destroyRendererByView(view: Element): void {
     const renders = this.renderers;
     renders.forEach((channelMap, videoSourceType) => {
@@ -243,6 +258,9 @@ class RendererManager {
     });
   }
 
+  /**
+   * @ignore
+   */
   public destroyRenderersByConfig(
     videoSourceType: VideoSourceType,
     channelId?: Channel,
@@ -269,6 +287,9 @@ class RendererManager {
     renderMap.renders = [];
   }
 
+  /**
+   * @ignore
+   */
   public removeAllRenderer(): void {
     const renderMap = this.forEachStream(
       (renderConfig, videoFrameCacheConfig) => {
@@ -282,11 +303,23 @@ class RendererManager {
     renderMap.clear();
   }
 
-  clear(): void {
+  /**
+   * @ignore
+   */
+  public clear(): void {
     this.stopRender();
     this.removeAllRenderer();
   }
 
+  /**
+   * Enables/Disables the local video capture.
+   * This method disables or re-enables the local video capture, and does not affect receiving the remote video stream.After calling enableVideo , the local video capture is enabled by default. You can call enableLocalVideo (false) to disable the local video capture. If you want to re-enable the local video capture, call enableLocalVideo(true).After the local video capturer is successfully disabled or re-enabled, the SDK triggers the onRemoteVideoStateChanged callback on the remote client.You can call this method either before or after joining a channel.This method enables the internal engine and is valid after leaving the channel.
+   *
+   * @param enabled Whether to enable the local video capture.true: (Default) Enable the local video capture.false: Disable the local video capture. Once the local video is disabled, the remote users cannot receive the video stream of the local user, while the local user can still receive the video streams of remote users. When set to false, this method does not require a local camera.
+   *
+   * @returns
+   * 0: Success.< 0: Failure.
+   */
   public enableRender(enabled = true): void {
     if (enabled && this.isRendering) {
       //is already _isRendering
@@ -297,6 +330,9 @@ class RendererManager {
     }
   }
 
+  /**
+   * @ignore
+   */
   public startRenderer(): void {
     this.isRendering = true;
     const renderFunc = (
@@ -313,33 +349,31 @@ class RendererManager {
 
       switch (finalResult.ret) {
         case 0:
-          // IRIS_VIDEO_PROCESS_ERR::ERR_OK = 0,
+          // GET_VIDEO_FRAME_CACHE_RETURN_TYPE::OK = 0,
           // everything is ok
           break;
-        case 1:
-          // IRIS_VIDEO_PROCESS_ERR::ERR_NULL_POINTER = 1,
-          break;
-        case 2: {
-          // IRIS_VIDEO_PROCESS_ERR::ERR_SIZE_NOT_MATCHING
-          const { width, height } = finalResult;
+        case 1: {
+          // GET_VIDEO_FRAME_CACHE_RETURN_TYPE::RESIZED
+          const { width, height, yStride } = finalResult;
           const newShareVideoFrame = this.resizeShareVideoFrame(
             videoSourceType,
             channelId,
             uid,
             width,
-            height
+            height,
+            yStride
           );
           rendererItem.shareVideoFrame = newShareVideoFrame;
           finalResult = this.msgBridge.GetVideoFrame(newShareVideoFrame);
           break;
         }
-        case 5:
-          // IRIS_VIDEO_PROCESS_ERR::ERR_BUFFER_EMPTY
+        case 2:
+          // GET_VIDEO_FRAME_CACHE_RETURN_TYPE::NO_CACHE
           // setupVideo/AgoraView render before initialize
-          this.enableVideoFrameCache({ videoSourceType, channelId, uid });
-          return;
+          // this.enableVideoFrameCache({ videoSourceType, channelId, uid });
+          break;
         default:
-          return;
+          break;
       }
       if (finalResult.ret !== 0) {
         logWarn('GetVideoFrame ret is', finalResult.ret, rendererItem);
@@ -361,6 +395,9 @@ class RendererManager {
     }, 1000 / this.renderFps);
   }
 
+  /**
+   * @ignore
+   */
   public stopRender(): void {
     this.isRendering = false;
     if (this.videoFrameUpdateInterval) {
@@ -369,6 +406,9 @@ class RendererManager {
     }
   }
 
+  /**
+   * @ignore
+   */
   public restartRender(): void {
     if (this.videoFrameUpdateInterval) {
       this.stopRender();
@@ -377,14 +417,20 @@ class RendererManager {
     }
   }
 
+  /**
+   * @ignore
+   */
   private createRenderer(failCallback?: RenderFailCallback): IRenderer {
     if (this.renderMode === RENDER_MODE.SOFTWARE) {
       return new YUVCanvasRenderer();
     } else {
-      return new GlRenderer(failCallback);
+      return new WebGLRenderer(failCallback);
     }
   }
 
+  /**
+   * @ignore
+   */
   private getRender({
     videoSourceType,
     channelId,
@@ -393,6 +439,9 @@ class RendererManager {
     return this.renderers.get(videoSourceType)?.get(channelId)?.get(uid);
   }
 
+  /**
+   * @ignore
+   */
   private getRenderers({
     videoSourceType,
     channelId,
@@ -404,10 +453,13 @@ class RendererManager {
     );
   }
 
+  /**
+   * @ignore
+   */
   private bindHTMLElementToRender(
     config: FormatRendererVideoConfig,
     view: HTMLElement
-  ): IRenderer {
+  ): IRenderer | undefined {
     this.ensureRendererConfig(config);
     const renders = this.getRenderers(config);
     const filterRenders =
@@ -439,6 +491,9 @@ class RendererManager {
     return renderer;
   }
 
+  /**
+   * @ignore
+   */
   private forEachStream(
     callbackfn: (
       renderConfig: RenderConfig,
@@ -464,6 +519,9 @@ class RendererManager {
     return renders;
   }
 
+  /**
+   * @ignore
+   */
   private enableVideoFrameCache(
     videoFrameCacheConfig: VideoFrameCacheConfig
   ): void {
@@ -471,6 +529,9 @@ class RendererManager {
     this.msgBridge.EnableVideoFrameCache(videoFrameCacheConfig);
   }
 
+  /**
+   * @ignore
+   */
   private disableVideoFrameCache(
     videoFrameCacheConfig: VideoFrameCacheConfig
   ): void {
@@ -478,6 +539,9 @@ class RendererManager {
     this.msgBridge.DisableVideoFrameCache(videoFrameCacheConfig);
   }
 
+  /**
+   * @ignore
+   */
   private ensureRendererConfig(config: VideoFrameCacheConfig):
     | Map<
         number,
@@ -521,33 +585,40 @@ class RendererManager {
     return channelMap;
   }
 
+  /**
+   * @ignore
+   */
   private resizeShareVideoFrame(
     videoSourceType: VideoSourceType,
     channelId: string,
     uid: number,
     width = 0,
-    height = 0
+    height = 0,
+    yStride = 0
   ): ShareVideoFrame {
     return {
       videoSourceType,
       channelId,
       uid,
-      yBuffer: Buffer.alloc(width * height),
-      uBuffer: Buffer.alloc((width * height) / 4),
-      vBuffer: Buffer.alloc((width * height) / 4),
+      yBuffer: Buffer.alloc(yStride * height),
+      uBuffer: Buffer.alloc((yStride * height) / 4),
+      vBuffer: Buffer.alloc((yStride * height) / 4),
       width,
       height,
+      yStride,
     };
   }
 
-  private updateVideoFrameCacheInMap(
+  /**
+   * @ignore
+   */
+  public updateVideoFrameCacheInMap(
     config: VideoFrameCacheConfig,
     shareVideoFrame: ShareVideoFrame
   ): void {
     let rendererConfigMap = this.ensureRendererConfig(config);
     rendererConfigMap
-      ? // @ts-ignore
-        Object.assign(rendererConfigMap.get(config.uid), {
+      ? Object.assign(rendererConfigMap.get(config.uid) ?? {}, {
           shareVideoFrame,
         })
       : logWarn(
@@ -555,10 +626,3 @@ class RendererManager {
         );
   }
 }
-
-const AgoraRendererManager = new RendererManager();
-
-AgoraEnv.AgoraRendererManager = AgoraRendererManager;
-
-export default AgoraRendererManager;
-export { RendererManager };