@ray-js/ipc-player-integration 0.0.53-beta.0 → 0.0.53-beta.1

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.
@@ -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, Floodlight, Siren, TryExperience, Resolution, AutoClarity, Ptz, MultiPtz, TileTip, PtzMoveableTip, LandscapeTip, TileActions, MoveablePtzControl, SwitchLayout, ToggleVerticalFull, RealTimeMagnification, ZoomTurntableEntry } from '../widgets';
7
+ import { FullSmallIntercom, VerticalSmallIntercom, BatteryFull, Battery, Screenshot, TempHumidity, Signal4G, RecordVideo, FullScreen, VideoBitKBP, Muted, Floodlight, Siren, TryExperience, Resolution, Ptz, MultiPtz, TileTip, PtzMoveableTip, LandscapeTip, TileActions, MoveablePtzControl, SwitchLayout, ToggleVerticalFull, RealTimeMagnification, ZoomTurntableEntry } from '../widgets';
8
8
  import { authorizeStatus } from '../utils/authorize';
9
9
  import { PlayState } from '../interface';
10
10
  import { landscapeTipId, moveablePtzControlId, multiPtzId, ptzMoveableTipId, tileActionsId, tileTipId } from '../ui/constant';
@@ -74,11 +74,6 @@ export const defaultBottomLeftContent = [{
74
74
  id: 'RealTimeMagnification',
75
75
  content: RealTimeMagnification,
76
76
  hidden: true
77
- }, /* 自动清晰度:仅宿主存在 ttt 方法 clarityChanged 时由 widget 内部渲染 */
78
- {
79
- id: 'AutoClarity',
80
- content: AutoClarity,
81
- hidden: true
82
77
  }];
