@besovideo/webrtc-player 0.10.28 → 0.10.29

package/README.md

@@ -484,10 +484,16 @@ instance.open()
 
 **水印配置**
 
-`PuPlayer` 和 `PlayBack` 支持水印层。水印是播放窗口上的 DOM/CSS 叠层，不会写入本地录像文件。
+`PuPlayer`、`PlayBack`、`CreateCallEndPoint` 和 `callEndPointUtils.pushLocalMedia` 支持水印层。水印是播放窗口上的 DOM/CSS 叠层，不会写入本地录像文件。
 
 ```typescript
-import { globalConfigHandler, PuPlayer, PlayBack } from "@besovideo/webrtc-player";
+import {
+  globalConfigHandler,
+  PuPlayer,
+  PlayBack,
+  CreateCallEndPoint,
+  callEndPointUtils,
+} from "@besovideo/webrtc-player";
 
 interface IWatermarkConfig {
   // 是否启用水印
@@ -520,7 +526,7 @@ interface IWatermarkConfig {
   zIndex?: number;
 }
 
-// 全局配置：影响之后创建的 PuPlayer 和 PlayBack 实例
+// 全局配置：影响之后创建的播放器、回放、通话和推流预览实例
 globalConfigHandler.setDefaultProps({
   watermark: {
     // 支持 string 或 string[]，数组会按多行显示
@@ -571,6 +577,22 @@ PlayBack({
     enable: false,
   },
 });
+
+// 通话端点窗口覆盖全局配置，本地和远端视频区域都会显示水印
+CreateCallEndPoint({
+  // ...
+  watermark: {
+    text: "通话水印",
+  },
+});
+
+// 推送本地媒体流预览覆盖全局配置
+callEndPointUtils.pushLocalMedia({
+  // ...
+  watermark: {
+    text: "推流预览水印",
+  },
+});
 ```
 
 水印间距会根据播放窗口大小自动调整。`gapX` / `gapY` 表示最小间距，`maxColumns` / `maxRows` 用于限制大屏下最多显示的水印密度：
@@ -588,6 +610,8 @@ const callEndPointUtils: {
     token: string;
     // div 用于渲染
     container?: HTMLDivElement;
+    // 播放窗口水印配置，支持全局配置和实例覆盖
+    watermark?: IWatermarkConfig;
     // 是否获取视频
     video?: boolean;
     // 是否获取音频

package/dist/main.browser.js

@@ -124,7 +124,7 @@ var bvPlayerCore = (() => {
   var define_processenv_default;
   var init_define_processenv = __esm({
     "<define:processenv>"() {
-      define_processenv_default = { NODE_ENV: "production", SH_LIB_NAME: "@besovideo/webrtc-player", SH_LIB_VERSION: "0.10.28", PROJECT_NAMESPACE: "bvplayer" };
+      define_processenv_default = { NODE_ENV: "production", SH_LIB_NAME: "@besovideo/webrtc-player", SH_LIB_VERSION: "0.10.29", PROJECT_NAMESPACE: "bvplayer" };
     }
   });
 
@@ -35743,6 +35743,17 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
         dialogPanelHandle.setZIndex(createParams.zIndex);
       }
       const { myVideo, remoteVideo } = dialogPanelHandle;
+      const watermarkConfig = mergeWatermarkConfig(
+        globalConfigHandler.getDefaultProps().watermark,
+        createParams.watermark
+      );
+      const addWatermark = (container) => {
+        const watermark = new watermark_default(watermarkConfig);
+        core_default.dom.append(container, watermark.init());
+        processHandle.reg(() => {
+          watermark.destroy();
+        });
+      };
       const intervalDestoryHandle = GenProcessDestoryHandle();
       const open = (openParams) => __async(this, null, function* () {
         var _a2, _b, _c;
@@ -35793,6 +35804,7 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
             }
             throw openMedia.message;
           }
+          addWatermark(myVideo);
           const openResult = yield openMedia == null ? void 0 : openMedia.push();
           if (openResult.code != "SUCCESS") {
             throw openResult.message;
@@ -35842,6 +35854,7 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
                   hasVideo: !!waitRemoteResult.data.video,
                   events: dialogPanelHandle.closeHandle
                 }, dialogPanelHandle.pcSink);
+                addWatermark(remoteVideo);
                 processHandle.reg(() => {
                   var _a3;
                   (_a3 = remoteOpenResult.close) == null ? void 0 : _a3.call(remoteOpenResult);
@@ -35860,6 +35873,7 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
                 hasVideo: avCall2.video,
                 events: dialogPanelHandle.closeHandle
               }, dialogPanelHandle.pcSink);
+              addWatermark(remoteVideo);
               processHandle.reg(() => {
                 var _a3;
                 (_a3 = remoteOpenResult.close) == null ? void 0 : _a3.call(remoteOpenResult);
@@ -35975,7 +35989,8 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
       playerConfig: {
         disabledControls: (params == null ? void 0 : params.disabledControls) ? [...params == null ? void 0 : params.disabledControls, "ptzControl", "mike"] : ["ptzControl", "mike"],
         enableController: !!(params == null ? void 0 : params.enableController)
-      }
+      },
+      watermark: params == null ? void 0 : params.watermark
     });
     const videoEle = player.video.getVideoEl();
     let firstTime = 0;
