fcr-ui-scene 3.6.0 → 3.6.2

package/lib/modules/components/member-window/components/member-actions/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 require("core-js/modules/es.object.define-property.js");
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -38,7 +37,6 @@ require("core-js/modules/esnext.set.symmetric-difference.js");
 require("core-js/modules/esnext.set.union.v2.js");
 require("core-js/modules/esnext.set.union.js");
 require("core-js/modules/web.dom-collections.iterator.js");
-var _react = _interopRequireDefault(require("react"));
 var _fcrCore = require("fcr-core");
 var _provider = require("./provider");
 var _index = require("./components/layout/index");

package/lib/modules/components/member-window/components/member-actions/libs/index.js

@@ -11,7 +11,6 @@ var _type = require("../../../../../video-window/type");
 var handleVideoWindowVisibleChange = exports.handleVideoWindowVisibleChange = function handleVideoWindowVisibleChange(width, height, setResizable, videoWindowPreviewType) {
   var videoWindow = _dialogs.dialogWindows.get(_constant.FcrUIDialogKey.VIDEO_WINDOW);
   if (!videoWindow) return;
-  var nearDispaly = window.runtime.screen.getDisplayNearestPoint(videoWindow.getBounds());
   videoWindow.setBounds({
     width: width,
     height: height

package/lib/modules/components/member-window/components/video-player/components/remote-video-player.d.ts

@@ -1,8 +1,9 @@
 import { AgoraRtcRenderMode, AgoraRtcVideoStreamType } from 'fcr-core/lib/imports';
-export declare const FcrUIRemoteVideoPlayer: ({ streamId, hasVideoStream, videoStreamType, renderMode, hasScreenSharing, }: {
+export declare const FcrUIRemoteVideoPlayer: ({ streamId, hasVideoStream, videoStreamType, renderMode, hasScreenSharing, scalcValue, }: {
     streamId: string;
     hasVideoStream: boolean;
     videoStreamType: AgoraRtcVideoStreamType;
     renderMode: AgoraRtcRenderMode;
     hasScreenSharing: boolean;
+    scalcValue: number;
 }) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/components/member-window/components/video-player/components/remote-video-player.js

@@ -18,7 +18,8 @@ var FcrUIRemoteVideoPlayer = exports.FcrUIRemoteVideoPlayer = (0, _mobxReact.obs
     hasVideoStream = _ref.hasVideoStream,
     videoStreamType = _ref.videoStreamType,
     renderMode = _ref.renderMode,
-    hasScreenSharing = _ref.hasScreenSharing;
+    hasScreenSharing = _ref.hasScreenSharing,
+    scalcValue = _ref.scalcValue;
   var divRef = (0, _react.useRef)(null);
   var context = (0, _react.useContext)(_videoTrackRenderContext.FcrVideoTrackRenderContext);
   var t = (0, _i18n.useI18n)();
@@ -45,6 +46,9 @@ var FcrUIRemoteVideoPlayer = exports.FcrUIRemoteVideoPlayer = (0, _mobxReact.obs
       className: (0, _classnames["default"])('fcr-member-window-body fcr-member-window-body-video-remote', {
         'fcr-member-window-body-video-remote-render': isFirstRemoteVideoFrameRendered && hasVideoStream
       }),
+      style: {
+        transform: "scale(".concat(scalcValue, ")")
+      },
       ref: divRef
     })
   });

package/lib/modules/components/member-window/components/video-player/index.d.ts

@@ -6,4 +6,5 @@ export declare const FcrUIVideoPlayer: (props: {
     videoStreamType: AgoraRtcVideoStreamType;
     renderMode: AgoraRtcRenderMode;
     hasScreenSharing: boolean;
+    scalcValue: number;
 }) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/components/member-window/index.css

@@ -247,6 +247,7 @@
 .fcr-member-window-gallery .fcr-user-window-actions-bottom {
   height: 24px;
   font-size: 12px;
+  backdrop-filter: none;
 }
 
 .fcr-user-window-actions-tag {

package/lib/modules/components/member-window/index.d.ts

@@ -8,4 +8,4 @@ export declare const AvatarTextSizeRatio = 0.32;
 export declare const HideControlsTimeout = 3000;
 export declare const meetingConnectorTypes: Set<FcrRoomConnectorType>;
 export declare const clamp: (val: number, min: number, max: number) => number;
-export declare const MemberWindow: ({ showAvatar, windowData, onDoubleClick, slot, width, height, canShowSpeakerSpotlight, onRemovePin, memberWindowPreviewType, videoRenderMode, videoStreamType, isVideoSuspended, }: MemberWindowProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MemberWindow: ({ showAvatar, windowData, onDoubleClick, slot, width, height, canShowSpeakerSpotlight, onRemovePin, memberWindowPreviewType, videoRenderMode, videoStreamType, isVideoSuspended, annotation, scalcValue, }: MemberWindowProps) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/components/member-window/index.js

@@ -66,10 +66,11 @@ var MemberWindow = exports.MemberWindow = (0, _mobxReact.observer)(function (_re
     memberWindowPreviewType = _ref.memberWindowPreviewType,
     videoRenderMode = _ref.videoRenderMode,
     videoStreamType = _ref.videoStreamType,
-    isVideoSuspended = _ref.isVideoSuspended;
+    isVideoSuspended = _ref.isVideoSuspended,
+    annotation = _ref.annotation,
+    scalcValue = _ref.scalcValue;
   var userName = windowData.userName,
     videoStreamId = windowData.videoStreamId,
-    audioStreamId = windowData.audioStreamId,
     userId = windowData.userId,
     isMySelf = windowData.isMySelf,
     hasMicrophoneAudioStream = windowData.hasMicrophoneAudioStream,
@@ -79,7 +80,8 @@ var MemberWindow = exports.MemberWindow = (0, _mobxReact.observer)(function (_re
     windowId = windowData.windowId,
     audioStreamConnectorType = windowData.audioStreamConnectorType,
     videoStreamConnectorType = windowData.videoStreamConnectorType,
-    hasScreenSharing = windowData.hasScreenSharing;
+    hasScreenSharing = windowData.hasScreenSharing,
+    videoSourceType = windowData.videoSourceType;
   var t = (0, _i18n.useI18n)();
   var connectorType = audioStreamConnectorType !== _fcrCore.FcrRoomConnectorType.NONE ? audioStreamConnectorType : videoStreamConnectorType;
   var isPhone = audioStreamConnectorType === _fcrCore.FcrRoomConnectorType.PSTN;
@@ -129,7 +131,6 @@ var MemberWindow = exports.MemberWindow = (0, _mobxReact.observer)(function (_re
     "data-user-id": userId,
     "data-stream-id": videoStreamId,
     "data-user-name": userName,
-    onDoubleClick: onDoubleClick,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _classnames["default"])('fcr-member-window-background', {
         // 'fcr-member-window-is-broken': isBroken,
@@ -150,8 +151,9 @@ var MemberWindow = exports.MemberWindow = (0, _mobxReact.observer)(function (_re
       videoStreamType: videoStreamType,
       renderMode: videoRenderMode,
       hasVideoStream: hasVideoStream,
-      hasScreenSharing: hasScreenSharing
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      hasScreenSharing: hasScreenSharing,
+      scalcValue: scalcValue
+    }), hasScreenSharing && videoSourceType === _fcrCore.FcrVideoSourceType.SCREEN ? annotation : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _classnames["default"])("fcr-member-window-excitation", {
         'fcr-member-window-excitation-show': canShowSpeakerSpotlight && isSpeakerSpotlight
       })

package/lib/modules/components/member-window/types.d.ts

@@ -7,6 +7,7 @@ export interface MemberWindowCustomProps {
     onDoubleClick?: () => void;
     onRemovePin: (streamId: string) => void;
     slot?: React.ReactNode;
+    annotation?: React.ReactNode;
     width?: number;
     height?: number;
     canShowSpeakerSpotlight: boolean;
@@ -17,6 +18,7 @@ export interface MemberWindowCustomProps {
 }
 export interface MemberWindowProps extends MemberWindowCustomProps {
     windowData: FcrUIVideoWindowData;
+    scalcValue: number;
 }
 export interface MicVolumeProps {
     id: string | undefined;

package/lib/modules/components/security-menu/index.js

@@ -45,7 +45,8 @@ var SecurityMenu = (0, _mobxReact.observer)(function (props) {
     setCheckedStateMap = props.setCheckedStateMap;
   var transI18n = (0, _i18n.useI18n)();
   var allActions = [];
-  var setLockRoomEnabled = privilege.setLockRoomEnabled,
+  var setAllowAnnotation = privilege.setAllowAnnotation,
+    setLockRoomEnabled = privilege.setLockRoomEnabled,
     setAllowChat = privilege.setAllowChat,
     setAllowUnmuteSelfAudio = privilege.setAllowUnmuteSelfAudio,
     setAllowUnmuteSelfVideo = privilege.setAllowUnmuteSelfVideo,
@@ -281,17 +282,17 @@ var SecurityMenu = (0, _mobxReact.observer)(function (props) {
   if (hasAllowWriteBoardPermission()) {
     allActions.push({
       title: /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
-        checked: checkedStateMap.shareWhiteboard,
-        label: transI18n('fmt_screenshare_options_editable'),
+        checked: checkedStateMap.allowBoardWriteState,
+        label: transI18n('fmt_security_mainwindow_label_interactive_annotations'),
         styleType: "white"
       }),
-      key: 'share_whiteboard',
+      key: 'enable_annotations',
       type: 'primary',
       onButtonClick: function onButtonClick() {
         setCheckedStateMap(_objectSpread(_objectSpread({}, checkedStateMap), {
-          shareWhiteboard: !checkedStateMap.shareWhiteboard
+          enableAnnotation: !checkedStateMap.allowBoardWriteState
         }));
-        setAllowWriteBoard(!checkedStateMap.shareWhiteboard);
+        setAllowWriteBoard(!checkedStateMap.allowBoardWriteState);
       }
     });
   }

package/lib/modules/connection-gateway/components/phone/index.js

@@ -123,7 +123,7 @@ var ConnectFromPhone = (0, _mobxReact.observer)(function () {
               phone: phone
             });
           },
-          onInputBlur: function onInputBlur(e) {
+          onInputBlur: function onInputBlur() {
             return validateNumberHandler(currentCallInfo.phone);
           }
         }), errorMessage && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/lib/modules/control-bar/components/annotation-button/index.d.ts

@@ -0,0 +1 @@
+export declare const AnnotationButton: () => import("react/jsx-runtime").JSX.Element;

package/lib/modules/control-bar/components/annotation-button/index.js

@@ -0,0 +1,59 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AnnotationButton = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _tooltipsButton = require("agora-ui-foundation/lib/components/tooltips-button");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _annotationMenu = _interopRequireDefault(require("../../../components/annotation-menu"));
+var _react = require("react");
+var _mobxReact = require("mobx-react");
+var _store = require("../../store");
+var _jsxRuntime = require("react/jsx-runtime");
+var AnnotationButton = exports.AnnotationButton = (0, _mobxReact.observer)(function () {
+  var transI18n = (0, _i18n.useI18n)();
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    toggleAnnotation = _useContext.toggleAnnotation,
+    hasAnnotationAllowWritePermission = _useContext.hasAnnotationAllowWritePermission,
+    allowAnnotationWriteState = _useContext.allowAnnotationWriteState,
+    setAllAnnotationWrite = _useContext.setAllAnnotationWrite,
+    isSharingScreen = _useContext.isSharingScreen,
+    log = _useContext.log;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltipsButton.FrcTooltipButton, {
+    active: visible,
+    tooltip: {
+      content: transI18n('fmt_screenshare_controlbar_button_annotations'),
+      icon: {
+        type: _type.FcrIconType.FCR_RENAME,
+        size: 32,
+        colors: {
+          iconPrimary: 'var(--fcr_web_ui_scene_mainicon1)'
+        }
+      }
+    },
+    onTooltipButtonClick: isSharingScreen ? toggleAnnotation : function () {
+      return log('share screen is starting, please wait a moment to operate');
+    },
+    withPopover: true,
+    popover: {
+      content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_annotationMenu["default"], {
+        allowAnnotationWriteState: allowAnnotationWriteState,
+        hasAnnotationAllowWritePermission: hasAnnotationAllowWritePermission,
+        setAllowAnnotationWrite: setAllAnnotationWrite,
+        showClear: true
+      }),
+      onVisibleChange: function onVisibleChange(visible) {
+        setVisible(visible);
+      }
+    }
+  });
+});

package/lib/modules/control-bar/index.d.ts

@@ -19,7 +19,9 @@ import { FcrUIDialogProvider } from '../../providers/dialog-provider';
 import { FcrUIMeetingTimeSharedDataSource } from '../../shared-data-source/meeting-time';
 import { FcrUIMessageProvider } from '../../providers/message-provider';
 import { FcrUISecuritySharedDataSource } from '../../shared-data-source/security-data';
-import { FcrUIScreenShareDataSource } from '../../shared-data-source/screen-share-data-source';
+import { FcrUIAnnotationProvider } from '../../providers/annotation-provider';
+import { FcrUISharingProvider } from '../../providers/sharing-provider';
+import { FcrUIScreenShareSharedDataSource } from '../../shared-data-source/screen-share-data';
 export declare class ControlBarUIModule extends UIModule {
     private _store?;
     private _deviceControlStore?;
@@ -42,7 +44,9 @@ export declare class ControlBarUIModule extends UIModule {
     sharedMeetingTimeDataSource?: FcrUIMeetingTimeSharedDataSource;
     messageProvider?: FcrUIMessageProvider;
     sharedSecuritySharedDataSource?: FcrUISecuritySharedDataSource;
-    screenShareDataSource?: FcrUIScreenShareDataSource;
+    annotationProvider?: FcrUIAnnotationProvider;
+    sharingProvider?: FcrUISharingProvider;
+    sharedScreenShareSharedDataSource?: FcrUIScreenShareSharedDataSource;
     onNodeWillActive(): void;
     onNodeWillInactive(): void;
     getComponent(props: {

package/lib/modules/control-bar/index.js

@@ -74,8 +74,11 @@ var ControlBarUIModule = exports.ControlBarUIModule = /*#__PURE__*/function (_UI
         sharedMeetingTimeDataSource: this.sharedMeetingTimeDataSource,
         messageProvider: this.messageProvider,
         sharedSecuritySharedDataSource: this.sharedSecuritySharedDataSource,
-        dialogProvider: this.dialogProvider,
-        screenShareDataSource: this.screenShareDataSource
+        annotationProvider: this.annotationProvider,
+        sharingProvider: this.sharingProvider,
+        screenShareProvider: this.screenShareProvider,
+        sharedScreenShareSharedDataSource: this.sharedScreenShareSharedDataSource,
+        dialogProvider: this.dialogProvider
       });
       this.privilegeProvider = this.privilegeProvider;
       this.screenShareProvider = this.screenShareProvider;

package/lib/modules/control-bar/store.d.ts

@@ -18,8 +18,11 @@ import { FcrUIMeetingTimeSharedDataSource } from '../../shared-data-source/meeti
 import { CurrentShareScreenWorkArea } from '../../utilities/tools';
 import { FcrUIMessageProvider } from '../../providers/message-provider';
 import { FcrSecurityCheckedStateType, FcrUISecuritySharedDataSource } from '../../shared-data-source/security-data';
+import { FcrUIAnnotationProvider } from '../../providers/annotation-provider';
+import { FcrUISharingProvider } from '../../providers/sharing-provider';
+import { FcrUIScreenShareProvider } from '../../providers/screen-share-provider';
+import { FcrUIScreenShareSharedDataSource } from '../../shared-data-source/screen-share-data';
 import { FcrUIDialogProvider } from '../../providers/dialog-provider';
-import { FcrUIScreenShareDataSource } from '../../shared-data-source/screen-share-data-source';
 export default class ControlBarStore {
     protected logger: import("agora-foundation/lib/logger").Logger;
     private _screenBounds;
@@ -39,13 +42,15 @@ export default class ControlBarStore {
     private _abilityProvider;
     private _sharedMeetingTimeDataSource;
     private _sharedSecuritySharedDataSource;
+    private _sharedScreenShareSharedDataSource;
     private _messageProvider;
+    private _annotationProvider;
+    private _sharingProvider;
+    private _screenShareProvider;
     private _dialogProvider;
-    private _screenShareDataSource;
     private _dialogObsever;
     private _participantDialogId;
     accessor leaveConfirmRef: React.ReactNode;
-    accessor shareWithAudio: boolean;
     accessor currentShareId: string;
     accessor currentShareType: AgoraRtcScreenCaptureType;
     accessor currentShareBounds: CurrentShareBounds;
@@ -62,7 +67,7 @@ export default class ControlBarStore {
     accessor hiddenShareActionNav: boolean;
     accessor boardOwnerUser: string;
     accessor currentShareDisplayId: number;
-    get shareAudioProcessingChannel(): AudioProcessingChannel;
+    get shareWithAudio(): boolean;
     get privilegeProvider(): FcrUIPrivilegeProvider;
     get localUser(): import("fcr-core/lib/type").FcrUserInfo;
     get remoteUsers(): import("fcr-core/lib/type").FcrUserInfo[];
@@ -80,6 +85,9 @@ export default class ControlBarStore {
     get hasStartLiveStreamingPermission(): boolean;
     get hasAssignHostBeforeLeavingPermission(): boolean;
     get hasEndRoomPermission(): boolean;
+    get hasAnnotationAllowWritePermission(): boolean;
+    get hasAnnotationStartPermission(): boolean;
+    get allowAnnotationWriteState(): boolean;
     get totalHourText(): string;
     get totalMinuteText(): string;
     get meetingTimeStatus(): import("../../shared-data-source/meeting-time").MeetingStatus;
@@ -95,7 +103,10 @@ export default class ControlBarStore {
     get isPstnUser(): boolean;
     get localUserRole(): import("fcr-core").FcrUserRole;
     get users(): import("fcr-core/lib/type").FcrUserInfo[];
-    constructor({ uiEventStore, securityStore, roomControl, deviceProvider, sharedLayoutDataSource, roomProvider, sharedChatDataSource, sharedMemberDataSource, localStorageProvider, abilityProvider, sharedMeetingTimeDataSource, messageProvider, sharedSecuritySharedDataSource, dialogProvider, screenShareDataSource, }: {
+    get shareAudioProcessingChannel(): AudioProcessingChannel;
+    get checkedStateMap(): FcrSecurityCheckedStateType;
+    get isSharingScreen(): boolean;
+    constructor({ uiEventStore, securityStore, roomControl, deviceProvider, sharedLayoutDataSource, roomProvider, sharedChatDataSource, sharedMemberDataSource, localStorageProvider, abilityProvider, sharedMeetingTimeDataSource, messageProvider, sharedSecuritySharedDataSource, annotationProvider, sharingProvider, screenShareProvider, sharedScreenShareSharedDataSource, dialogProvider, }: {
         uiEventStore: FcrUIEventProvider;
         securityStore: FcrUIPrivilegeProvider;
         roomControl: FcrMainRoomControl;
@@ -109,12 +120,14 @@ export default class ControlBarStore {
         sharedMeetingTimeDataSource: FcrUIMeetingTimeSharedDataSource;
         messageProvider: FcrUIMessageProvider;
         sharedSecuritySharedDataSource: FcrUISecuritySharedDataSource;
+        annotationProvider: FcrUIAnnotationProvider;
+        sharingProvider: FcrUISharingProvider;
+        screenShareProvider: FcrUIScreenShareProvider;
+        sharedScreenShareSharedDataSource: FcrUIScreenShareSharedDataSource;
         dialogProvider: FcrUIDialogProvider;
-        screenShareDataSource: FcrUIScreenShareDataSource;
     });
-    get checkedStateMap(): FcrSecurityCheckedStateType;
     setCheckedStateMap(val: FcrSecurityCheckedStateType): void;
-    initControlBar(payload: any, browserWindow: Electron.BrowserWindow): void;
+    initControlBar(payload: any, _browserWindow: Electron.BrowserWindow): void;
     updateCurrentShareContent(payload: CurrentShareScreenTypes): void;
     setShareWithAudioState(withAudio: boolean): void;
     showLockedRoomToast(enable: boolean): void;
@@ -133,7 +146,10 @@ export default class ControlBarStore {
     setEnableWaitingRoom(enable: boolean): void;
     handleLeaveRoom(): void;
     getLocalMeetingTime(): string | null;
+    toggleAnnotation(): void;
+    setAllAnnotationWrite(allow: boolean): void;
     release(): void;
+    log(info: string): void;
     private _resetMessageCount;
 }
 export declare const StoreContext: import("react").Context<ControlBarStore>;