83
78
  export const defaultBottomRightContent = [{
84
79
  id: 'SwitchLayout',
package/lib/ctx/ctx.js CHANGED
@@ -109,6 +109,15 @@ export const createUseCtx = _ref => {
109
109
  if (!eventRef.current) {
110
110
  eventRef.current = getEventInstance();
111
111
  }
112
+
113
+ /**
114
+ * 自动清晰度作为独立档位并入清晰度列表:
115
+ * 竖屏宿主弹框(由 resolutionList 构建 actionData)与横屏 FullResolutionControl 共用。
116
+ */
117
+ const withAutoClarity = function () {
118
+ let list = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
119
+ return list.includes(ClarityType.AUTO) ? list : [...list, ClarityType.AUTO];
120
+ };
112
121
  useEffect(() => {
113
122
  // 初始化获取缓存值
114
123
 
@@ -117,7 +126,7 @@ export const createUseCtx = _ref => {
117
126
  try {
118
127
  var _res$maxZoomSettings;
119
128
  const res = await getMemoryState(devId);
120
- setResolutionList(res.resolutionList);
129
+ setResolutionList(withAutoClarity(res.resolutionList));
121
130
  _setResolution(res.resolution, true);
122
131
  _setMute(res.mute, true);
123
132
  setIntercomMode(res.intercomMode);
@@ -133,7 +142,7 @@ export const createUseCtx = _ref => {
133
142
  // 获取缓存的值且同步
134
143
  getMemoryState(devId).then(res => {
135
144
  var _res$maxZoomSettings2;
136
- setResolutionList(res.resolutionList);
145
+ setResolutionList(withAutoClarity(res.resolutionList));
137
146
  // 传true表示值即可,会取播放器的值
138
147
  _setResolution(res.resolution, true);
139
148
  _setMute(res.mute, true);
@@ -238,8 +247,17 @@ export const createUseCtx = _ref => {
238
247
  return false;
239
248
  }
240
249
  return new Promise((resolve, reject) => {
250
+ const clarityMap = {
251
+ [ClarityType.SS]: 'ss',
252
+ [ClarityType.SD]: 'normal',
253
+ [ClarityType.HD]: 'hd',
254
+ [ClarityType.UD]: 'ud',
255
+ [ClarityType.SSP]: 'ssp',
256
+ [ClarityType.AUTO]: 'auto',
257
+ [ClarityType.AUDIO]: 'audio'
258
+ };
241
259
  IPCPlayerInstance.current.setClarity({
242
- clarity: target === ClarityType.HD ? 'hd' : 'normal',
260
+ clarity: clarityMap[target] || 'normal',
243
261
  success: () => {
244
262
  setResolutionMemoryState(devId, target);
245
263
  updateAtom(resolution, target);
@@ -52,15 +52,6 @@ export async function initPlayerWidgets(ctx, options) {
52
52
  newDefaultBottomLeftContent[magnificationIndex].hidden = false;
53
53
  }
54
54
  }
55
- // 自动清晰度入口:这里只放开占位,真正是否渲染由 widget 内部按
56
- // 「宿主有 ttt 方法 clarityChanged」+「设备支持的清晰度档位 ≥ 2」决定
57
- {
58
- const autoClarityIndex = newDefaultBottomLeftContent.findIndex(item => item.id === 'AutoClarity');
59
- console.log('res===autoClarityIndex', autoClarityIndex);
60
- if (autoClarityIndex !== -1) {
61
- newDefaultBottomLeftContent[autoClarityIndex].hidden = false;
62
- }
63
- }
64
55
  // 焦距转盘入口:这里只放开占位,真正是否渲染由 widget 内部按
65
56
  // 「宿主有 ty.ipc.switchChannel」+「ipc_multi_zoom 解析出 cnt > 1」决定
66
57
  // (单镜头设备、不支持切镜头的老宿主都不出现)
@@ -3,7 +3,7 @@ declare const Strings: kit.I18N<{
3
3
  en: {
4
4
  ipc_player_resolution_HD: string;
5
5
  ipc_player_resolution_SD: string;
6
- ipc_player_resolution_auto: string;
6
+ ipc_player_resolution_AUTO: string;
7
7
  ipc_player_current_resolution_is_equal: string;
8
8
  ipc_player_screenshot_success_tip: string;
9
9
  ipc_player_screenshot_multi_success_tip: string;
@@ -44,7 +44,7 @@ declare const Strings: kit.I18N<{
44
44
  zh: {
45
45
  ipc_player_resolution_HD: string;
46
46
  ipc_player_resolution_SD: string;
47
- ipc_player_resolution_auto: string;
47
+ ipc_player_resolution_AUTO: string;
48
48
  ipc_player_current_resolution_is_equal: string;
49
49
  ipc_player_screenshot_success_tip: string;
50
50
  ipc_player_screenshot_multi_success_tip: string;
@@ -85,7 +85,7 @@ declare const Strings: kit.I18N<{
85
85
  }, {
86
86
  ipc_player_resolution_HD: string;
87
87
  ipc_player_resolution_SD: string;
88
- ipc_player_resolution_auto: string;
88
+ ipc_player_resolution_AUTO: string;
89
89
  ipc_player_current_resolution_is_equal: string;
90
90
  ipc_player_screenshot_success_tip: string;
91
91
  ipc_player_screenshot_multi_success_tip: string;
@@ -125,7 +125,7 @@ declare const Strings: kit.I18N<{
125
125
  } | {
126
126
  ipc_player_resolution_HD: string;
127
127
  ipc_player_resolution_SD: string;
128
- ipc_player_resolution_auto: string;
128
+ ipc_player_resolution_AUTO: string;
129
129
  ipc_player_current_resolution_is_equal: string;
130
130
  ipc_player_screenshot_success_tip: string;
131
131
  ipc_player_screenshot_multi_success_tip: string;
@@ -2,7 +2,7 @@ declare const _default: {
2
2
  en: {
3
3
  ipc_player_resolution_HD: string;
4
4
  ipc_player_resolution_SD: string;
5
- ipc_player_resolution_auto: string;
5
+ ipc_player_resolution_AUTO: string;
6
6
  ipc_player_current_resolution_is_equal: string;
7
7
  ipc_player_screenshot_success_tip: string;
8
8
  ipc_player_screenshot_multi_success_tip: string;
@@ -43,7 +43,7 @@ declare const _default: {
43
43
  zh: {
44
44
  ipc_player_resolution_HD: string;
45
45
  ipc_player_resolution_SD: string;
46
- ipc_player_resolution_auto: string;
46
+ ipc_player_resolution_AUTO: string;
47
47
  ipc_player_current_resolution_is_equal: string;
48
48
  ipc_player_screenshot_success_tip: string;
49
49
  ipc_player_screenshot_multi_success_tip: string;
@@ -2,7 +2,7 @@ export default {
2
2
  en: {
3
3
  ipc_player_resolution_HD: 'HD',
4
4
  ipc_player_resolution_SD: 'SD',
5
- ipc_player_resolution_auto: 'Auto',
5
+ ipc_player_resolution_AUTO: 'Auto',
6
6
  ipc_player_current_resolution_is_equal: 'Already at current clarity',
7
7
  ipc_player_screenshot_success_tip: 'Screenshot saved to album',
8
8
  ipc_player_screenshot_multi_success_tip: 'Screenshots saved to album',
@@ -43,7 +43,7 @@ export default {
43
43
  zh: {
44
44
  ipc_player_resolution_HD: '高清',
45
45
  ipc_player_resolution_SD: '标清',
46
- ipc_player_resolution_auto: '自动',
46
+ ipc_player_resolution_AUTO: '自动',
47
47
  ipc_player_current_resolution_is_equal: '已是当前清晰度',
48
48
  ipc_player_screenshot_success_tip: '截图已保存在APP相册',
49
49
  ipc_player_screenshot_multi_success_tip: '图片已保存至相册',
@@ -87,7 +87,7 @@ export type UseCtx = (options: {
87
87
  setVerticalMic: (value: boolean) => void;
88
88
  setScreenType: (type: ScreenType) => void;
89
89
  setRecordingDisabled: (type: boolean) => void;
90
- setResolution: (type: string) => void;
90
+ setResolution: (type: string) => Promise<boolean>;
91
91
  setResolutionList: (type: string[]) => void;
92
92
  setRecording: (value: boolean, onlyUpdateAtom?: boolean) => Promise<CaptureResult>;
93
93
  stopRecordingOnUnload: () => Promise<CaptureResult>;
@@ -33,7 +33,6 @@ export declare const widgetLabs: {
33
33
  readonly SCREENSHOT: "Screenshot";
34
34
  readonly RECORD_VIDEO: "RecordVideo";
35
35
  readonly RESOLUTION: "Resolution";
36
- readonly AUTO_CLARITY: "AutoClarity";
37
36
  readonly TRY_EXPERIENCE: "TryExperience";
38
37
  readonly FULL_RESOLUTION_CONTROL: "FullResolutionControl";
39
38
  readonly MUTED: "Muted";
@@ -62,8 +61,8 @@ export declare const widgetLabs: {
62
61
  export declare const bottomLeftContentResize = "bottomLeftContentResize";
63
62
  export declare const zoomLevelChange = "zoomLevelChange";
64
63
  /**
65
- * 自动清晰度状态变化事件:AutoClarity 控件开启/关闭自动模式或收到 clarityChanged
66
- * 回调结果时触发,携带 { enabled, clarity }(clarity 为 'HD' | 'SD' | null)。
64
+ * 自动清晰度状态变化事件:Resolution 控件检测到清晰度进入/退出自动模式或收到
65
+ * clarityChanged 回调结果时触发,携带 { enabled, clarity }(clarity 为 'HD' | 'SD' | null)。
67
66
  * VideoBitKBP 监听此事件,在码率前展示当前高清/标清文案。
68
67
  */
69
68
  export declare const autoClarityChange = "autoClarityChange";
@@ -35,7 +35,6 @@ export const widgetLabs = {
35
35
  SCREENSHOT: 'Screenshot',
36
36
  RECORD_VIDEO: 'RecordVideo',
37
37
  RESOLUTION: 'Resolution',
38
- AUTO_CLARITY: 'AutoClarity',
39
38
  TRY_EXPERIENCE: 'TryExperience',
40
39
  FULL_RESOLUTION_CONTROL: 'FullResolutionControl',
41
40
  MUTED: 'Muted',
@@ -66,8 +65,8 @@ export const bottomLeftContentResize = 'bottomLeftContentResize';
66
65
  export const zoomLevelChange = 'zoomLevelChange';
67
66
 
68
67
  /**
69
- * 自动清晰度状态变化事件:AutoClarity 控件开启/关闭自动模式或收到 clarityChanged
70
- * 回调结果时触发,携带 { enabled, clarity }(clarity 为 'HD' | 'SD' | null)。
68
+ * 自动清晰度状态变化事件:Resolution 控件检测到清晰度进入/退出自动模式或收到
69
+ * clarityChanged 回调结果时触发,携带 { enabled, clarity }(clarity 为 'HD' | 'SD' | null)。
71
70
  * VideoBitKBP 监听此事件,在码率前展示当前高清/标清文案。
72
71
  */
73
72
  export const autoClarityChange = 'autoClarityChange';
package/lib/ui/ui.js CHANGED
@@ -23,7 +23,7 @@ import { useMemoizedFn } from '../hooks';
23
23
  import { Storage } from '../utils/storage';
24
24
  import './ui.less';
25
25
  import { updatePlayerWidgetProps } from '../features';
26
- import { getNgRawData, getSmartImageQualityState, isLowPhone, isOfflineForStream } from '../utils/ttt';
26
+ import { getNgRawData, getSmartImageQualityState, isLowPhone, notifyOfflineShown } from '../utils/ttt';
27
27
  import { getCaptureResultSummary } from '../utils/captureResult';
28
28
  import { lensCount } from '../widgets/zoomTurntable/lensSkill';
29
29
  import { shouldRenderContent } from './absoluteContent';
@@ -153,10 +153,10 @@ export const IPCPlayerIntegration = /*#__PURE__*/React.memo(props => {
153
153
  });
154
154
  }, []);
155
155
 
156
- // 设备离线时通知宿主视频流状态;isOfflineForStream 内部兼容没有该 TTT 方法的宿主。
156
+ // 监听设备在线状态,离线提示展示时通知宿主;notifyOfflineShown 内部兼容没有该 TTT 方法的宿主。
157
157
  useEffect(() => {
158
158
  if (!deviceOnline) {
159
- isOfflineForStream(devId);
159
+ notifyOfflineShown(devId);
160
160
  }
161
161
  }, [deviceOnline, devId]);
162
162
 
@@ -39,12 +39,12 @@ export declare function setAIFrameFeature(params: SetAIFrameFeatureParams): Prom
39
39
  export declare function setTrailFinish(devId: string): Promise<unknown>;
40
40
  export declare function isLowPhone(): Promise<boolean>;
41
41
  /**
42
- * 通知宿主当前视频流对应的设备已离线。
42
+ * 通知宿主离线提示已经展示。
43
43
  *
44
44
  * 这个 TTT 方法不是所有宿主都提供,因此调用前必须做能力判断;
45
45
  * 老宿主或 Web 环境下直接跳过,不能影响播放器自身的离线处理。
46
46
  */
47
- export declare function isOfflineForStream(devId: string): boolean;
47
+ export declare function notifyOfflineShown(deviceId: string): boolean;
48
48
  export declare function getNgRawData(): Promise<unknown>;
49
49
  export declare function isClarityChangedSupported(): boolean;
50
50
  export type ClarityChangedResult = {
package/lib/utils/ttt.js CHANGED
@@ -122,24 +122,22 @@ export function isLowPhone() {
122
122
  }
123
123
 
124
124
  /**
125
- * 通知宿主当前视频流对应的设备已离线。
125
+ * 通知宿主离线提示已经展示。
126
126
  *
127
127
  * 这个 TTT 方法不是所有宿主都提供,因此调用前必须做能力判断;
128
128
  * 老宿主或 Web 环境下直接跳过,不能影响播放器自身的离线处理。
129
129
  */
130
- export function isOfflineForStream(devId) {
130
+ export function notifyOfflineShown(deviceId) {
131
131
  var _ty3;
132
- const method = (_ty3 = ty) === null || _ty3 === void 0 || (_ty3 = _ty3.ipc) === null || _ty3 === void 0 ? void 0 : _ty3.isOfflineForStream;
132
+ const method = typeof ty !== 'undefined' ? (_ty3 = ty) === null || _ty3 === void 0 || (_ty3 = _ty3.ipc) === null || _ty3 === void 0 ? void 0 : _ty3.notifyOfflineShown : undefined;
133
133
  if (typeof method !== 'function') {
134
134
  return false;
135
135
  }
136
136
  try {
137
- method({
138
- devId
139
- });
137
+ console.warn('res===notifyOfflineShown');
138
+ method(deviceId, 'preview_mini');
140
139
  return true;
141
140
  } catch (error) {
142
- console.warn('res===isOfflineForStream fail', error);
143
141
  return false;
144
142
  }
145
143
  }
@@ -1,2 +1 @@
1
1
  export * from './resolution';
2
- export * from './autoClarity';
@@ -1,2 +1 @@
1
- export * from './resolution';
2
- export * from './autoClarity';
1
+ export * from './resolution';
@@ -1,17 +1,19 @@
1
1
  import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
2
2
  import { View, Text } from '@ray-js/ray';
3
3
  import clsx from 'clsx';
4
- import React, { useContext } from 'react';
4
+ import React, { useContext, useEffect } from 'react';
5
5
  import { useMemoizedFn } from 'ahooks';
6
+ import { ClarityType } from '@ray-js/ray-ipc-utils/lib/interface';
6
7
  import Strings from '../../i18n';
7
8
  import { FullResolutionControl } from './fullResolutionControl';
8
- import { fullResolutionId, pauseTimeToHideAllComponent, hideAllComponent, widgetLabs, widgetClick } from '../../ui/constant';
9
+ import { fullResolutionId, pauseTimeToHideAllComponent, hideAllComponent, widgetLabs, widgetClick, autoClarityChange } from '../../ui/constant';
9
10
  import { UIEventContext } from '../../ui/context';
10
11
  import { useStore } from '../../ctx/store';
12
+ import { clarityChanged } from '../../utils/ttt';
11
13
  import './resolution.less';
12
14
  export const Resolution = props => {
13
15
  const {
14
- IPCPlayerContext,
16
+ devId,
15
17
  setResolution,
16
18
  addContent,
17
19
  hasContent,
@@ -29,6 +31,30 @@ export const Resolution = props => {
29
31
  const {
30
32
  event
31
33
  } = useContext(UIEventContext);
34
+
35
+ // 广播自动清晰度状态给 VideoBitKBP 等监听方;
36
+ // 自动模式下读取一次当前实际清晰度,仅用于码率区域展示。
37
+ useEffect(() => {
38
+ const emitClarity = (enabled, clarity) => {
39
+ event.emit(autoClarityChange, {
40
+ enabled,
41
+ clarity
42
+ });
43
+ };
44
+ if (resolution !== ClarityType.AUTO) {
45
+ emitClarity(false, null);
46
+ return;
47
+ }
48
+ emitClarity(true, null);
49
+ if (devId) {
50
+ clarityChanged(devId).then(res => {
51
+ if (res !== null && res !== void 0 && res.clarity) {
52
+ emitClarity(true, res.clarity);
53
+ }
54
+ });
55
+ }
56
+ // eslint-disable-next-line react-hooks/exhaustive-deps
57
+ }, [devId, resolution]);
32
58
  const onResolution = useMemoizedFn(() => {
33
59
  event.emit(widgetClick, {
34
60
  widgetId: widgetLabs.RESOLUTION
@@ -21,10 +21,6 @@
21
21
  border-radius: calc(5px * var(--ipc-player-size-scale, 1));
22
22
  }
23
23
 
24
- .ipc-player-plugin-resolution-active {
25
- background-color: var(--brandColor, rgba(255, 89, 42, 0.9));
26
- }
27
-
28
24
  .ipc-player-plugin-full-resolution-control {
29
25
  height: 100%;
30
26
  width: 200px;
@@ -2,14 +2,13 @@ import React, { useContext, useEffect, useRef, useState } from 'react';
2
2
  import { View, Text, usePageEvent } from '@ray-js/ray';
3
3
  import clsx from 'clsx';
4
4
  import { getVideoBitrateKbps, requestWifiSignal } from '@ray-js/ray-ipc-utils';
5
+ import { ClarityType } from '@ray-js/ray-ipc-utils/lib/interface';
5
6
  import { PlayState } from '../../interface';
6
7
  import './videoBitKBP.less';
7
8
  import { useStore } from '../../ctx/store';
8
9
  import Strings from '../../i18n';
9
10
  import { UIEventContext } from '../../ui/context';
10
11
  import { autoClarityChange } from '../../ui/constant';
11
- import { storage } from '../../utils/storage';
12
- import { AUTO_CLARITY_STORAGE_KEY } from '../resolution/autoClarity';
13
12
  export const VideoBitKBP = props => {
14
13
  const {
15
14
  devId,
@@ -20,21 +19,18 @@ export const VideoBitKBP = props => {
20
19
  } = props;
21
20
  const [bitKBP, setBitKBP] = useState('');
22
21
  const [signalStrength, setSignalStrength] = useState(null);
23
- // 自动清晰度当前档位:null 表示未开启自动模式,不展示
24
- const [autoClarity, setAutoClarity] = useState(() => {
25
- var _cached$clarity;
26
- const cached = storage.getSync(AUTO_CLARITY_STORAGE_KEY);
27
- return cached !== null && cached !== void 0 && cached.enabled ? (_cached$clarity = cached.clarity) !== null && _cached$clarity !== void 0 ? _cached$clarity : null : null;
28
- });
22
+ // 自动清晰度当前实际档位:null 表示未开启自动模式,不展示
23
+ const [autoClarity, setAutoClarity] = useState(null);
29
24
  const store = useStore({
30
- playState
25
+ playState,
26
+ resolution: props.resolution
31
27
  });
32
28
  const {
33
29
  event
34
30
  } = useContext(UIEventContext);
35
31
  const timerRef = useRef();
36
32
 
37
- // 监听 AutoClarity 控件广播的自动清晰度状态
33
+ // 监听 Resolution 控件广播的自动清晰度状态
38
34
  useEffect(() => {
39
35
  const onAutoClarityChange = payload => {
40
36
  setAutoClarity(payload.enabled ? payload.clarity : null);
@@ -44,6 +40,11 @@ export const VideoBitKBP = props => {
44
40
  event.off(autoClarityChange, onAutoClarityChange);
45
41
  };
46
42
  }, [event]);
43
+ useEffect(() => {
44
+ if (store.resolution !== ClarityType.AUTO) {
45
+ setAutoClarity(null);
46
+ }
47
+ }, [store.resolution]);
47
48
  useEffect(() => {
48
49
  if (store.playState === PlayState.PLAYING && (!hideKbsMenu || !hideSignalMenu)) {
49
50
  init();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ray-js/ipc-player-integration",
3
- "version": "0.0.53-beta.0",
3
+ "version": "0.0.53-beta.1",
4
4
  "description": "IPC 融合播放器",
5
5
  "main": "lib/index",
6
6
  "files": [
@@ -1,13 +0,0 @@
1
- import React from 'react';
2
- import { ComponentConfigProps } from '../../interface';
3
- import './resolution.less';
4
- type Props = ComponentConfigProps & {
5
- className?: string;
6
- };
7
- export declare const AUTO_CLARITY_STORAGE_KEY = "autoClarity";
8
- export type AutoClarityMemory = {
9
- enabled: boolean;
10
- clarity: 'HD' | 'SD' | null;
11
- };
12
- export declare const AutoClarity: (props: Props) => React.JSX.Element;
13
- export {};
@@ -1,110 +0,0 @@
1
- import React, { useContext, useEffect, useState } from 'react';
2
- import { View, Text } from '@ray-js/ray';
3
- import clsx from 'clsx';
4
- import Strings from '../../i18n';
5
- import { useStore } from '../../ctx/store';
6
- import { storage } from '../../utils/storage';
7
- import { UIEventContext } from '../../ui/context';
8
- import { widgetClick, widgetLabs, autoClarityChange } from '../../ui/constant';
9
- import { clarityChanged } from '../../utils/ttt';
10
- import './resolution.less';
11
- // 自动清晰度记忆 storage key(按设备维度隔离由 storage 内部 prefix 处理)
12
- export const AUTO_CLARITY_STORAGE_KEY = 'autoClarity';
13
- export const AutoClarity = props => {
14
- const {
15
- className,
16
- devId
17
- } = props;
18
- const {
19
- screenType,
20
- resolutionList
21
- } = useStore({
22
- screenType: props.screenType,
23
- resolutionList: props.resolutionList
24
- });
25
- const {
26
- event
27
- } = useContext(UIEventContext);
28
-
29
- // 是否处于自动模式
30
- const [auto, setAuto] = useState(false);
31
-
32
- // 广播自动清晰度状态给 VideoBitKBP 等监听方
33
- const emitClarity = (enabled, clarity) => {
34
- event.emit(autoClarityChange, {
35
- enabled,
36
- clarity
37
- });
38
- };
39
-
40
- // 进入时恢复上次退出时的选择
41
- useEffect(() => {
42
- const cached = storage.getSync(AUTO_CLARITY_STORAGE_KEY);
43
- if (cached !== null && cached !== void 0 && cached.enabled) {
44
- var _cached$clarity;
45
- setAuto(true);
46
- emitClarity(true, (_cached$clarity = cached.clarity) !== null && _cached$clarity !== void 0 ? _cached$clarity : null);
47
- // 恢复自动模式后重新拉取一次当前清晰度
48
- clarityChanged(devId).then(res => {
49
- if (res !== null && res !== void 0 && res.clarity) {
50
- emitClarity(true, res.clarity);
51
- storage.set(AUTO_CLARITY_STORAGE_KEY, {
52
- enabled: true,
53
- clarity: res.clarity
54
- });
55
- }
56
- });
57
- } else {
58
- emitClarity(false, null);
59
- }
60
- // eslint-disable-next-line react-hooks/exhaustive-deps
61
- }, [devId]);
62
-
63
- // TODO: 后面取消注释 宿主不存在 ttt 方法 clarityChanged 时整个入口不渲染
64
- // if (!isClarityChangedSupported()) {
65
- // return null;
66
- // }
67
-
68
- // TODO: 后面取消注释 设备支持的清晰度档位数量 ≥ 2 时才展示自动
69
- // if (!resolutionList || resolutionList.length < 2) {
70
- // return null;
71
- // }
72
-
73
- return /*#__PURE__*/React.createElement(View, {
74
- onClick: async () => {
75
- var _res$clarity;
76
- event.emit(widgetClick, {
77
- widgetId: widgetLabs.AUTO_CLARITY
78
- });
79
-
80
- // 关闭自动模式
81
- if (auto) {
82
- setAuto(false);
83
- emitClarity(false, null);
84
- storage.set(AUTO_CLARITY_STORAGE_KEY, {
85
- enabled: false,
86
- clarity: null
87
- });
88
- return;
89
- }
90
-
91
- // 开启自动模式并读取回调结果
92
- setAuto(true);
93
- const res = await clarityChanged(devId);
94
- const next = (_res$clarity = res === null || res === void 0 ? void 0 : res.clarity) !== null && _res$clarity !== void 0 ? _res$clarity : null;
95
- emitClarity(true, next);
96
- storage.set(AUTO_CLARITY_STORAGE_KEY, {
97
- enabled: true,
98
- clarity: next
99
- });
100
- },
101
- className: clsx(className)
102
- }, /*#__PURE__*/React.createElement(View, {
103
- className: clsx('ipc-player-plugin-resolution', {
104
- 'ipc-player-plugin-resolution-full': screenType === 'full',
105
- 'ipc-player-plugin-resolution-active': auto
106
- })
107
- }, /*#__PURE__*/React.createElement(Text, {
108
- className: "resolutionText"
109
- }, Strings.getLang('ipc_player_resolution_auto'))));
110
- };