@@ -36061,7 +36076,7 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
   // src/components/callEndPointUtils.ts
   function pushLocalMedia(params) {
     return __async(this, null, function* () {
-      var _a, _b, _c, _d, _e, _f;
+      var _a, _b, _c, _d, _e, _f, _g;
       i18n_default(params.locale || "zh");
       const processHandle = GenProcessDestoryHandle();
       let container = null;
@@ -36071,7 +36086,13 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
         container.style.width = "100%";
         container.style.position = "relative";
         core_default.dom.append(params.container, container);
-        container.player = CreatePlayerPlugin(container, params.renderParams);
+        container.player = CreatePlayerPlugin(container, __spreadProps(__spreadValues({}, params.renderParams), {
+          watermark: mergeWatermarkConfig(
+            globalConfigHandler.getDefaultProps().watermark,
+            (_a = params.renderParams) == null ? void 0 : _a.watermark,
+            params.watermark
+          )
+        }));
       }
       processHandle.reg(() => {
         if (container) {
@@ -36086,7 +36107,7 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
       });
       const resultResult = yield mediaEndPoint.open({
         container,
-        videoEle: (_a = container == null ? void 0 : container.player) == null ? void 0 : _a.getVideoEle(),
+        videoEle: (_b = container == null ? void 0 : container.player) == null ? void 0 : _b.getVideoEle(),
         call: {
           videoCall: !!params.video,
           name: "",
@@ -36114,7 +36135,7 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
       }
       const pushResult = yield resultResult.push();
       if (pushResult.code != "SUCCESS") {
-        (_b = resultResult.close) == null ? void 0 : _b.call(resultResult);
+        (_c = resultResult.close) == null ? void 0 : _c.call(resultResult);
         return pushResult;
       }
       const close = () => __async(this, null, function* () {
@@ -36123,20 +36144,20 @@ a=fmtp:${pt} x-google-start-bitrate=${bitrate}`
         (_b2 = resultResult.close) == null ? void 0 : _b2.call(resultResult);
         processHandle.invoke();
       });
-      if ((_c = pushResult.streamIdInfo) == null ? void 0 : _c.mediaStream) {
-        const mediaStream = (_d = pushResult.streamIdInfo) == null ? void 0 : _d.mediaStream;
+      if ((_d = pushResult.streamIdInfo) == null ? void 0 : _d.mediaStream) {
+        const mediaStream = (_e = pushResult.streamIdInfo) == null ? void 0 : _e.mediaStream;
         const configHandle = GetInnerConfig(callEndPointConfig).pushMediaStream({
           stream: mediaStream,
           isShare: !!params.displayMedia
         });
         if (params.container) {
-          (_e = container == null ? void 0 : container.player) == null ? void 0 : _e.setMediaStream(mediaStream);
+          (_f = container == null ? void 0 : container.player) == null ? void 0 : _f.setMediaStream(mediaStream);
         }
         processHandle.reg(() => {
           configHandle.remove();
         });
       }
-      if ((_f = pushResult.streamIdInfo) == null ? void 0 : _f.duration) {
+      if ((_g = pushResult.streamIdInfo) == null ? void 0 : _g.duration) {
         let containerTrialShow2 = function() {
           if (container && !params.customDisTrial) {
             const ele = document.createElement("div");

package/dist/main.es.js

@@ -118,7 +118,7 @@ var __async = (__this, __arguments, generator) => {
 var define_processenv_default;
 var init_define_processenv = __esm({
   "<define:processenv>"() {
-    define_processenv_default = { NODE_ENV: "production", SH_LIB_NAME: "@besovideo/webrtc-player", SH_LIB_VERSION: "0.10.28", PROJECT_NAMESPACE: "bvplayer" };
+    define_processenv_default = { NODE_ENV: "production", SH_LIB_NAME: "@besovideo/webrtc-player", SH_LIB_VERSION: "0.10.29", PROJECT_NAMESPACE: "bvplayer" };
   }
 });
 
@@ -35725,6 +35725,17 @@ function CreateCallEndPoint(createParams) {
       dialogPanelHandle.setZIndex(createParams.zIndex);
     }
     const { myVideo, remoteVideo } = dialogPanelHandle;
+    const watermarkConfig = mergeWatermarkConfig(
+      globalConfigHandler.getDefaultProps().watermark,
+      createParams.watermark
+    );
+    const addWatermark = (container) => {
+      const watermark = new watermark_default(watermarkConfig);
+      core_default.dom.append(container, watermark.init());
+      processHandle.reg(() => {
+        watermark.destroy();
+      });
+    };
     const intervalDestoryHandle = GenProcessDestoryHandle();
     const open = (openParams) => __async(this, null, function* () {
       var _a2, _b, _c;
@@ -35775,6 +35786,7 @@ function CreateCallEndPoint(createParams) {
           }
           throw openMedia.message;
         }
+        addWatermark(myVideo);
         const openResult = yield openMedia == null ? void 0 : openMedia.push();
         if (openResult.code != "SUCCESS") {
           throw openResult.message;
@@ -35824,6 +35836,7 @@ function CreateCallEndPoint(createParams) {
                 hasVideo: !!waitRemoteResult.data.video,
                 events: dialogPanelHandle.closeHandle
               }, dialogPanelHandle.pcSink);
+              addWatermark(remoteVideo);
               processHandle.reg(() => {
                 var _a3;
                 (_a3 = remoteOpenResult.close) == null ? void 0 : _a3.call(remoteOpenResult);
@@ -35842,6 +35855,7 @@ function CreateCallEndPoint(createParams) {
               hasVideo: avCall2.video,
               events: dialogPanelHandle.closeHandle
             }, dialogPanelHandle.pcSink);
+            addWatermark(remoteVideo);
             processHandle.reg(() => {
               var _a3;
               (_a3 = remoteOpenResult.close) == null ? void 0 : _a3.call(remoteOpenResult);
@@ -35957,7 +35971,8 @@ function CreatePlayerPlugin(container, params) {
     playerConfig: {
       disabledControls: (params == null ? void 0 : params.disabledControls) ? [...params == null ? void 0 : params.disabledControls, "ptzControl", "mike"] : ["ptzControl", "mike"],
       enableController: !!(params == null ? void 0 : params.enableController)
-    }
+    },
+    watermark: params == null ? void 0 : params.watermark
   });
   const videoEle = player.video.getVideoEl();
   let firstTime = 0;
@@ -36043,7 +36058,7 @@ function CreatePlayerPlugin(container, params) {
 // src/components/callEndPointUtils.ts
 function pushLocalMedia(params) {
   return __async(this, null, function* () {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g;
     i18n_default(params.locale || "zh");
     const processHandle = GenProcessDestoryHandle();
     let container = null;
@@ -36053,7 +36068,13 @@ function pushLocalMedia(params) {
       container.style.width = "100%";
       container.style.position = "relative";
       core_default.dom.append(params.container, container);
-      container.player = CreatePlayerPlugin(container, params.renderParams);
+      container.player = CreatePlayerPlugin(container, __spreadProps(__spreadValues({}, params.renderParams), {
+        watermark: mergeWatermarkConfig(
+          globalConfigHandler.getDefaultProps().watermark,
+          (_a = params.renderParams) == null ? void 0 : _a.watermark,
+          params.watermark
+        )
+      }));
     }
     processHandle.reg(() => {
       if (container) {
@@ -36068,7 +36089,7 @@ function pushLocalMedia(params) {
     });
     const resultResult = yield mediaEndPoint.open({
       container,
-      videoEle: (_a = container == null ? void 0 : container.player) == null ? void 0 : _a.getVideoEle(),
+      videoEle: (_b = container == null ? void 0 : container.player) == null ? void 0 : _b.getVideoEle(),
       call: {
         videoCall: !!params.video,
         name: "",
@@ -36096,7 +36117,7 @@ function pushLocalMedia(params) {
     }
     const pushResult = yield resultResult.push();
     if (pushResult.code != "SUCCESS") {
-      (_b = resultResult.close) == null ? void 0 : _b.call(resultResult);
+      (_c = resultResult.close) == null ? void 0 : _c.call(resultResult);
       return pushResult;
     }
     const close = () => __async(this, null, function* () {
@@ -36105,20 +36126,20 @@ function pushLocalMedia(params) {
       (_b2 = resultResult.close) == null ? void 0 : _b2.call(resultResult);
       processHandle.invoke();
     });
-    if ((_c = pushResult.streamIdInfo) == null ? void 0 : _c.mediaStream) {
-      const mediaStream = (_d = pushResult.streamIdInfo) == null ? void 0 : _d.mediaStream;
+    if ((_d = pushResult.streamIdInfo) == null ? void 0 : _d.mediaStream) {
+      const mediaStream = (_e = pushResult.streamIdInfo) == null ? void 0 : _e.mediaStream;
       const configHandle = GetInnerConfig(callEndPointConfig).pushMediaStream({
         stream: mediaStream,
         isShare: !!params.displayMedia
       });
       if (params.container) {
-        (_e = container == null ? void 0 : container.player) == null ? void 0 : _e.setMediaStream(mediaStream);
+        (_f = container == null ? void 0 : container.player) == null ? void 0 : _f.setMediaStream(mediaStream);
       }
       processHandle.reg(() => {
         configHandle.remove();
       });
     }
-    if ((_f = pushResult.streamIdInfo) == null ? void 0 : _f.duration) {
+    if ((_g = pushResult.streamIdInfo) == null ? void 0 : _g.duration) {
       let containerTrialShow2 = function() {
         if (container && !params.customDisTrial) {
           const ele = document.createElement("div");

package/dist/types/components/callEndPoint.d.ts

@@ -2,6 +2,7 @@ import { AvCallPayload } from "src/api/call";
 import initI18n from "../locales/i18n";
 import { ICommandWsGetter } from "./callComponents/commandWsManager";
 import { CallEndPointConfigManagerUser } from "./callComponents/callEndPointConfig";
+import { IWatermarkConfig } from "../plugins/watermark";
 declare enum ECallSteps {
     "GET_USER_INFO" = "GET_USER_INFO",
     "START_CALL" = "START_CALL",
@@ -24,6 +25,7 @@ type TCreateEndPointParams = ICommandWsGetter & {
     onClose?: () => void;
     zIndex?: number;
     locale?: Parameters<typeof initI18n>[0];
+    watermark?: IWatermarkConfig;
 };
 export declare function CreateProcessHandle<T extends string, TData = void>(): {
     reg(handle: (data: TData) => void | Promise<void>): {

package/dist/types/components/callEndPointUtils.d.ts

@@ -1,6 +1,7 @@
 import { IOpenResult } from "./callComponents/mediaEndPoint";
 import { IOpenParams } from "./callEndPoint";
 import { CreatePlayerPlugin } from "./callEndPointUtilsPlayer";
+import { IWatermarkConfig } from "../plugins/watermark";
 export type IPushLocalMediaResult = IOpenResult & {
     streamIdInfo?: {
         id: string;
@@ -15,6 +16,7 @@ declare function pushLocalMedia(params: {
     locale?: "zh" | "en";
     container?: HTMLDivElement;
     renderParams?: Parameters<typeof CreatePlayerPlugin>[1];
+    watermark?: IWatermarkConfig;
     video?: boolean;
     audio?: boolean;
     displayMedia?: IOpenParams["displayMedia"];

package/dist/types/components/callEndPointUtilsPlayer.d.ts

@@ -1,7 +1,9 @@
 import { IControlPluginMap } from "../plugins/controller";
+import { IWatermarkConfig } from "../plugins/watermark";
 export declare function CreatePlayerPlugin(container: HTMLDivElement, params?: {
-    disabledControls: (keyof IControlPluginMap)[];
-    enableController: boolean;
+    disabledControls?: (keyof IControlPluginMap)[];
+    enableController?: boolean;
+    watermark?: IWatermarkConfig;
 }): {
     setMediaStream(stream: MediaStream): void;
     destory(): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@besovideo/webrtc-player",
-  "version": "0.10.28",
+  "version": "0.10.29",
   "description": "@besovideo/webrtc-player desc",
   "type": "module",
   "types": "./dist/types/main.d.ts",