@ray-js/ipc-player-integration 0.0.30 → 0.0.31-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/ctx/ctx.composition.js +10 -3
- package/lib/ctx/ctx.js +8 -0
- package/lib/ctx/ports.output.d.ts +1 -0
- package/lib/features/initPlayerWidgets/index.d.ts +2 -0
- package/lib/features/initPlayerWidgets/index.js +8 -1
- package/lib/iconfont/iconfont.css +204 -4
- package/lib/iconfont/iconfont.js +6 -6
- package/lib/iconfont/iconfont.json +351 -1
- package/lib/iconfont/iconfont.ttf +0 -0
- package/lib/iconfont/iconfont.woff +0 -0
- package/lib/iconfont/iconfont.woff2 +0 -0
- package/lib/interface.d.ts +1 -0
- package/lib/ui/constant.d.ts +2 -0
- package/lib/ui/constant.js +2 -0
- package/lib/ui/context.d.ts +1 -0
- package/lib/ui/context.js +2 -1
- package/lib/ui/hooks.js +3 -2
- package/lib/ui/ui.d.ts +1 -0
- package/lib/ui/ui.js +38 -16
- package/lib/widgets/index.d.ts +1 -0
- package/lib/widgets/index.js +2 -1
- package/lib/widgets/muted/muted.js +3 -1
- package/lib/widgets/realTimeMagnification/index.d.ts +1 -0
- package/lib/widgets/realTimeMagnification/index.js +1 -0
- package/lib/widgets/realTimeMagnification/realTimeMagnification.d.ts +8 -0
- package/lib/widgets/realTimeMagnification/realTimeMagnification.js +91 -0
- package/lib/widgets/realTimeMagnification/realTimeMagnification.less +20 -0
- package/lib/widgets/videoBitKBP/videoBitKBP.d.ts +1 -0
- package/lib/widgets/videoBitKBP/videoBitKBP.js +38 -11
- package/lib/widgets/videoBitKBP/videoBitKBP.less +41 -16
- package/package.json +1 -1
|
@@ -4,7 +4,7 @@ const _excluded = ["title", "duration"];
|
|
|
4
4
|
import { getCameraConfigInfo } from '@ray-js/ray-ipc-utils';
|
|
5
5
|
import { IntercomMode, MuteMode, ClarityType } from '@ray-js/ray-ipc-utils/lib/interface';
|
|
6
6
|
import { createUseCtx } from './ctx';
|
|
7
|
-
import { FullSmallIntercom, VerticalSmallIntercom, BatteryFull, Battery, Screenshot, TempHumidity, Signal4G, RecordVideo, FullScreen, VideoBitKBP, Muted, Resolution, Ptz, MultiPtz, TileTip, PtzMoveableTip, LandscapeTip, TileActions, MoveablePtzControl, SwitchLayout, ToggleVerticalFull } from '../widgets';
|
|
7
|
+
import { FullSmallIntercom, VerticalSmallIntercom, BatteryFull, Battery, Screenshot, TempHumidity, Signal4G, RecordVideo, FullScreen, VideoBitKBP, Muted, Resolution, Ptz, MultiPtz, TileTip, PtzMoveableTip, LandscapeTip, TileActions, MoveablePtzControl, SwitchLayout, ToggleVerticalFull, RealTimeMagnification } from '../widgets';
|
|
8
8
|
import { authorizeStatus } from '../utils/authorize';
|
|
9
9
|
import { landscapeTipId, moveablePtzControlId, multiPtzId, ptzMoveableTipId, tileActionsId, tileTipId } from '../ui/constant';
|
|
10
10
|
import { multiPrefix } from '../widgets/multiCamera/constants';
|
|
@@ -54,6 +54,10 @@ export const defaultBottomLeftContent = [{
|
|
|
54
54
|
}, {
|
|
55
55
|
id: 'Resolution',
|
|
56
56
|
content: Resolution
|
|
57
|
+
}, {
|
|
58
|
+
id: 'RealTimeMagnification',
|
|
59
|
+
content: RealTimeMagnification,
|
|
60
|
+
hidden: true
|
|
57
61
|
}];
|
|
58
62
|
export const defaultBottomRightContent = [{
|
|
59
63
|
id: 'SwitchLayout',
|
|
@@ -111,10 +115,12 @@ const getMemoryState = devId => {
|
|
|
111
115
|
intercomMode: IntercomMode.TwoWay,
|
|
112
116
|
resolution: ClarityType.HD,
|
|
113
117
|
resolutionList: [ClarityType.HD, ClarityType.SD],
|
|
114
|
-
isIntercomSupported: false
|
|
118
|
+
isIntercomSupported: false,
|
|
119
|
+
maxZoomSettings: 6
|
|
115
120
|
};
|
|
116
121
|
return new Promise(resolve => {
|
|
117
122
|
getCameraConfigInfo(devId).then(res => {
|
|
123
|
+
var _res$data$maxZoomSett;
|
|
118
124
|
if (res.code === -1) {
|
|
119
125
|
return resolve(defaultValue);
|
|
120
126
|
}
|
|
@@ -124,7 +130,8 @@ const getMemoryState = devId => {
|
|
|
124
130
|
intercomMode: res.data.intercomInfo.cachedIntercomMode,
|
|
125
131
|
isIntercomSupported: res.data.intercomInfo.isIntercomSupported,
|
|
126
132
|
resolution: res.data.videoResolution.cachedResolution,
|
|
127
|
-
resolutionList: res.data.videoResolution.availableResolutions
|
|
133
|
+
resolutionList: res.data.videoResolution.availableResolutions,
|
|
134
|
+
maxZoomSettings: (_res$data$maxZoomSett = res.data.maxZoomSettings) !== null && _res$data$maxZoomSett !== void 0 ? _res$data$maxZoomSett : 6
|
|
128
135
|
});
|
|
129
136
|
}).catch(err => {
|
|
130
137
|
console.error('获取 getMemoryState 失败:', err);
|
package/lib/ctx/ctx.js
CHANGED
|
@@ -71,6 +71,9 @@ export const createUseCtx = _ref => {
|
|
|
71
71
|
// 摄像头配置是否支持对讲
|
|
72
72
|
const [intercomSupported, setIntercomSupported] = useAtom(false);
|
|
73
73
|
|
|
74
|
+
// 最大缩放倍数
|
|
75
|
+
const [maxZoomSettings, setMaxZoomSettings] = useAtom(6);
|
|
76
|
+
|
|
74
77
|
// 对讲中
|
|
75
78
|
const [intercom] = useAtom(false);
|
|
76
79
|
const [playState] = useAtom(PlayState.CONNECTING);
|
|
@@ -97,12 +100,14 @@ export const createUseCtx = _ref => {
|
|
|
97
100
|
(async () => {
|
|
98
101
|
if (!devId) return;
|
|
99
102
|
try {
|
|
103
|
+
var _res$maxZoomSettings;
|
|
100
104
|
const res = await getMemoryState(devId);
|
|
101
105
|
setResolutionList(res.resolutionList);
|
|
102
106
|
_setResolution(res.resolution, true);
|
|
103
107
|
_setMute(res.mute, true);
|
|
104
108
|
setIntercomMode(res.intercomMode);
|
|
105
109
|
setIntercomSupported(res.isIntercomSupported);
|
|
110
|
+
setMaxZoomSettings((_res$maxZoomSettings = res.maxZoomSettings) !== null && _res$maxZoomSettings !== void 0 ? _res$maxZoomSettings : 6);
|
|
106
111
|
} catch (error) {
|
|
107
112
|
console.error('获取 getMemoryState 失败:', error);
|
|
108
113
|
}
|
|
@@ -112,12 +117,14 @@ export const createUseCtx = _ref => {
|
|
|
112
117
|
if (devId && _playState === PlayState.PLAYING) {
|
|
113
118
|
// 获取缓存的值且同步
|
|
114
119
|
getMemoryState(devId).then(res => {
|
|
120
|
+
var _res$maxZoomSettings2;
|
|
115
121
|
setResolutionList(res.resolutionList);
|
|
116
122
|
// 传true表示值即可,会取播放器的值
|
|
117
123
|
_setResolution(res.resolution, true);
|
|
118
124
|
_setMute(res.mute, true);
|
|
119
125
|
setIntercomMode(res.intercomMode);
|
|
120
126
|
setIntercomSupported(res.isIntercomSupported);
|
|
127
|
+
setMaxZoomSettings((_res$maxZoomSettings2 = res.maxZoomSettings) !== null && _res$maxZoomSettings2 !== void 0 ? _res$maxZoomSettings2 : 6);
|
|
121
128
|
});
|
|
122
129
|
}
|
|
123
130
|
}, [devId, _playState]);
|
|
@@ -258,6 +265,7 @@ export const createUseCtx = _ref => {
|
|
|
258
265
|
intercom,
|
|
259
266
|
intercomMode,
|
|
260
267
|
intercomSupported,
|
|
268
|
+
maxZoomSettings,
|
|
261
269
|
playState,
|
|
262
270
|
setPlayState,
|
|
263
271
|
setPtzControlTipDisabled,
|
|
@@ -9,6 +9,7 @@ export type GetMemoryState = (devId: string) => Promise<{
|
|
|
9
9
|
isIntercomSupported: boolean;
|
|
10
10
|
resolution: ClarityType;
|
|
11
11
|
resolutionList: [ClarityType.HD, ClarityType.SD];
|
|
12
|
+
maxZoomSettings?: number;
|
|
12
13
|
}>;
|
|
13
14
|
export type SetMuteMemoryState = (devId: string, value: boolean) => void;
|
|
14
15
|
export type SetResolutionMemoryState = (devId: string, value: ClarityType) => void;
|
|
@@ -9,7 +9,9 @@ export type InitPlayerWidgetsOptions = {
|
|
|
9
9
|
hideRecordVideoMenu?: boolean;
|
|
10
10
|
hideResolutionMenu?: boolean;
|
|
11
11
|
hideKbsMenu?: boolean;
|
|
12
|
+
hideSignalMenu?: boolean;
|
|
12
13
|
showToggleVerticalFull?: boolean;
|
|
14
|
+
showRealTimeMagnification?: boolean;
|
|
13
15
|
directionControlProps?: Partial<React.ComponentProps<typeof FullScreen>['directionControlProps']>;
|
|
14
16
|
topLeftContent?: ComponentConfig[];
|
|
15
17
|
topRightContent?: ComponentConfig[];
|
|
@@ -11,7 +11,8 @@ export async function initPlayerWidgets(ctx, options) {
|
|
|
11
11
|
const videoKbsIndex = newDefaultTopRightContent.findIndex(item => item.id === 'VideoBitKBP');
|
|
12
12
|
if (videoKbsIndex !== -1) {
|
|
13
13
|
newDefaultTopRightContent[videoKbsIndex].initProps = {
|
|
14
|
-
hideKbsMenu: options.hideKbsMenu
|
|
14
|
+
hideKbsMenu: options.hideKbsMenu,
|
|
15
|
+
hideSignalMenu: options.hideSignalMenu
|
|
15
16
|
};
|
|
16
17
|
}
|
|
17
18
|
ctx.addContent('topRight', newDefaultTopRightContent);
|
|
@@ -37,6 +38,12 @@ export async function initPlayerWidgets(ctx, options) {
|
|
|
37
38
|
hideRecordVideoMenu: options.hideRecordVideoMenu
|
|
38
39
|
};
|
|
39
40
|
}
|
|
41
|
+
if (options.showRealTimeMagnification) {
|
|
42
|
+
const magnificationIndex = newDefaultBottomLeftContent.findIndex(item => item.id === 'RealTimeMagnification');
|
|
43
|
+
if (magnificationIndex !== -1) {
|
|
44
|
+
newDefaultBottomLeftContent[magnificationIndex].hidden = false;
|
|
45
|
+
}
|
|
46
|
+
}
|
|
40
47
|
ctx.addContent('bottomLeft', newDefaultBottomLeftContent);
|
|
41
48
|
const newDefaultBottomRightContent = _cloneDeep(options.bottomRightContent || defaultBottomRightContent);
|
|
42
49
|
const fullScreenIndex = newDefaultBottomRightContent.findIndex(item => item.id === 'FullScreen');
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
@font-face {
|
|
2
2
|
font-family: "icon-panel"; /* Project id 4727767 */
|
|
3
|
-
src: url('iconfont.woff2?t=
|
|
4
|
-
url('iconfont.woff?t=
|
|
5
|
-
url('iconfont.ttf?t=
|
|
3
|
+
src: url('iconfont.woff2?t=1775036808306') format('woff2'),
|
|
4
|
+
url('iconfont.woff?t=1775036808306') format('woff'),
|
|
5
|
+
url('iconfont.ttf?t=1775036808306') format('truetype');
|
|
6
6
|
}
|
|
7
7
|
|
|
8
8
|
.icon-panel {
|
|
@@ -13,6 +13,206 @@
|
|
|
13
13
|
-moz-osx-font-smoothing: grayscale;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
+
.icon-panel-nightvision-mode-black-color:before {
|
|
17
|
+
content: "\e6a2";
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.icon-panel-nightvision-mode-true-color:before {
|
|
21
|
+
content: "\e6a3";
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.icon-panel-nightvision-mode-color:before {
|
|
25
|
+
content: "\e6bc";
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.icon-panel-wi-Fi:before {
|
|
29
|
+
content: "\e6bb";
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.icon-panel-motion-tracking:before {
|
|
33
|
+
content: "\e6ba";
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.icon-panel-optical-zoom:before {
|
|
37
|
+
content: "\e6b8";
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.icon-panel-pip-mode:before {
|
|
41
|
+
content: "\e6b9";
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.icon-panel-basic-shimmer:before {
|
|
45
|
+
content: "\e6b5";
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.icon-panel-basic-nightvision-close:before {
|
|
49
|
+
content: "\e6b6";
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.icon-panel-basic-nightvision-open:before {
|
|
53
|
+
content: "\e6b7";
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.icon-panel-nightvision-mode-ir:before {
|
|
57
|
+
content: "\e6b3";
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
.icon-panel-nightvision-mode-auto:before {
|
|
61
|
+
content: "\e6b4";
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.icon-panel-suo:before {
|
|
65
|
+
content: "\e6b2";
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
.icon-panel-jingdi:before {
|
|
69
|
+
content: "\e6b0";
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.icon-panel-deng:before {
|
|
73
|
+
content: "\e6b1";
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.icon-panel-xiazai:before {
|
|
77
|
+
content: "\e6ae";
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.icon-panel-fenxiang:before {
|
|
81
|
+
content: "\e6af";
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
.icon-panel-a-zu1032:before {
|
|
85
|
+
content: "\e6ad";
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
.icon-panel-jilu:before {
|
|
89
|
+
content: "\e6ac";
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.icon-panel-a-dingweixiao:before {
|
|
93
|
+
content: "\e6ab";
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
.icon-panel-zujifenxiang:before {
|
|
97
|
+
content: "\e6aa";
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.icon-panel-zuji:before {
|
|
101
|
+
content: "\e6a7";
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.icon-panel-chongwudangan:before {
|
|
105
|
+
content: "\e6a8";
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.icon-panel-liuchong:before {
|
|
109
|
+
content: "\e6a6";
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
.icon-panel-weilan:before {
|
|
113
|
+
content: "\e6a9";
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.icon-panel-WER:before {
|
|
117
|
+
content: "\e6a5";
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.icon-panel-infrared-night-vision:before {
|
|
121
|
+
content: "\e6a4";
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.icon-panel-night-vision:before {
|
|
125
|
+
content: "\e6a1";
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
.icon-panel-Access-Key-Password:before {
|
|
129
|
+
content: "\e643";
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
.icon-panel-Access-Mobile1:before {
|
|
133
|
+
content: "\e638";
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
.icon-panel-Access-QuickReply:before {
|
|
137
|
+
content: "\e631";
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
.icon-panel-Access-Key-FaceID2:before {
|
|
141
|
+
content: "\e633";
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
.icon-panel-Access-NoBlock:before {
|
|
145
|
+
content: "\e632";
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.icon-panel-Access-Password-View:before {
|
|
149
|
+
content: "\e61d";
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
.icon-panel-Access-Door:before {
|
|
153
|
+
content: "\e69e";
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
.icon-panel-Access-Camera:before {
|
|
157
|
+
content: "\e69a";
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
.icon-panel-Access-Member:before {
|
|
161
|
+
content: "\e69c";
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
.icon-panel-Access-Password-Hide:before {
|
|
165
|
+
content: "\e619";
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.icon-panel-a-Access-AIGuardian:before {
|
|
169
|
+
content: "\e61b";
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
.icon-panel-Access-Key-Fingerprint:before {
|
|
173
|
+
content: "\e622";
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
.icon-panel-Access-Send:before {
|
|
177
|
+
content: "\e634";
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
.icon-panel-Access-Password-Clear:before {
|
|
181
|
+
content: "\e63d";
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
.icon-panel-Access-Notification-large:before {
|
|
185
|
+
content: "\e63e";
|
|
186
|
+
}
|
|
187
|
+
|
|
188
|
+
.icon-panel-Access-Intercom-large:before {
|
|
189
|
+
content: "\e63f";
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
.icon-panel-Access-Brightness:before {
|
|
193
|
+
content: "\e640";
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
.icon-panel-Access-TempAccess-large:before {
|
|
197
|
+
content: "\e641";
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
.icon-panel-Access-Undo:before {
|
|
201
|
+
content: "\e699";
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
.icon-panel-Access-Key-Card:before {
|
|
205
|
+
content: "\e615";
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
.icon-panel-Access-Replay:before {
|
|
209
|
+
content: "\e616";
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
.icon-panel-Access-Copy:before {
|
|
213
|
+
content: "\e613";
|
|
214
|
+
}
|
|
215
|
+
|
|
16
216
|
.icon-panel-tip-right-arrow:before {
|
|
17
217
|
content: "\e697";
|
|
18
218
|
}
|
|
@@ -33,7 +233,7 @@
|
|
|
33
233
|
content: "\e611";
|
|
34
234
|
}
|
|
35
235
|
|
|
36
|
-
.icon-panel-door-close-small:before {
|
|
236
|
+
.icon-panel-Access-door-close-small:before {
|
|
37
237
|
content: "\e6671";
|
|
38
238
|
}
|
|
39
239
|
|