@ezuikit/multi-screen 0.1.0-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.
Files changed (10) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +155 -0
  3. package/dist/constant.js +40 -0
  4. package/dist/index.js +2535 -0
  5. package/dist/index.mjs +2518 -0
  6. package/dist/index.umd.js +4016 -0
  7. package/dist/style.css +4 -0
  8. package/dist/style.js +6 -0
  9. package/dist/types/index.d.ts +1090 -0
  10. package/package.json +46 -0
package/dist/index.js ADDED
@@ -0,0 +1,2535 @@
1
+ /*
2
+ * MultiScreen v0.1.0-beta.1
3
+ * Copyright (c) 2026-03-03 Ezviz-OpenBiz
4
+ * Released under the MIT License.
5
+ */
6
+ 'use strict';
7
+
8
+ Object.defineProperty(exports, '__esModule', { value: true });
9
+
10
+ var EventEmitter = require('eventemitter3');
11
+ var deepmerge = require('deepmerge');
12
+ var I18n = require('@ezuikit/utils-i18n');
13
+ var delegate = require('@skax/delegate');
14
+ var camel = require('@skax/camel');
15
+ var screenfull = require('screenfull');
16
+ var Picker = require('@skax/picker');
17
+
18
+ /**
19
+ * 布局配置
20
+ * @public
21
+ */ /**
22
+ * 根据分屏模式获取布局配置
23
+ * @param mode - 分屏数量
24
+ * @returns 布局配置（行数和列数）
25
+ * @example
26
+ * ```typescript
27
+ * const config = getLayoutConfig(4);
28
+ * // 返回 { rows: 2, cols: 2 }
29
+ * ```
30
+ * @public
31
+ */ function getLayoutConfig(mode) {
32
+ var configs = {
33
+ 1: {
34
+ rows: 1,
35
+ cols: 1
36
+ },
37
+ 2: {
38
+ rows: 1,
39
+ cols: 2
40
+ },
41
+ 4: {
42
+ rows: 2,
43
+ cols: 2
44
+ },
45
+ 6: {
46
+ rows: 2,
47
+ cols: 3
48
+ },
49
+ 9: {
50
+ rows: 3,
51
+ cols: 3
52
+ },
53
+ 16: {
54
+ rows: 4,
55
+ cols: 4
56
+ },
57
+ 25: {
58
+ rows: 5,
59
+ cols: 5
60
+ },
61
+ 36: {
62
+ rows: 6,
63
+ cols: 6
64
+ },
65
+ 64: {
66
+ rows: 8,
67
+ cols: 8
68
+ }
69
+ };
70
+ return configs[mode] || {
71
+ rows: 2,
72
+ cols: 2
73
+ };
74
+ }
75
+
76
+ var translations = {
77
+ 'zh': {
78
+ clickToSelect: '请选择屏幕',
79
+ mode1: '1分屏',
80
+ mode2: '2分屏',
81
+ mode4: '4分屏',
82
+ mode6: '6分屏',
83
+ mode9: '9分屏',
84
+ mode16: '16分屏',
85
+ mode25: '25分屏',
86
+ mode36: '36分屏',
87
+ mode64: '64分屏',
88
+ playAll: '全部播放',
89
+ pauseAll: '全部暂停',
90
+ webFullscreen: '网页全屏',
91
+ exitWebFullscreen: '退出网页全屏',
92
+ globalFullscreen: '全局全屏',
93
+ exitGlobalFullscreen: '退出全局全屏',
94
+ settings: '设置',
95
+ scaleMode: '画面填充',
96
+ /** 不保证保持原有的比例，内容拉伸填充整个内容容器 */ scaleModeFill: '填充',
97
+ /** 保持原有尺寸比例。内容被缩放 */ scaleModeContain: '全部包含',
98
+ /** 保持原有尺寸比例。但部分内容可能被剪切 */ scaleModeCover: '覆盖',
99
+ audioSettings: '声音设置',
100
+ audioMutedAll: '所有画面静音',
101
+ audioSelected: '仅播放选中画面的声音',
102
+ audioAll: '播放所有画面的声音',
103
+ audioNone: '静音',
104
+ enableHardwareDecoding: '浏览器硬解开关',
105
+ enableHardwareDecodingDesc: '切换软硬解模式将初始化视频画面',
106
+ screensNote: "备注：超过9分屏后，浏览器性能不足，可能会导致黑屏无法播放，请谨慎开启。"
107
+ },
108
+ 'en': {
109
+ clickToSelect: 'Click to select',
110
+ mode1: '1 Screen',
111
+ mode2: '2 Screens',
112
+ mode4: '4 Screens',
113
+ mode6: '6 Screens',
114
+ mode9: '9 Screens',
115
+ mode16: '16 Screens',
116
+ mode25: '25 Screens',
117
+ mode36: '36 Screens',
118
+ mode64: '64 Screens',
119
+ playAll: 'Play All',
120
+ pauseAll: 'Pause All',
121
+ webFullscreen: 'Web Fullscreen',
122
+ exitWebFullscreen: 'Exit Web Fullscreen',
123
+ globalFullscreen: 'Global Fullscreen',
124
+ exitGlobalFullscreen: 'Exit Global Fullscreen',
125
+ settings: 'Settings',
126
+ scaleMode: 'Scale Mode',
127
+ scaleModeFill: 'fill',
128
+ scaleModeContain: 'contain',
129
+ scaleModeCover: 'cover',
130
+ audioSettings: 'Audio Settings',
131
+ audioMutedAll: 'Mute all screens',
132
+ audioSelected: 'Play selected screen audio only',
133
+ audioAll: 'Play all screens audio',
134
+ audioNone: 'Mute',
135
+ enableHardwareDecoding: 'Hardware Decoding',
136
+ enableHardwareDecodingDesc: 'Switching mode will reinitialize video',
137
+ screensNote: "Note: When exceeding 9 split screens, browser performance may be insufficient, potentially causing black screen or playback failure. Please proceed with caution."
138
+ }
139
+ };
140
+
141
+ var _EZ_SL_CLASS_PREFIX_ = 'ez-sl';
142
+ var __EZ_SL_OPTIONS__ = {
143
+ // 默认语言
144
+ language: 'zh',
145
+ // 默认主题
146
+ theme: 'dark',
147
+ // 默认分屏模式
148
+ mode: 4,
149
+ // 默认分屏数据
150
+ screens: [],
151
+ scaleMode: 1,
152
+ // 默认分屏配置
153
+ customLayout: null,
154
+ showToolbar: true,
155
+ enableHardwareDecoding: true,
156
+ // 默认分屏点击事件回调
157
+ onScreenClick: function() {},
158
+ // 默认分屏模式切换事件回调
159
+ onModeChange: function() {},
160
+ // 默认全屏状态变化事件回调
161
+ onFullscreenChange: function() {}
162
+ };
163
+ var EVENTS = {};
164
+
165
+ /**
166
+ * 重新调整播放器窗口大小, 支持数字和字符串两种类型
167
+ *
168
+ * Adjust the player window size
169
+ * @param {number | string} width 宽度（number 类型默认px, 支持字符串大小 "100%" | "50vw"）
170
+ * @param {number | string} height 高度（number 类型默认px, 支持字符串大小 "100%" | "50vh"）
171
+ * @since 0.0.1
172
+ * @example
173
+ * ```ts
174
+ * theme.resize(600, 400) // 600px * 400px
175
+ * theme.resize("600px", "400px") // 600px * 400px
176
+ * theme.resize("50%", "1vh")
177
+ * theme.resize("2em", "2rem")
178
+ * // 事件监听 event, 这里是具体的宽高（单位px）
179
+ * theme.on(Theme.EVENTS.resize, (width: number, height: number) => {})
180
+ * ```
181
+ * @returns {void}
182
+ */ function _resize(layout, width, height) {
183
+ var cssText = '';
184
+ if (/^\d+(\.\d+)?$/.test(width + '')) {
185
+ cssText += "width: " + width + "px;";
186
+ } else if (width) {
187
+ cssText += "width: " + width + ";";
188
+ }
189
+ if (/^\d+(\.\d+)?$/.test(height + '')) {
190
+ cssText += "height: " + height + "px;";
191
+ } else if (height) {
192
+ cssText += "height: " + height + ";";
193
+ }
194
+ if (layout.$container) layout.$container.style.cssText += cssText;
195
+ }
196
+
197
+ var __SVG__ = {
198
+ /** 播放 */ play: '<svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" focusable="false" aria-hidden="true" data-icon="play">\n <rect x="6.5" y="5.5" rx="1.25" width="2.5" height="13"/>\n <rect x="15" y="5.5" rx="1.25" width="2.5" height="13"/>\n </svg>',
199
+ /** 暂停 */ pause: '<svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" focusable="false" aria-hidden="true" data-icon="pause"> <path d="M17.5 13.66L9.1 19.26C7.78 20.14 6 19.19 6 17.59L6 6.4C6 4.8 7.78 3.85 9.1 4.73L17.5 10.33C18.69 11.12 18.69 12.87 17.5 13.66Z" /></svg>',
200
+ /** 音量 */ muted: '<svg width="1em" height="1em" viewBox="0 0 24 24" stroke="currentColor" fill="none" focusable="false" aria-hidden="true" data-icon="volume">\n <path d="M20.57 9.69L16.07 14.19" stroke-width="1.500000" stroke-linejoin="round" stroke-linecap="round"/>\n <path d="M20.57 14.19L16.07 9.69" stroke-width="1.500000" stroke-linejoin="round" stroke-linecap="round"/>\n <path d="M5.87 8.62L9.85 5.25C10.5 4.7 11.49 5.16 11.49 6.01L11.49 17.98C11.49 18.83 10.5 19.29 9.85 18.74L5.87 15.37" stroke-width="1.500000" stroke-linejoin="round" stroke-linecap="round"/>\n <path d="M5.87 15.37L3.49 15.37C2.94 15.37 2.49 14.92 2.49 14.37L2.49 9.62C2.49 9.07 2.94 8.62 3.49 8.62L5.87 8.62" stroke-width="1.500000" stroke-linejoin="round" stroke-linecap="round"/>\n </svg>',
201
+ /** 相机 */ screenshot: '<svg viewBox="0 0 1024 1024" stroke="currentColor" fill="currentColor" focusable="false" aria-hidden="true" data-icon="screenshot" width="1em" height="1em">\n <path d="M269.44 256l23.296-75.381333A74.666667 74.666667 0 0 1 364.074667 128h295.850666a74.666667 74.666667 0 0 1 71.338667 52.618667L754.56 256H821.333333c64.8 0 117.333333 52.533333 117.333334 117.333333v426.666667c0 64.8-52.533333 117.333333-117.333334 117.333333H202.666667c-64.8 0-117.333333-52.533333-117.333334-117.333333V373.333333c0-64.8 52.533333-117.333333 117.333334-117.333333h66.773333z m23.605333 64H202.666667a53.333333 53.333333 0 0 0-53.333334 53.333333v426.666667a53.333333 53.333333 0 0 0 53.333334 53.333333h618.666666a53.333333 53.333333 0 0 0 53.333334-53.333333V373.333333a53.333333 53.333333 0 0 0-53.333334-53.333333h-90.378666a32 32 0 0 1-30.570667-22.549333l-30.272-97.930667a10.666667 10.666667 0 0 0-10.186667-7.52H364.074667a10.666667 10.666667 0 0 0-10.186667 7.52l-30.272 97.92A32 32 0 0 1 293.045333 320zM512 725.333333c-88.362667 0-160-71.637333-160-160 0-88.362667 71.637333-160 160-160 88.362667 0 160 71.637333 160 160 0 88.362667-71.637333 160-160 160z m0-64a96 96 0 1 0 0-192 96 96 0 0 0 0 192z"></path>\n </svg>',
202
+ /** 录像机 */ record: '<svg viewBox="0 0 1024 1024" stroke="currentColor" fill="none" focusable="false" aria-hidden="true" data-icon="record" width="1em" height="1em">\n <path d="M800 349.4V256c0-35.3-28.7-64-64-64H64c-35.3 0-64 28.7-64 64v512c0 35.3 28.7 64 64 64h672c35.3 0 64-28.7 64-64v-93.4c0-2.9 3-4.8 5.6-3.7L934 728c42.3 18.8 90-12.2 90-58.5v-315c0-46.3-47.7-77.3-90-58.5l-128.4 57.1c-2.6 1.1-5.6-0.8-5.6-3.7zM720 768H80c-8.8 0-16-7.2-16-16V272c0-8.8 7.2-16 16-16h640c8.8 0 16 7.2 16 16v480c0 8.8-7.2 16-16 16z m217.5-108.5l-128-56.9c-5.8-2.6-9.5-8.3-9.5-14.6V436c0-6.3 3.7-12.1 9.5-14.6l128-56.9c10.6-4.7 22.5 3 22.5 14.6v265.8c0 11.6-11.9 19.3-22.5 14.6z"></path>\n </svg>',
203
+ /** 设置 */ setting: '<svg viewBox="0 0 1024 1024" fill="currentColor" focusable="false" aria-hidden="true" data-icon="setting" width="1em" height="1em">\n <path d="M636.864 96l166.272 97.824-14.4 38.912c-24.928 67.424 8.512 142.656 74.656 168.032 7.872 3.04 16.032 5.28 24.32 6.656l40.288 6.752v195.648l-40.32 6.752c-69.76 11.744-116.96 78.848-105.44 149.92 1.344 8.448 3.52 16.768 6.496 24.768l14.4 38.912L636.864 928l-25.92-32.16a126.4 126.4 0 0 0-180.128-18.144c-6.496 5.44-12.48 11.52-17.792 18.144L387.136 928l-166.272-97.824 14.4-38.912c24.928-67.392-8.512-142.624-74.656-168.032a126.112 126.112 0 0 0-24.32-6.656L96 609.824v-195.648l40.288-6.752c69.76-11.712 116.992-78.816 105.504-149.888a132.384 132.384 0 0 0-6.528-24.8l-14.4-38.912L387.136 96l25.888 32.16a126.4 126.4 0 0 0 180.16 18.144c6.496-5.44 12.48-11.52 17.792-18.144L636.864 96z m14.624 83.904a193.472 193.472 0 0 1-17.728 16.832 189.44 189.44 0 0 1-261.248-16.832L299.488 222.88c2.304 7.872 4.128 15.936 5.44 24.064 16.48 102.016-47.68 198.592-144.928 222.08v85.952c7.872 1.92 15.616 4.32 23.2 7.232 94.944 36.48 144.928 141.376 116.288 238.944l73.024 42.944c5.568-5.984 11.488-11.584 17.728-16.832a189.44 189.44 0 0 1 261.248 16.832l73.024-42.976a198.784 198.784 0 0 1-5.44-24c-16.512-102.08 47.68-198.656 144.928-222.144v-85.952a189.376 189.376 0 0 1-23.168-7.232c-94.976-36.448-144.96-141.344-116.32-238.944l-73.024-42.944zM512 334.848c88.352 0 160 72.992 160 163.04 0 90.048-71.648 163.008-160 163.008s-160-72.96-160-163.008c0-90.048 71.648-163.04 160-163.04z m0 65.216c-53.024 0-96 43.808-96 97.824s42.976 97.824 96 97.824 96-43.808 96-97.824-42.976-97.824-96-97.824z"></path>\n </svg>',
204
+ webFullscreen: '<svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" focusable="false" aria-hidden="true" data-icon="webFullscreen">\n <path d="M18.4009 2.40125L5.59972 2.40125C4.74849 2.39276 3.9297 2.72729 3.32788 3.32935C2.72607 3.9314 2.39188 4.75031 2.40062 5.6015L2.40062 18.4015C2.3922 19.2527 2.7267 20.0715 3.32874 20.6733C3.93079 21.2751 4.74969 21.6093 5.60091 21.6006L18.4009 21.6006C19.2519 21.609 20.0705 21.2747 20.6723 20.6729C21.2741 20.0711 21.6084 19.2525 21.6 18.4015L21.6 5.60034C21.6084 4.74933 21.2741 3.93073 20.6723 3.32892C20.0705 2.72711 19.2519 2.39282 18.4009 2.40125ZM18.401 20.3213C19.4246 20.3213 20.321 19.4249 20.321 18.4014L20.321 5.60022C20.321 4.5766 19.4246 3.68024 18.401 3.68024L5.59987 3.68024C4.57631 3.68024 3.67993 4.5766 3.67993 5.60022L3.67993 18.4014C3.67993 19.4249 4.57631 20.3213 5.59987 20.3213L18.401 20.3213ZM14.5599 5.27087L18.3997 5.27087L18.3997 5.27209C18.7849 5.27087 19.0405 5.52527 19.0405 5.91168L19.0405 9.75153C19.0405 10.1331 18.7849 10.3887 18.401 10.3911C18.0158 10.3887 17.7602 10.1331 17.7602 9.75153L17.7602 7.44763L14.0487 11.1591C13.9313 11.2808 13.7695 11.3494 13.6005 11.3494C13.4315 11.3494 13.2697 11.2808 13.1523 11.1591C13.0292 11.0428 12.9594 10.8809 12.9594 10.7115C12.9594 10.5421 13.0292 10.3802 13.1523 10.2639L16.8638 6.55005L14.5599 6.55005C14.1735 6.54883 13.9179 6.29443 13.9203 5.91046C13.9179 5.52411 14.1735 5.26971 14.5599 5.27087ZM10.594 12.6625L6.88254 16.3751L6.88254 14.0712C6.88254 13.686 6.62695 13.4304 6.24297 13.4304C5.85898 13.4304 5.60338 13.686 5.60219 14.0712L5.60219 17.9111C5.60219 18.2939 5.85898 18.5483 6.24297 18.5507L10.0828 18.5507C10.4668 18.5483 10.7224 18.2939 10.7224 17.9099C10.7224 17.5247 10.4668 17.2691 10.0816 17.2703L7.77771 17.2703L11.4904 13.5588C11.6133 13.4421 11.6829 13.2801 11.6829 13.1107C11.6829 12.9412 11.6133 12.7791 11.4904 12.6625C11.3737 12.5396 11.2117 12.47 11.0422 12.47C10.8727 12.47 10.7107 12.5396 10.594 12.6625Z" clip-rule="evenodd" fill-rule="evenodd"></path>\n </svg>',
205
+ exitWebFullscreen: '<svg width="1em" height="1em" viewBox="0 0 24 24" fill="currentColor" focusable="false" aria-hidden="true" data-icon="exitWebFullscreen">\n <path d="M18.4009 2.40125L5.59978 2.40125C4.74855 2.39276 3.92976 2.72729 3.32794 3.32935C2.72614 3.9314 2.39194 4.75031 2.40068 5.6015L2.40068 18.4015C2.39226 19.2527 2.72676 20.0715 3.3288 20.6733C3.93085 21.2751 4.74976 21.6093 5.60097 21.6006L18.4009 21.6006C19.252 21.609 20.0706 21.2747 20.6723 20.6729C21.2741 20.0711 21.6085 19.2525 21.6 18.4015L21.6 5.60034C21.6085 4.74933 21.2741 3.93073 20.6723 3.32892C20.0706 2.72711 19.252 2.39282 18.4009 2.40125ZM18.4012 20.3212C19.4247 20.3212 20.3211 19.4248 20.3211 18.4012L20.3211 5.6001C20.3211 4.57648 19.4247 3.68011 18.4012 3.68011L5.59999 3.68011C4.57643 3.68011 3.68005 4.57648 3.68005 5.6001L3.68005 18.4012C3.68005 19.4248 4.57643 20.3212 5.59999 20.3212L18.4012 20.3212ZM17.4401 11.3494L13.6002 11.3494L13.6002 11.3483C13.215 11.3494 12.9594 11.095 12.9594 10.7087L12.9594 6.86877C12.9594 6.48718 13.215 6.23163 13.599 6.22925C13.9842 6.23163 14.2398 6.48718 14.2398 6.86877L14.2398 9.17273L17.9512 5.46124C18.0686 5.3396 18.2304 5.27087 18.3994 5.27087C18.5685 5.27087 18.7303 5.3396 18.8476 5.46124C18.9708 5.57751 19.0406 5.73944 19.0406 5.90881C19.0406 6.07825 18.9708 6.24011 18.8476 6.35645L15.1362 10.0703L17.4401 10.0703C17.8265 10.0715 18.082 10.3259 18.0797 10.7099C18.082 11.0963 17.8265 11.3506 17.4401 11.3494ZM6.69115 18.358L10.4026 14.6454L10.4026 16.9493C10.4026 17.3345 10.6582 17.5901 11.0422 17.5901C11.4262 17.5901 11.6818 17.3345 11.683 16.9493L11.683 13.1094C11.683 12.7266 11.4262 12.4722 11.0422 12.4698L7.20233 12.4698C6.81834 12.4722 6.56276 12.7266 6.56276 13.1106C6.56276 13.4958 6.81834 13.7514 7.20354 13.7502L9.50746 13.7502L5.79478 17.4617C5.67188 17.5784 5.60228 17.7404 5.60228 17.9099C5.60228 18.0793 5.67188 18.2413 5.79478 18.358C5.91145 18.481 6.07349 18.5505 6.24297 18.5505C6.41243 18.5505 6.57446 18.481 6.69115 18.358Z" clip-rule="evenodd" fill-rule="evenodd"></path>\n</svg>',
206
+ fullscreen: '<svg width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" focusable="false" aria-hidden="true" data-icon="fullscreen">\n <path d="M8 4L6 4C4.89 4 4 4.89 4 6L4 8" stroke-width="1.5" stroke-linejoin="round" stroke-linecap="round"></path>\n <path d="M4 16L4 18C4 19.1 4.89 20 6 20L8 20" stroke-width="1.5" stroke-linejoin="round" stroke-linecap="round"></path>\n <path d="M16 20L18 20C19.1 20 20 19.1 20 18L20 16" stroke-width="1.5" stroke-linejoin="round" stroke-linecap="round"></path>\n <path d="M20 8L20 6C20 4.89 19.1 4 18 4L16 4" stroke-width="1.5" stroke-linejoin="round" stroke-linecap="round"></path>\n </svg>',
207
+ exitFullscreen: '<svg width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" focusable="false" aria-hidden="true" data-icon="exitFullscreen">\n <path d="M4 8L6 8C7.1 8 8 7.1 8 6L8 4" stroke-width="1.488819" stroke-linejoin="round" stroke-linecap="round"></path>\n <path d="M8 20L8 18C8 16.89 7.1 16 6 16L4 16" stroke-width="1.488819" stroke-linejoin="round" stroke-linecap="round"></path>\n <path d="M20 16L18 16C16.89 16 16 16.89 16 18L16 20" stroke-width="1.488819" stroke-linejoin="round" stroke-linecap="round"></path>\n <path d="M16 4L16 6C16 7.1 16.89 8 18 8L20 8" stroke-width="1.488819" stroke-linejoin="round" stroke-linecap="round"></path>\n </svg>',
208
+ close: '<svg width="1em" height="1em" viewBox="0 0 1024 1024" fill="currentColor" focusable="false" aria-hidden="true" data-icon="close">\n <path d="M563.8 512l262.5-312.9c4.4-5.2 0.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9c-4.4 5.2-0.7 13.1 6.1 13.1h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"></path>\n </svg>\n ',
209
+ screens: '\n <svg viewBox="0 0 100 100" width="1em" height="1em" fill="currentColor" focusable="false" aria-hidden="true" data-icon="screens">\n <rect x="5" y="5" width="40" height="40" rx="2"></rect>\n <rect x="55" y="5" width="40" height="40" rx="2"></rect>\n <rect x="5" y="55" width="40" height="40" rx="2"></rect>\n <rect x="55" y="55" width="40" height="40" rx="2"></rect>\n </svg>\n '
210
+ };
211
+ /**
212
+ * 创建 icon 组件
213
+ * @param svg - svg 字符串
214
+ * @param type - icon 类型
215
+ * @returns icon 组件
216
+ * @example
217
+ * ```ts
218
+ * createIcon('<svg>....</svg>', 'logo') // <span class="ezplayer-icon ezplayer-icon-logo"><svg>....</svg></span>
219
+ * ```
220
+ */ function createIcon(svg, type, attr) {
221
+ if (attr === void 0) attr = {};
222
+ var attrStr = '';
223
+ if (attr) {
224
+ Object.keys(attr).forEach(function(key) {
225
+ if (!(attr[key] === undefined || attr[key] === null)) attrStr += key + '="' + attr[key] + '"';
226
+ });
227
+ }
228
+ return '<span class="ez-sl-icon ez-sl-icon-' + type + '" ' + attrStr + ">" + svg + "</span>";
229
+ }
230
+ var ICONS = {
231
+ /** 播放 */ play: function(attr) {
232
+ if (attr === void 0) attr = {};
233
+ return createIcon(__SVG__.play, 'play', attr);
234
+ },
235
+ /** 暂停 */ pause: function(attr) {
236
+ if (attr === void 0) attr = {};
237
+ return createIcon(__SVG__.pause, 'pause', attr);
238
+ },
239
+ /** 静音 */ muted: function(attr) {
240
+ if (attr === void 0) attr = {};
241
+ return createIcon(__SVG__.muted, 'muted', attr);
242
+ },
243
+ /** 截图 */ screenshot: function(attr) {
244
+ if (attr === void 0) attr = {};
245
+ return createIcon(__SVG__.screenshot, 'screenshot', attr);
246
+ },
247
+ /** 录制 */ record: function(attr) {
248
+ if (attr === void 0) attr = {};
249
+ return createIcon(__SVG__.record, 'record', attr);
250
+ },
251
+ /** 设置 */ setting: function(attr) {
252
+ if (attr === void 0) attr = {};
253
+ return createIcon(__SVG__.setting, 'setting', attr);
254
+ },
255
+ /** 网页全屏 */ webFullscreen: function(attr) {
256
+ if (attr === void 0) attr = {};
257
+ return createIcon(__SVG__.webFullscreen, 'webFullscreen', attr);
258
+ },
259
+ /** 退出网页全屏 */ exitWebFullscreen: function(attr) {
260
+ if (attr === void 0) attr = {};
261
+ return createIcon(__SVG__.exitWebFullscreen, 'exitWebFullscreen', attr);
262
+ },
263
+ /** 全屏 */ fullscreen: function(attr) {
264
+ if (attr === void 0) attr = {};
265
+ return createIcon(__SVG__.fullscreen, 'fullscreen', attr);
266
+ },
267
+ /** 退出全屏 */ exitFullscreen: function(attr) {
268
+ if (attr === void 0) attr = {};
269
+ return createIcon(__SVG__.exitFullscreen, 'exitFullscreen', attr);
270
+ },
271
+ close: function(attr) {
272
+ if (attr === void 0) attr = {};
273
+ return createIcon(__SVG__.close, 'close', attr);
274
+ },
275
+ screens: function(attr) {
276
+ if (attr === void 0) attr = {};
277
+ return createIcon(__SVG__.screens, 'screens', attr);
278
+ }
279
+ };
280
+
281
+ function getLocale(locales, language) {
282
+ if (language === void 0) language = 'zh';
283
+ return (locales == null ? void 0 : locales[language]) || (locales == null ? void 0 : locales['zh']) || {};
284
+ }
285
+
286
+ function _defineProperties$5(target, props) {
287
+ for(var i = 0; i < props.length; i++){
288
+ var descriptor = props[i];
289
+ descriptor.enumerable = descriptor.enumerable || false;
290
+ descriptor.configurable = true;
291
+ if ("value" in descriptor) descriptor.writable = true;
292
+ Object.defineProperty(target, descriptor.key, descriptor);
293
+ }
294
+ }
295
+ function _create_class$5(Constructor, protoProps, staticProps) {
296
+ if (protoProps) _defineProperties$5(Constructor.prototype, protoProps);
297
+ return Constructor;
298
+ }
299
+ function _inherits$8(subClass, superClass) {
300
+ if (typeof superClass !== "function" && superClass !== null) {
301
+ throw new TypeError("Super expression must either be null or a function");
302
+ }
303
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
304
+ constructor: {
305
+ value: subClass,
306
+ writable: true,
307
+ configurable: true
308
+ }
309
+ });
310
+ if (superClass) _set_prototype_of$8(subClass, superClass);
311
+ }
312
+ function _set_prototype_of$8(o, p) {
313
+ _set_prototype_of$8 = Object.setPrototypeOf || function setPrototypeOf(o, p) {
314
+ o.__proto__ = p;
315
+ return o;
316
+ };
317
+ return _set_prototype_of$8(o, p);
318
+ }
319
+ /**
320
+ * 控件基类
321
+ * @remarks
322
+ * 提供控件的基础功能，包括状态管理、事件处理、国际化等
323
+ * @category Control
324
+ * @example
325
+ * ```ts
326
+ * // 创建自定义控件
327
+ * class MyControl extends Control {
328
+ * protected _onControlClick(e: Event): void {
329
+ * console.log('Control clicked');
330
+ * }
331
+ * }
332
+ *
333
+ * // 使用控件
334
+ * const myControl = new MyControl({
335
+ * classNameSuffix: 'my-control',
336
+ * language: 'zh',
337
+ * onClick: (e) => console.log('Clicked')
338
+ * });
339
+ * ```
340
+ * @public
341
+ */ var Control = /*#__PURE__*/ function(EventEmitter) {
342
+ _inherits$8(Control, EventEmitter);
343
+ function Control(options) {
344
+ var _this;
345
+ _this = EventEmitter.call(this) || this, /** 当前语言对应的翻译数据 */ _this.locale = null, /** 是否禁用状态 */ _this._disabled = false, /** 是否激活状态 */ _this._active = false, /** 驼峰命名的控件名称 */ _this._camelCaseName = '';
346
+ _this.options = options;
347
+ _this.layout = options.layout;
348
+ // 初始化国际化
349
+ _this.locale = getLocale(_this.options.locales, _this.options.language);
350
+ // 生成驼峰命名
351
+ _this._camelCaseName = _this.options.classNameSuffix ? _this.options.classNameSuffix.replace(/[-_\s]+(.)?/g, function(_, c) {
352
+ return c ? c.toUpperCase() : '';
353
+ }).replace(/^(.)/, function(first) {
354
+ return first.toLowerCase();
355
+ }) : '';
356
+ // 创建容器元素
357
+ _this.$container = document.createElement('div');
358
+ _this.$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "-control");
359
+ // 根据控件类型添加样式类
360
+ if ((options == null ? void 0 : options.controlType) === 'text') {
361
+ _this.$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "-control-text");
362
+ } else {
363
+ _this.$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "-control-btn");
364
+ }
365
+ // 添加自定义样式类
366
+ if (options == null ? void 0 : options.classNameSuffix) {
367
+ _this.$container.classList.add(_EZ_SL_CLASS_PREFIX_ + "-control-" + options.classNameSuffix);
368
+ }
369
+ if (options == null ? void 0 : options.className) {
370
+ _this.$container.classList.add(options.className);
371
+ }
372
+ // 设置挂载容器
373
+ if (options.getPopupContainer) {
374
+ _this.$popupContainer = options.getPopupContainer();
375
+ } else {
376
+ _this.$popupContainer = document.body;
377
+ }
378
+ _this.$popupContainer.appendChild(_this.$container);
379
+ // 绑定点击事件
380
+ _this._onClick();
381
+ return _this;
382
+ }
383
+ var _proto = Control.prototype;
384
+ /**
385
+ * 重置控件状态
386
+ * @param hide - 是否隐藏控件
387
+ */ _proto.reset = function reset(hide) {
388
+ if (this._camelCaseName) {
389
+ this.emit("Control." + this._camelCaseName + "Reset", hide);
390
+ }
391
+ };
392
+ /**
393
+ * 重置控件挂载节点
394
+ * @param popupContainer - 新的挂载节点
395
+ * @param append - 添加方式：prepend(插入第一个位置) | append(追加在末尾) | before(插入指定元素前)
396
+ * @param element - 当 append = 'before' 时需要，插入到该元素之前
397
+ * @example
398
+ * ```ts
399
+ * // 追加到容器末尾
400
+ * control.resetPopupContainer(newContainer, 'append');
401
+ *
402
+ * // 插入到容器第一个位置
403
+ * control.resetPopupContainer(newContainer, 'prepend');
404
+ *
405
+ * // 插入到指定元素之前
406
+ * control.resetPopupContainer(newContainer, 'before', targetElement);
407
+ * ```
408
+ */ // prettier-ignore
409
+ _proto.resetPopupContainer = function resetPopupContainer(popupContainer, append, element) {
410
+ if (popupContainer === this.$popupContainer) {
411
+ return;
412
+ }
413
+ // 从旧容器中移除
414
+ if (this.$popupContainer.contains(this.$container)) {
415
+ this.$popupContainer.removeChild(this.$container);
416
+ }
417
+ // 设置新容器
418
+ this.$popupContainer = popupContainer;
419
+ // 根据不同方式添加到新容器
420
+ switch(append){
421
+ case 'prepend':
422
+ this.$popupContainer.prepend(this.$container);
423
+ break;
424
+ case 'before':
425
+ if (element) {
426
+ this.$popupContainer.insertBefore(this.$container, element);
427
+ } else {
428
+ this.$popupContainer.appendChild(this.$container);
429
+ }
430
+ break;
431
+ default:
432
+ this.$popupContainer.appendChild(this.$container);
433
+ break;
434
+ }
435
+ // 触发容器重置事件
436
+ if (this._camelCaseName) {
437
+ this.emit("Control." + this._camelCaseName + "ResetContainer", this.options.classNameSuffix, popupContainer);
438
+ }
439
+ };
440
+ /**
441
+ * 显示控件
442
+ */ _proto.show = function show() {
443
+ if (this.$container) {
444
+ this.$container.style.display = '';
445
+ this.$container.classList.remove("" + _EZ_SL_CLASS_PREFIX_ + "-hide");
446
+ }
447
+ };
448
+ /**
449
+ * 隐藏控件
450
+ */ _proto.hide = function hide() {
451
+ if (this.$container) {
452
+ this.$container.style.display = 'none';
453
+ this.$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "-hide");
454
+ }
455
+ };
456
+ /**
457
+ * 销毁控件
458
+ * @remarks
459
+ * 清理所有事件监听器和 DOM 元素
460
+ */ _proto.destroy = function destroy() {
461
+ if (this._camelCaseName) {
462
+ this.emit("Control." + this._camelCaseName + "Destroy");
463
+ }
464
+ this._active = false;
465
+ this.removeAllListeners();
466
+ if (this.$container) {
467
+ this.$container.remove();
468
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
469
+ // @ts-expect-error - 需要清空引用
470
+ this.$container = null;
471
+ }
472
+ };
473
+ /**
474
+ * 更新控件显示
475
+ * @remarks
476
+ * 子类可以重写此方法来实现自定义更新逻辑
477
+ * @public
478
+ */ _proto.update = function update() {
479
+ // 默认空实现，子类可重写
480
+ };
481
+ /**
482
+ * 更新禁用状态的样式
483
+ * @param disabled - 是否禁用
484
+ * @protected
485
+ */ _proto._updateDisabledState = function _updateDisabledState(disabled) {
486
+ if (disabled) {
487
+ var _this_$container;
488
+ (_this_$container = this.$container) == null ? void 0 : _this_$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "-disabled");
489
+ } else {
490
+ var _this_$container1;
491
+ (_this_$container1 = this.$container) == null ? void 0 : _this_$container1.classList.remove("" + _EZ_SL_CLASS_PREFIX_ + "-disabled");
492
+ }
493
+ };
494
+ /**
495
+ * 更新激活状态的样式
496
+ * @param active - 是否激活
497
+ * @protected
498
+ */ _proto._updateActiveState = function _updateActiveState(active) {
499
+ if (active) {
500
+ var _this_$container;
501
+ (_this_$container = this.$container) == null ? void 0 : _this_$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "-active");
502
+ } else {
503
+ var _this_$container1;
504
+ (_this_$container1 = this.$container) == null ? void 0 : _this_$container1.classList.remove("" + _EZ_SL_CLASS_PREFIX_ + "-active");
505
+ }
506
+ };
507
+ /**
508
+ * 绑定点击事件
509
+ * @private
510
+ */ _proto._onClick = function _onClick() {
511
+ var _this = this;
512
+ this.$container.addEventListener('click', function(e) {
513
+ var _this_$container;
514
+ // 禁用状态下不触发点击事件
515
+ if (!((_this_$container = _this.$container) == null ? void 0 : _this_$container.classList.contains("" + _EZ_SL_CLASS_PREFIX_ + "-disabled"))) {
516
+ _this._onControlClick(e);
517
+ }
518
+ });
519
+ };
520
+ /**
521
+ * 控件点击事件处理
522
+ * @param e - 事件对象
523
+ * @remarks
524
+ * 子类可以重写此方法来实现自定义点击行为
525
+ * @protected
526
+ */ _proto._onControlClick = function _onControlClick(e) {
527
+ this.options.onClick == null ? void 0 : this.options.onClick.call(this.options, e);
528
+ };
529
+ _create_class$5(Control, [
530
+ {
531
+ key: "active",
532
+ get: /**
533
+ * 获取或设置激活状态
534
+ */ function get() {
535
+ return this._active;
536
+ },
537
+ set: function set(active) {
538
+ // 禁用状态下不允许激活
539
+ if (this._disabled && !this._active) {
540
+ return;
541
+ }
542
+ this._active = active;
543
+ this._updateActiveState(active);
544
+ }
545
+ },
546
+ {
547
+ key: "disabled",
548
+ get: /**
549
+ * 获取或设置禁用状态
550
+ */ function get() {
551
+ return this._disabled;
552
+ },
553
+ set: function set(disabled) {
554
+ this._disabled = disabled;
555
+ this._updateDisabledState(disabled);
556
+ }
557
+ }
558
+ ]);
559
+ return Control;
560
+ }(EventEmitter);
561
+ Control.cname = 'control';
562
+
563
+ function _defineProperties$4(target, props) {
564
+ for(var i = 0; i < props.length; i++){
565
+ var descriptor = props[i];
566
+ descriptor.enumerable = descriptor.enumerable || false;
567
+ descriptor.configurable = true;
568
+ if ("value" in descriptor) descriptor.writable = true;
569
+ Object.defineProperty(target, descriptor.key, descriptor);
570
+ }
571
+ }
572
+ function _create_class$4(Constructor, protoProps, staticProps) {
573
+ if (protoProps) _defineProperties$4(Constructor.prototype, protoProps);
574
+ return Constructor;
575
+ }
576
+ function _extends$8() {
577
+ _extends$8 = Object.assign || function(target) {
578
+ for(var i = 1; i < arguments.length; i++){
579
+ var source = arguments[i];
580
+ for(var key in source){
581
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
582
+ target[key] = source[key];
583
+ }
584
+ }
585
+ }
586
+ return target;
587
+ };
588
+ return _extends$8.apply(this, arguments);
589
+ }
590
+ function _inherits$7(subClass, superClass) {
591
+ if (typeof superClass !== "function" && superClass !== null) {
592
+ throw new TypeError("Super expression must either be null or a function");
593
+ }
594
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
595
+ constructor: {
596
+ value: subClass,
597
+ writable: true,
598
+ configurable: true
599
+ }
600
+ });
601
+ if (superClass) _set_prototype_of$7(subClass, superClass);
602
+ }
603
+ function _set_prototype_of$7(o, p) {
604
+ _set_prototype_of$7 = Object.setPrototypeOf || function setPrototypeOf(o, p) {
605
+ o.__proto__ = p;
606
+ return o;
607
+ };
608
+ return _set_prototype_of$7(o, p);
609
+ }
610
+ /**
611
+ * 播放/暂停控件
612
+ * @remarks
613
+ * 提供视频播放和暂停功能，支持状态自动切换
614
+ * @category Control
615
+ * @public
616
+ */ var Play = /*#__PURE__*/ function(Control) {
617
+ _inherits$7(Play, Control);
618
+ function Play(options) {
619
+ var _this;
620
+ _this = Control.call(this, _extends$8({}, options, {
621
+ controlType: 'button',
622
+ classNameSuffix: 'play'
623
+ })) || this, /** 播放状态 */ _this._playing = true;
624
+ _this._render();
625
+ return _this;
626
+ }
627
+ var _proto = Play.prototype;
628
+ /**
629
+ * 点击控件触发
630
+ * @protected
631
+ */ _proto._onControlClick = function _onControlClick(e) {
632
+ if (this._playing) {
633
+ var _this_layout;
634
+ (_this_layout = this.layout) == null ? void 0 : _this_layout.pause();
635
+ } else {
636
+ var _this_layout1;
637
+ (_this_layout1 = this.layout) == null ? void 0 : _this_layout1.play();
638
+ }
639
+ this._playing = !this._playing;
640
+ this._render();
641
+ Control.prototype._onControlClick.call(this, e);
642
+ };
643
+ /**
644
+ * 渲染控件内容
645
+ * @private
646
+ */ _proto._render = function _render() {
647
+ this.$container.innerHTML = this.playing ? ICONS.play() : ICONS.pause();
648
+ };
649
+ /**
650
+ * 更新控件显示
651
+ * @public
652
+ */ _proto.update = function update() {
653
+ this._render();
654
+ };
655
+ _create_class$4(Play, [
656
+ {
657
+ key: "playing",
658
+ get: /**
659
+ * 播放状态
660
+ */ function get() {
661
+ return this._playing;
662
+ }
663
+ }
664
+ ]);
665
+ return Play;
666
+ }(Control);
667
+ Play.cname = 'play';
668
+
669
+ function _extends$7() {
670
+ _extends$7 = Object.assign || function(target) {
671
+ for(var i = 1; i < arguments.length; i++){
672
+ var source = arguments[i];
673
+ for(var key in source){
674
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
675
+ target[key] = source[key];
676
+ }
677
+ }
678
+ }
679
+ return target;
680
+ };
681
+ return _extends$7.apply(this, arguments);
682
+ }
683
+ function _inherits$6(subClass, superClass) {
684
+ if (typeof superClass !== "function" && superClass !== null) {
685
+ throw new TypeError("Super expression must either be null or a function");
686
+ }
687
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
688
+ constructor: {
689
+ value: subClass,
690
+ writable: true,
691
+ configurable: true
692
+ }
693
+ });
694
+ if (superClass) _set_prototype_of$6(subClass, superClass);
695
+ }
696
+ function _set_prototype_of$6(o, p) {
697
+ _set_prototype_of$6 = Object.setPrototypeOf || function setPrototypeOf(o, p) {
698
+ o.__proto__ = p;
699
+ return o;
700
+ };
701
+ return _set_prototype_of$6(o, p);
702
+ }
703
+ /**
704
+ * 静音控件
705
+ * @remarks
706
+ * 提供静音控制功能，支持全部静音、其他静音、取消静音
707
+ * @category Control
708
+ * @public
709
+ */ var Muted = /*#__PURE__*/ function(Control) {
710
+ _inherits$6(Muted, Control);
711
+ function Muted(options) {
712
+ var _this;
713
+ _this = Control.call(this, _extends$7({}, options, {
714
+ controlType: 'button',
715
+ classNameSuffix: 'muted'
716
+ })) || this;
717
+ _this._render();
718
+ return _this;
719
+ }
720
+ var _proto = Muted.prototype;
721
+ /**
722
+ * 点击控件触发
723
+ * @protected
724
+ */ _proto._onControlClick = function _onControlClick(e) {
725
+ var _this_layout_muted, _this_layout;
726
+ (_this_layout = this.layout) == null ? void 0 : (_this_layout_muted = _this_layout.muted) == null ? void 0 : _this_layout_muted.call(_this_layout, true);
727
+ Control.prototype._onControlClick.call(this, e);
728
+ };
729
+ /**
730
+ * 渲染控件内容
731
+ * @private
732
+ */ _proto._render = function _render() {
733
+ this.$container.innerHTML = ICONS.muted();
734
+ };
735
+ return Muted;
736
+ }(Control);
737
+ Muted.cname = 'muted';
738
+
739
+ function _extends$6() {
740
+ _extends$6 = Object.assign || function(target) {
741
+ for(var i = 1; i < arguments.length; i++){
742
+ var source = arguments[i];
743
+ for(var key in source){
744
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
745
+ target[key] = source[key];
746
+ }
747
+ }
748
+ }
749
+ return target;
750
+ };
751
+ return _extends$6.apply(this, arguments);
752
+ }
753
+ function _inherits$5(subClass, superClass) {
754
+ if (typeof superClass !== "function" && superClass !== null) {
755
+ throw new TypeError("Super expression must either be null or a function");
756
+ }
757
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
758
+ constructor: {
759
+ value: subClass,
760
+ writable: true,
761
+ configurable: true
762
+ }
763
+ });
764
+ if (superClass) _set_prototype_of$5(subClass, superClass);
765
+ }
766
+ function _set_prototype_of$5(o, p) {
767
+ _set_prototype_of$5 = Object.setPrototypeOf || function setPrototypeOf(o, p) {
768
+ o.__proto__ = p;
769
+ return o;
770
+ };
771
+ return _set_prototype_of$5(o, p);
772
+ }
773
+ /**
774
+ * 截图控件
775
+ * @remarks
776
+ * 提供视频截图功能
777
+ * @category Control
778
+ * @public
779
+ */ var Screenshot = /*#__PURE__*/ function(Control) {
780
+ _inherits$5(Screenshot, Control);
781
+ function Screenshot(options) {
782
+ var _this;
783
+ _this = Control.call(this, _extends$6({}, options, {
784
+ controlType: 'button',
785
+ classNameSuffix: 'screenshot'
786
+ })) || this;
787
+ _this._render();
788
+ return _this;
789
+ }
790
+ var _proto = Screenshot.prototype;
791
+ /**
792
+ * 点击控件触发
793
+ * @protected
794
+ */ _proto._onControlClick = function _onControlClick(e) {
795
+ var _this_layout_screenshot, _this_layout;
796
+ (_this_layout = this.layout) == null ? void 0 : (_this_layout_screenshot = _this_layout.screenshot) == null ? void 0 : _this_layout_screenshot.call(_this_layout);
797
+ Control.prototype._onControlClick.call(this, e);
798
+ };
799
+ /**
800
+ * 渲染控件内容
801
+ * @private
802
+ */ _proto._render = function _render() {
803
+ this.$container.innerHTML = ICONS.screenshot();
804
+ };
805
+ return Screenshot;
806
+ }(Control);
807
+ Screenshot.cname = 'screenshot';
808
+
809
+ function _defineProperties$3(target, props) {
810
+ for(var i = 0; i < props.length; i++){
811
+ var descriptor = props[i];
812
+ descriptor.enumerable = descriptor.enumerable || false;
813
+ descriptor.configurable = true;
814
+ if ("value" in descriptor) descriptor.writable = true;
815
+ Object.defineProperty(target, descriptor.key, descriptor);
816
+ }
817
+ }
818
+ function _create_class$3(Constructor, protoProps, staticProps) {
819
+ if (protoProps) _defineProperties$3(Constructor.prototype, protoProps);
820
+ return Constructor;
821
+ }
822
+ /**
823
+ * 分屏模式选择器组件
824
+ * @remarks
825
+ * 提供一个下拉菜单样式的分屏模式选择器
826
+ * @public
827
+ */ var ModePicker = /*#__PURE__*/ function() {
828
+ function ModePicker(container, options) {
829
+ this._currentMode = 4;
830
+ this.modeOptions = [
831
+ {
832
+ mode: 1,
833
+ label: '1分屏',
834
+ icon: this._createModeIcon(1, 1)
835
+ },
836
+ {
837
+ mode: 2,
838
+ label: '2分屏',
839
+ icon: this._createModeIcon(1, 2)
840
+ },
841
+ {
842
+ mode: 4,
843
+ label: '4分屏',
844
+ icon: this._createModeIcon(2, 2)
845
+ },
846
+ {
847
+ mode: 6,
848
+ label: '6分屏',
849
+ icon: this._createModeIcon(2, 3)
850
+ },
851
+ {
852
+ mode: 9,
853
+ label: '9分屏',
854
+ icon: this._createModeIcon(3, 3)
855
+ },
856
+ {
857
+ mode: 16,
858
+ label: '16分屏',
859
+ icon: this._createModeIcon(4, 4)
860
+ }
861
+ ];
862
+ this.container = container;
863
+ this.onChange = options.onChange;
864
+ this.i18n = options.i18n;
865
+ this._init();
866
+ this._onOptionsClick = this._onOptionsClick.bind(this);
867
+ this.current = options.currentMode;
868
+ }
869
+ var _proto = ModePicker.prototype;
870
+ /**
871
+ * 初始化组件
872
+ * @private
873
+ */ _proto._init = function _init() {
874
+ this.createPicker();
875
+ };
876
+ /**
877
+ * 创建分屏模式图标
878
+ * @param rows - 行数
879
+ * @param cols - 列数
880
+ * @returns SVG 图标字符串
881
+ * @private
882
+ */ _proto._createModeIcon = function _createModeIcon(rows, cols) {
883
+ var cellWidth = 100 / cols;
884
+ var cellHeight = 100 / rows;
885
+ var cells = '';
886
+ for(var i = 0; i < rows * cols; i++){
887
+ var row = Math.floor(i / cols);
888
+ var col = i % cols;
889
+ var x = col * cellWidth;
890
+ var y = row * cellHeight;
891
+ cells += '<rect x="' + (x + 2) + '" y="' + (y + 2) + '" width="' + (cellWidth - 4) + '" height="' + (cellHeight - 4) + '" \n fill="currentColor" opacity="0.8" rx="2"/>';
892
+ }
893
+ return '<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">\n ' + cells + "\n </svg>";
894
+ };
895
+ /**
896
+ * 创建下拉选择器
897
+ * @private
898
+ */ _proto.createPicker = function createPicker() {
899
+ var _this = this;
900
+ // 创建下拉内容
901
+ var dropdownContent = this.createDropdownContent();
902
+ // 使用 @skax/picker 创建弹出层
903
+ this.picker = new Picker(this.container, {
904
+ placement: 'tr',
905
+ trigger: 'hover',
906
+ wrapClassName: 'mode-picker-dropdown',
907
+ getPopupContainer: function() {
908
+ return _this.container;
909
+ },
910
+ onOpenChange: function(_open) {
911
+ // 打开时更新内容，确保状态同步
912
+ }
913
+ });
914
+ // 设置弹出内容
915
+ this.picker.innerHTML(dropdownContent);
916
+ };
917
+ /**
918
+ * 创建下拉菜单内容
919
+ * @returns 下拉菜单 HTML 字符串
920
+ * @private
921
+ */ _proto.createDropdownContent = function createDropdownContent() {
922
+ var _this = this;
923
+ var _this_i18n_t, _this_i18n;
924
+ var options = this.modeOptions.map(function(option) {
925
+ var isActive = option.mode === _this.current;
926
+ return '\n <div class="mode-picker_option ' + (isActive ? 'mode-picker_option-active' : '') + '" data-mode="' + option.mode + '">\n <span class="mode-picker_option-icon">' + option.icon + "</span>\n </div>";
927
+ }).join('');
928
+ // 添加事件委托
929
+ setTimeout(function() {
930
+ if (_this.picker.$body) {
931
+ _this.picker.$body.addEventListener('click', _this._onOptionsClick);
932
+ }
933
+ }, 0);
934
+ return '<div class="mode-picker_options">' + options + '</div>\n <div class="mode-picker_tip">\n ' + ((_this_i18n = this.i18n) == null ? void 0 : (_this_i18n_t = _this_i18n.t) == null ? void 0 : _this_i18n_t.call(_this_i18n, "screensNote")) + "\n </div>\n ";
935
+ };
936
+ _proto._onOptionsClick = function _onOptionsClick(e) {
937
+ var target = e.target;
938
+ var optionEl = target.closest('.mode-picker_option');
939
+ if (optionEl) {
940
+ var mode = Number(optionEl.dataset.mode);
941
+ this.selectMode(mode);
942
+ }
943
+ };
944
+ /**
945
+ * 选中指定模式
946
+ * @param mode - 分屏模式
947
+ * @private
948
+ */ _proto.selectMode = function selectMode(mode) {
949
+ this.current = mode;
950
+ this.picker.open = false; // 关闭弹窗
951
+ this.onChange(mode);
952
+ };
953
+ /**
954
+ * 设置当前分屏模式
955
+ * @param mode - 分屏模式
956
+ */ _proto.setMode = function setMode(mode) {
957
+ this.current = mode;
958
+ };
959
+ /**
960
+ * 销毁选择器实例
961
+ * @remarks
962
+ * 清理所有 DOM 元素和事件监听器
963
+ */ _proto.destroy = function destroy() {
964
+ if (this.picker) {
965
+ if (this.picker.$body) {
966
+ this.picker.$body.removeEventListener('click', this._onOptionsClick);
967
+ }
968
+ this.picker.destroy();
969
+ }
970
+ };
971
+ _create_class$3(ModePicker, [
972
+ {
973
+ key: "current",
974
+ get: function get() {
975
+ return this._currentMode;
976
+ },
977
+ set: function set(mode) {
978
+ if (mode !== this._currentMode) {
979
+ this._currentMode = mode;
980
+ if (this.picker) {
981
+ var _this_picker_$body, _this_picker_$body1;
982
+ var optionEl = (_this_picker_$body = this.picker.$body) == null ? void 0 : _this_picker_$body.querySelector('[data-mode="' + mode + '"]');
983
+ var activeEls = (_this_picker_$body1 = this.picker.$body) == null ? void 0 : _this_picker_$body1.querySelectorAll('.mode-picker_option-active');
984
+ activeEls == null ? void 0 : activeEls.forEach(function(el) {
985
+ return el.classList.remove('mode-picker_option-active');
986
+ });
987
+ if (optionEl) optionEl.classList.add('mode-picker_option-active');
988
+ }
989
+ }
990
+ }
991
+ }
992
+ ]);
993
+ return ModePicker;
994
+ }();
995
+
996
+ /* eslint-disable @typescript-eslint/no-non-null-assertion */ function _defineProperties$2(target, props) {
997
+ for(var i = 0; i < props.length; i++){
998
+ var descriptor = props[i];
999
+ descriptor.enumerable = descriptor.enumerable || false;
1000
+ descriptor.configurable = true;
1001
+ if ("value" in descriptor) descriptor.writable = true;
1002
+ Object.defineProperty(target, descriptor.key, descriptor);
1003
+ }
1004
+ }
1005
+ function _create_class$2(Constructor, protoProps, staticProps) {
1006
+ if (protoProps) _defineProperties$2(Constructor.prototype, protoProps);
1007
+ return Constructor;
1008
+ }
1009
+ function _extends$5() {
1010
+ _extends$5 = Object.assign || function(target) {
1011
+ for(var i = 1; i < arguments.length; i++){
1012
+ var source = arguments[i];
1013
+ for(var key in source){
1014
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
1015
+ target[key] = source[key];
1016
+ }
1017
+ }
1018
+ }
1019
+ return target;
1020
+ };
1021
+ return _extends$5.apply(this, arguments);
1022
+ }
1023
+ function _inherits$4(subClass, superClass) {
1024
+ if (typeof superClass !== "function" && superClass !== null) {
1025
+ throw new TypeError("Super expression must either be null or a function");
1026
+ }
1027
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
1028
+ constructor: {
1029
+ value: subClass,
1030
+ writable: true,
1031
+ configurable: true
1032
+ }
1033
+ });
1034
+ if (superClass) _set_prototype_of$4(subClass, superClass);
1035
+ }
1036
+ function _set_prototype_of$4(o, p) {
1037
+ _set_prototype_of$4 = Object.setPrototypeOf || function setPrototypeOf(o, p) {
1038
+ o.__proto__ = p;
1039
+ return o;
1040
+ };
1041
+ return _set_prototype_of$4(o, p);
1042
+ }
1043
+ /**
1044
+ * 分屏模式控件
1045
+ * @remarks
1046
+ * 提供分屏模式选择功能
1047
+ * @category Control
1048
+ * @public
1049
+ */ var Mode = /*#__PURE__*/ function(Control) {
1050
+ _inherits$4(Mode, Control);
1051
+ function Mode(options) {
1052
+ var _this;
1053
+ var _this_layout;
1054
+ _this = Control.call(this, _extends$5({}, options, {
1055
+ controlType: 'button',
1056
+ classNameSuffix: 'mode'
1057
+ })) || this, _this.mode = 4;
1058
+ _this._onModeChange = options.onModeChange;
1059
+ _this.mode = (_this_layout = _this.layout) == null ? void 0 : _this_layout.mode;
1060
+ _this._render();
1061
+ _this._initModePicker();
1062
+ return _this;
1063
+ }
1064
+ var _proto = Mode.prototype;
1065
+ /**
1066
+ * 点击控件触发
1067
+ * @protected
1068
+ */ _proto._onControlClick = function _onControlClick(e) {
1069
+ Control.prototype._onControlClick.call(this, e);
1070
+ };
1071
+ /**
1072
+ * 渲染控件内容
1073
+ * @private
1074
+ */ _proto._render = function _render() {
1075
+ this.$container.innerHTML = ICONS.screens();
1076
+ };
1077
+ /**
1078
+ * 初始化模式选择器
1079
+ * @private
1080
+ */ _proto._initModePicker = function _initModePicker() {
1081
+ var _this = this;
1082
+ // 延迟初始化，确保 DOM 已挂载
1083
+ setTimeout(function() {
1084
+ var _this_layout;
1085
+ _this._modePicker = new ModePicker(_this.$container, {
1086
+ currentMode: _this.mode,
1087
+ i18n: (_this_layout = _this.layout) == null ? void 0 : _this_layout.i18n,
1088
+ onChange: function(mode) {
1089
+ var // 更新 MultiScreen 模式
1090
+ _this_layout_setMode, _this_layout;
1091
+ (_this_layout = _this.layout) == null ? void 0 : (_this_layout_setMode = _this_layout.setMode) == null ? void 0 : _this_layout_setMode.call(_this_layout, mode);
1092
+ // 触发回调
1093
+ _this._onModeChange == null ? void 0 : _this._onModeChange.call(_this, mode);
1094
+ }
1095
+ });
1096
+ }, 0);
1097
+ };
1098
+ /**
1099
+ * 更新当前模式
1100
+ * @param mode - 分屏模式
1101
+ * @public
1102
+ */ _proto.setMode = function setMode(mode) {
1103
+ if (this.mode !== mode && this._modePicker) {
1104
+ this._modePicker.setMode(mode);
1105
+ }
1106
+ };
1107
+ /**
1108
+ * 销毁控件
1109
+ * @public
1110
+ */ _proto.destroy = function destroy() {
1111
+ if (this._modePicker) {
1112
+ this._modePicker.destroy();
1113
+ this._modePicker = null;
1114
+ }
1115
+ Control.prototype.destroy.call(this);
1116
+ };
1117
+ _create_class$2(Mode, [
1118
+ {
1119
+ key: "modePicker",
1120
+ get: /**
1121
+ * 获取模式选择器实例
1122
+ * @public
1123
+ */ function get() {
1124
+ return this._modePicker;
1125
+ }
1126
+ }
1127
+ ]);
1128
+ return Mode;
1129
+ }(Control);
1130
+ Mode.cname = 'mode';
1131
+
1132
+ /* eslint-disable @typescript-eslint/naming-convention */ function _extends$4() {
1133
+ _extends$4 = Object.assign || function(target) {
1134
+ for(var i = 1; i < arguments.length; i++){
1135
+ var source = arguments[i];
1136
+ for(var key in source){
1137
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
1138
+ target[key] = source[key];
1139
+ }
1140
+ }
1141
+ }
1142
+ return target;
1143
+ };
1144
+ return _extends$4.apply(this, arguments);
1145
+ }
1146
+ var __Settings_PANEL_CLASS__ = 'ez-sl_settings';
1147
+ /**
1148
+ * 设置面板组件
1149
+ * @remarks
1150
+ * 提供画面比例、声音设置、浏览器硬解等设置选项
1151
+ * @public
1152
+ */ var SettingsPanel = /*#__PURE__*/ function() {
1153
+ function SettingsPanel(container, options) {
1154
+ this.container = container;
1155
+ this.language = options.language || 'zh';
1156
+ this.i18n = options.i18n;
1157
+ this.onChange = options.onChange;
1158
+ var _options_scaleMode;
1159
+ this.settings = {
1160
+ scaleMode: (_options_scaleMode = options.scaleMode) != null ? _options_scaleMode : 1,
1161
+ audioMode: options.audioMode || 'muted',
1162
+ enableHardwareDecoding: options.enableHardwareDecoding !== false
1163
+ };
1164
+ this._scaleModes = [
1165
+ {
1166
+ label: this.t('scaleModeFill'),
1167
+ value: 0
1168
+ },
1169
+ {
1170
+ label: this.t('scaleModeContain'),
1171
+ value: 1
1172
+ },
1173
+ {
1174
+ label: this.t('scaleModeCover'),
1175
+ value: 2
1176
+ }
1177
+ ];
1178
+ this.init();
1179
+ }
1180
+ var _proto = SettingsPanel.prototype;
1181
+ /**
1182
+ * 获取国际化文本
1183
+ * @private
1184
+ */ _proto.t = function t(key) {
1185
+ var _translations_this_language;
1186
+ if (this.i18n) {
1187
+ return String(this.i18n.t(key));
1188
+ }
1189
+ return ((_translations_this_language = translations[this.language]) == null ? void 0 : _translations_this_language[key]) || key;
1190
+ };
1191
+ /**
1192
+ * 初始化组件
1193
+ * @private
1194
+ */ _proto.init = function init() {
1195
+ this.createPicker();
1196
+ };
1197
+ /**
1198
+ * 创建设置面板 Picker
1199
+ * @private
1200
+ */ _proto.createPicker = function createPicker() {
1201
+ var _this = this;
1202
+ var panelContent = this.getPanelHTML();
1203
+ this.picker = new Picker(this.container, {
1204
+ placement: 'tr',
1205
+ trigger: 'hover',
1206
+ wrapClassName: "" + __Settings_PANEL_CLASS__ + "-dropdown",
1207
+ getPopupContainer: function() {
1208
+ return _this.container;
1209
+ },
1210
+ onOpenChange: function(open) {
1211
+ if (open) {
1212
+ _this.container.classList.add("" + __Settings_PANEL_CLASS__ + "_trigger-open");
1213
+ } else {
1214
+ _this.container.classList.remove("" + __Settings_PANEL_CLASS__ + "_trigger-open");
1215
+ }
1216
+ }
1217
+ });
1218
+ this.picker.innerHTML(panelContent);
1219
+ // 绑定事件
1220
+ setTimeout(function() {
1221
+ _this.bindEvents();
1222
+ }, 0);
1223
+ };
1224
+ /**
1225
+ * 获取面板 HTML
1226
+ * @private
1227
+ */ _proto.getPanelHTML = function getPanelHTML() {
1228
+ var _this = this;
1229
+ return '\n <div class="' + __Settings_PANEL_CLASS__ + '">\n <div class="' + __Settings_PANEL_CLASS__ + '_section">\n <div class="' + __Settings_PANEL_CLASS__ + '_section-title">' + this.t('scaleMode') + '</div>\n <div class="' + __Settings_PANEL_CLASS__ + '_aspect-ratio">\n ' + this._scaleModes.map(function(item, index) {
1230
+ return '<button class="' + __Settings_PANEL_CLASS__ + "_ratio-btn " + (_this.settings.scaleMode === index ? "" + __Settings_PANEL_CLASS__ + "_ratio-btn-active" : '') + '" \n data-ratio="' + index + '">' + item.label + "</button>";
1231
+ }).join('') + '\n </div>\n </div>\n\n <div class="' + __Settings_PANEL_CLASS__ + '_section">\n <div class="' + __Settings_PANEL_CLASS__ + '_section-title">' + this.t('audioSettings') + '</div>\n <div class="' + __Settings_PANEL_CLASS__ + '_audio-select">\n <span class="' + __Settings_PANEL_CLASS__ + '_audio-text">' + this.getAudioModeText() + '</span>\n <span class="' + __Settings_PANEL_CLASS__ + '_audio-arrow">▼</span>\n </div>\n </div>\n\n <div class="' + __Settings_PANEL_CLASS__ + '_section">\n <div class="' + __Settings_PANEL_CLASS__ + '_toggle-item">\n <div class="' + __Settings_PANEL_CLASS__ + '_toggle-info">\n <div class="' + __Settings_PANEL_CLASS__ + '_toggle-title">' + this.t('enableHardwareDecoding') + '</div>\n <div class="' + __Settings_PANEL_CLASS__ + '_toggle-desc">' + this.t('enableHardwareDecodingDesc') + '</div>\n </div>\n <label class="' + __Settings_PANEL_CLASS__ + '_switch">\n <input type="checkbox" ' + (this.settings.enableHardwareDecoding ? 'checked' : '') + ' data-setting="enableHardwareDecoding">\n <span class="' + __Settings_PANEL_CLASS__ + '_switch-slider"></span>\n </label>\n </div>\n </div>\n </div>\n ';
1232
+ };
1233
+ /**
1234
+ * 获取音频模式文本
1235
+ * @private
1236
+ */ _proto.getAudioModeText = function getAudioModeText() {
1237
+ var modeMap = {
1238
+ selected: this.t('audioSelected'),
1239
+ all: this.t('audioAll'),
1240
+ muted: this.t('audioMutedAll')
1241
+ };
1242
+ return modeMap[this.settings.audioMode || 'muted'];
1243
+ };
1244
+ /**
1245
+ * 绑定事件
1246
+ * @private
1247
+ */ _proto.bindEvents = function bindEvents() {
1248
+ var _this = this;
1249
+ var pickerBody = this.picker.$body;
1250
+ if (!pickerBody) return;
1251
+ // 画面比例按钮
1252
+ var ratioButtons = pickerBody.querySelectorAll("." + __Settings_PANEL_CLASS__ + "_ratio-btn");
1253
+ ratioButtons.forEach(function(btn) {
1254
+ btn.addEventListener('click', function() {
1255
+ var ratioAttr = btn.dataset.ratio;
1256
+ var ratio = Number(ratioAttr);
1257
+ if (Number.isNaN(ratio)) return;
1258
+ _this.setScaleMode(ratio);
1259
+ });
1260
+ });
1261
+ // 音频选择下拉框
1262
+ var audioTrigger = pickerBody.querySelector("." + __Settings_PANEL_CLASS__ + "_audio-select");
1263
+ if (audioTrigger) {
1264
+ this.createAudioPicker(audioTrigger);
1265
+ }
1266
+ // 开关按钮
1267
+ var switches = pickerBody.querySelectorAll("." + __Settings_PANEL_CLASS__ + "_switch input");
1268
+ switches.forEach(function(input) {
1269
+ input.addEventListener('change', function(e) {
1270
+ var target = e.target;
1271
+ var setting = target.dataset.setting;
1272
+ var hasChanged = _this.settings[setting] !== target.checked;
1273
+ if (hasChanged) {
1274
+ _this.settings[setting] = target.checked;
1275
+ _this.notifyChange();
1276
+ }
1277
+ });
1278
+ });
1279
+ };
1280
+ /**
1281
+ * 创建音频选择器
1282
+ * @private
1283
+ */ _proto.createAudioPicker = function createAudioPicker(trigger) {
1284
+ var _this = this;
1285
+ var dropdownContent = '\n <div class="' + __Settings_PANEL_CLASS__ + '_audio-dropdown">\n <div class="' + __Settings_PANEL_CLASS__ + "_audio-option " + (this.settings.audioMode === 'muted' ? "" + __Settings_PANEL_CLASS__ + "_audio-option-active" : '') + '" \n data-mode="muted">' + this.t('audioMutedAll') + '</div>\n <div class="' + __Settings_PANEL_CLASS__ + "_audio-option " + (this.settings.audioMode === 'selected' ? "" + __Settings_PANEL_CLASS__ + "_audio-option-active" : '') + '" \n data-mode="selected">' + this.t('audioSelected') + '</div>\n <div class="' + __Settings_PANEL_CLASS__ + "_audio-option " + (this.settings.audioMode === 'all' ? "" + __Settings_PANEL_CLASS__ + "_audio-option-active" : '') + '" \n data-mode="all">' + this.t('audioAll') + "</div>\n </div>\n ";
1286
+ this.audioPicker = new Picker(trigger, {
1287
+ placement: 'bl',
1288
+ trigger: 'hover',
1289
+ wrapClassName: "" + __Settings_PANEL_CLASS__ + "-audio-dropdown",
1290
+ getPopupContainer: function() {
1291
+ return trigger;
1292
+ }
1293
+ });
1294
+ this.audioPicker.innerHTML(dropdownContent);
1295
+ // 绑定选项点击事件
1296
+ setTimeout(function() {
1297
+ var _this_audioPicker;
1298
+ var pickerBody = (_this_audioPicker = _this.audioPicker) == null ? void 0 : _this_audioPicker.$body;
1299
+ if (pickerBody) {
1300
+ pickerBody.addEventListener('click', function(e) {
1301
+ var target = e.target;
1302
+ var optionEl = target.closest("." + __Settings_PANEL_CLASS__ + "_audio-option");
1303
+ if (optionEl) {
1304
+ var mode = optionEl.dataset.mode;
1305
+ _this.setAudioMode(mode);
1306
+ if (_this.audioPicker) _this.audioPicker.open = false;
1307
+ e.stopPropagation();
1308
+ e.preventDefault();
1309
+ }
1310
+ });
1311
+ }
1312
+ }, 0);
1313
+ };
1314
+ /**
1315
+ * 设置画面比例
1316
+ * @param ratio - 画面比例
1317
+ */ _proto.setScaleMode = function setScaleMode(ratio) {
1318
+ var hasChanged = this.settings.scaleMode !== ratio;
1319
+ if (hasChanged) this.settings.scaleMode = ratio;
1320
+ // 更新按钮状态
1321
+ var pickerBody = this.picker.$body;
1322
+ if (pickerBody) {
1323
+ var buttons = pickerBody.querySelectorAll("." + __Settings_PANEL_CLASS__ + "_ratio-btn");
1324
+ buttons.forEach(function(btn) {
1325
+ if (btn.dataset.ratio === String(ratio)) {
1326
+ btn.classList.add("" + __Settings_PANEL_CLASS__ + "_ratio-btn-active");
1327
+ } else {
1328
+ btn.classList.remove("" + __Settings_PANEL_CLASS__ + "_ratio-btn-active");
1329
+ }
1330
+ });
1331
+ }
1332
+ if (hasChanged) this.notifyChange();
1333
+ };
1334
+ /**
1335
+ * 设置音频模式
1336
+ * @param mode - 音频模式
1337
+ */ _proto.setAudioMode = function setAudioMode(mode) {
1338
+ var hasChanged = this.settings.audioMode !== mode;
1339
+ if (!hasChanged) return;
1340
+ if (hasChanged) this.settings.audioMode = mode;
1341
+ // 更新显示文本
1342
+ var pickerBody = this.picker.$body;
1343
+ if (pickerBody) {
1344
+ var textEl = pickerBody.querySelector("." + __Settings_PANEL_CLASS__ + "_audio-text");
1345
+ if (textEl) {
1346
+ textEl.textContent = this.getAudioModeText();
1347
+ }
1348
+ }
1349
+ // 更新下拉选项状态
1350
+ if (this.audioPicker) {
1351
+ var _this_audioPicker_$body;
1352
+ var options = (_this_audioPicker_$body = this.audioPicker.$body) == null ? void 0 : _this_audioPicker_$body.querySelectorAll("." + __Settings_PANEL_CLASS__ + "_audio-option");
1353
+ options == null ? void 0 : options.forEach(function(opt) {
1354
+ if (opt.dataset.mode === mode) {
1355
+ opt.classList.add("" + __Settings_PANEL_CLASS__ + "_audio-option-active");
1356
+ } else {
1357
+ opt.classList.remove("" + __Settings_PANEL_CLASS__ + "_audio-option-active");
1358
+ }
1359
+ });
1360
+ }
1361
+ // 关闭下拉框
1362
+ if (this.audioPicker) {
1363
+ this.audioPicker.open = false;
1364
+ }
1365
+ if (hasChanged) this.notifyChange();
1366
+ };
1367
+ /**
1368
+ * 获取当前设置
1369
+ */ _proto.getSettings = function getSettings() {
1370
+ return _extends$4({}, this.settings);
1371
+ };
1372
+ /**
1373
+ * 通知设置变化
1374
+ * @private
1375
+ */ _proto.notifyChange = function notifyChange() {
1376
+ if (this.onChange) {
1377
+ this.onChange(this.getSettings());
1378
+ }
1379
+ };
1380
+ /**
1381
+ * 销毁组件
1382
+ */ _proto.destroy = function destroy() {
1383
+ if (this.audioPicker) {
1384
+ this.audioPicker.destroy();
1385
+ }
1386
+ if (this.picker) {
1387
+ this.picker.destroy();
1388
+ }
1389
+ };
1390
+ return SettingsPanel;
1391
+ }();
1392
+
1393
+ function _defineProperties$1(target, props) {
1394
+ for(var i = 0; i < props.length; i++){
1395
+ var descriptor = props[i];
1396
+ descriptor.enumerable = descriptor.enumerable || false;
1397
+ descriptor.configurable = true;
1398
+ if ("value" in descriptor) descriptor.writable = true;
1399
+ Object.defineProperty(target, descriptor.key, descriptor);
1400
+ }
1401
+ }
1402
+ function _create_class$1(Constructor, protoProps, staticProps) {
1403
+ if (protoProps) _defineProperties$1(Constructor.prototype, protoProps);
1404
+ return Constructor;
1405
+ }
1406
+ function _extends$3() {
1407
+ _extends$3 = Object.assign || function(target) {
1408
+ for(var i = 1; i < arguments.length; i++){
1409
+ var source = arguments[i];
1410
+ for(var key in source){
1411
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
1412
+ target[key] = source[key];
1413
+ }
1414
+ }
1415
+ }
1416
+ return target;
1417
+ };
1418
+ return _extends$3.apply(this, arguments);
1419
+ }
1420
+ function _inherits$3(subClass, superClass) {
1421
+ if (typeof superClass !== "function" && superClass !== null) {
1422
+ throw new TypeError("Super expression must either be null or a function");
1423
+ }
1424
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
1425
+ constructor: {
1426
+ value: subClass,
1427
+ writable: true,
1428
+ configurable: true
1429
+ }
1430
+ });
1431
+ if (superClass) _set_prototype_of$3(subClass, superClass);
1432
+ }
1433
+ function _set_prototype_of$3(o, p) {
1434
+ _set_prototype_of$3 = Object.setPrototypeOf || function setPrototypeOf(o, p) {
1435
+ o.__proto__ = p;
1436
+ return o;
1437
+ };
1438
+ return _set_prototype_of$3(o, p);
1439
+ }
1440
+ /**
1441
+ * 设置控件
1442
+ * @remarks
1443
+ * 提供画面比例、声音设置、浏览器硬解等设置选项
1444
+ * @category Control
1445
+ * @public
1446
+ */ var Settings = /*#__PURE__*/ function(Control) {
1447
+ _inherits$3(Settings, Control);
1448
+ function Settings(options) {
1449
+ var _this;
1450
+ _this = Control.call(this, _extends$3({}, options, {
1451
+ controlType: 'button',
1452
+ classNameSuffix: 'settings'
1453
+ })) || this;
1454
+ _this._layout = options.layout;
1455
+ _this._onSettingsChange = options.onSettingsChange;
1456
+ // 添加特殊的包装类名用于 Picker 定位
1457
+ _this.$container.classList.add('ez-sl-toolbar-item-settings');
1458
+ _this._render();
1459
+ _this._initSettingsPanel();
1460
+ return _this;
1461
+ }
1462
+ var _proto = Settings.prototype;
1463
+ /**
1464
+ * 点击控件触发
1465
+ * @protected
1466
+ */ _proto._onControlClick = function _onControlClick(e) {
1467
+ // 点击事件由 SettingsPanel 的 Picker 处理
1468
+ Control.prototype._onControlClick.call(this, e);
1469
+ };
1470
+ /**
1471
+ * 渲染控件内容
1472
+ * @private
1473
+ */ _proto._render = function _render() {
1474
+ this.$container.innerHTML = ICONS.setting();
1475
+ };
1476
+ /**
1477
+ * 初始化设置面板
1478
+ * @private
1479
+ */ _proto._initSettingsPanel = function _initSettingsPanel() {
1480
+ var _this = this;
1481
+ // 延迟初始化，确保 DOM 已挂载
1482
+ setTimeout(function() {
1483
+ var _this__layout_i18n;
1484
+ _this._settingsPanel = new SettingsPanel(_this.$container, {
1485
+ language: ((_this__layout_i18n = _this._layout.i18n) == null ? void 0 : _this__layout_i18n.locale) || 'zh',
1486
+ i18n: _this._layout.i18n || undefined,
1487
+ scaleMode: _this._layout.scaleMode,
1488
+ audioMode: _this._layout.audioMode || "muted",
1489
+ enableHardwareDecoding: _this._layout.enableHardwareDecoding,
1490
+ onChange: function(settings) {
1491
+ if (settings.audioMode !== _this._layout.audioMode) {
1492
+ _this._layout.setAudioMode(settings.audioMode);
1493
+ }
1494
+ if (settings.enableHardwareDecoding !== _this._layout.enableHardwareDecoding) {
1495
+ // 重试初始化播放器生效
1496
+ _this._layout.enableHardwareDecoding = settings.enableHardwareDecoding;
1497
+ }
1498
+ if (settings.scaleMode !== _this._layout.scaleMode) {
1499
+ _this._layout.setScaleMode(settings.scaleMode);
1500
+ }
1501
+ // 触发回调
1502
+ _this._onSettingsChange == null ? void 0 : _this._onSettingsChange.call(_this, settings);
1503
+ _this.emit("setting:change", settings);
1504
+ }
1505
+ });
1506
+ }, 0);
1507
+ };
1508
+ /**
1509
+ * 销毁控件
1510
+ * @public
1511
+ */ _proto.destroy = function destroy() {
1512
+ if (this._settingsPanel) {
1513
+ this._settingsPanel.destroy();
1514
+ }
1515
+ Control.prototype.destroy.call(this);
1516
+ };
1517
+ _create_class$1(Settings, [
1518
+ {
1519
+ key: "settingsPanel",
1520
+ get: /**
1521
+ * 获取设置面板实例
1522
+ * @public
1523
+ */ function get() {
1524
+ return this._settingsPanel;
1525
+ }
1526
+ }
1527
+ ]);
1528
+ return Settings;
1529
+ }(Control);
1530
+ Settings.cname = 'settings';
1531
+
1532
+ function _extends$2() {
1533
+ _extends$2 = Object.assign || function(target) {
1534
+ for(var i = 1; i < arguments.length; i++){
1535
+ var source = arguments[i];
1536
+ for(var key in source){
1537
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
1538
+ target[key] = source[key];
1539
+ }
1540
+ }
1541
+ }
1542
+ return target;
1543
+ };
1544
+ return _extends$2.apply(this, arguments);
1545
+ }
1546
+ function _inherits$2(subClass, superClass) {
1547
+ if (typeof superClass !== "function" && superClass !== null) {
1548
+ throw new TypeError("Super expression must either be null or a function");
1549
+ }
1550
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
1551
+ constructor: {
1552
+ value: subClass,
1553
+ writable: true,
1554
+ configurable: true
1555
+ }
1556
+ });
1557
+ if (superClass) _set_prototype_of$2(subClass, superClass);
1558
+ }
1559
+ function _set_prototype_of$2(o, p) {
1560
+ _set_prototype_of$2 = Object.setPrototypeOf || function setPrototypeOf(o, p) {
1561
+ o.__proto__ = p;
1562
+ return o;
1563
+ };
1564
+ return _set_prototype_of$2(o, p);
1565
+ }
1566
+ /**
1567
+ * 网页全屏控件
1568
+ * @remarks
1569
+ * 提供网页全屏功能（伪全屏，仅在网页内全屏）
1570
+ * @category Control
1571
+ * @public
1572
+ */ var WebFullscreen = /*#__PURE__*/ function(Control) {
1573
+ _inherits$2(WebFullscreen, Control);
1574
+ function WebFullscreen(options) {
1575
+ var _this;
1576
+ _this = Control.call(this, _extends$2({}, options, {
1577
+ controlType: 'button',
1578
+ classNameSuffix: 'web-fullscreen'
1579
+ })) || this;
1580
+ _this.layout = options.layout;
1581
+ _this._render();
1582
+ return _this;
1583
+ }
1584
+ var _proto = WebFullscreen.prototype;
1585
+ /**
1586
+ * 点击控件触发
1587
+ * @protected
1588
+ */ _proto._onControlClick = function _onControlClick(e) {
1589
+ var _this = this;
1590
+ this.layout.toggleWebFullscreen == null ? void 0 : this.layout.toggleWebFullscreen.call(this.layout).then(function() {
1591
+ _this._render();
1592
+ });
1593
+ Control.prototype._onControlClick.call(this, e);
1594
+ };
1595
+ /**
1596
+ * 渲染控件内容
1597
+ * @private
1598
+ */ _proto._render = function _render() {
1599
+ this.$container.innerHTML = this.layout.isWebFullscreen ? ICONS.exitWebFullscreen() : ICONS.webFullscreen();
1600
+ };
1601
+ /**
1602
+ * 更新控件显示
1603
+ * @public
1604
+ */ _proto.update = function update() {
1605
+ this._render();
1606
+ };
1607
+ return WebFullscreen;
1608
+ }(Control);
1609
+ WebFullscreen.cname = 'webFullscreen';
1610
+
1611
+ function _extends$1() {
1612
+ _extends$1 = Object.assign || function(target) {
1613
+ for(var i = 1; i < arguments.length; i++){
1614
+ var source = arguments[i];
1615
+ for(var key in source){
1616
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
1617
+ target[key] = source[key];
1618
+ }
1619
+ }
1620
+ }
1621
+ return target;
1622
+ };
1623
+ return _extends$1.apply(this, arguments);
1624
+ }
1625
+ function _inherits$1(subClass, superClass) {
1626
+ if (typeof superClass !== "function" && superClass !== null) {
1627
+ throw new TypeError("Super expression must either be null or a function");
1628
+ }
1629
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
1630
+ constructor: {
1631
+ value: subClass,
1632
+ writable: true,
1633
+ configurable: true
1634
+ }
1635
+ });
1636
+ if (superClass) _set_prototype_of$1(subClass, superClass);
1637
+ }
1638
+ function _set_prototype_of$1(o, p) {
1639
+ _set_prototype_of$1 = Object.setPrototypeOf || function setPrototypeOf(o, p) {
1640
+ o.__proto__ = p;
1641
+ return o;
1642
+ };
1643
+ return _set_prototype_of$1(o, p);
1644
+ }
1645
+ /**
1646
+ * 全局全屏控件
1647
+ * @remarks
1648
+ * 提供浏览器原生全屏功能
1649
+ * @category Control
1650
+ * @public
1651
+ */ var Fullscreen = /*#__PURE__*/ function(Control) {
1652
+ _inherits$1(Fullscreen, Control);
1653
+ function Fullscreen(options) {
1654
+ var _this;
1655
+ _this = Control.call(this, _extends$1({}, options, {
1656
+ controlType: 'button',
1657
+ classNameSuffix: 'fullscreen'
1658
+ })) || this;
1659
+ _this.layout = options.layout;
1660
+ _this._render();
1661
+ return _this;
1662
+ }
1663
+ var _proto = Fullscreen.prototype;
1664
+ /**
1665
+ * 点击控件触发
1666
+ * @protected
1667
+ */ _proto._onControlClick = function _onControlClick(e) {
1668
+ var _this = this;
1669
+ this.layout.toggleFullscreen == null ? void 0 : this.layout.toggleFullscreen.call(this.layout).then(function() {
1670
+ _this._render();
1671
+ });
1672
+ Control.prototype._onControlClick.call(this, e);
1673
+ };
1674
+ /**
1675
+ * 渲染控件内容
1676
+ * @private
1677
+ */ _proto._render = function _render() {
1678
+ this.$container.innerHTML = this.layout.isGlobalFullscreen ? ICONS.exitFullscreen() : ICONS.fullscreen();
1679
+ };
1680
+ /**
1681
+ * 更新控件显示
1682
+ * @public
1683
+ */ _proto.update = function update() {
1684
+ this._render();
1685
+ };
1686
+ return Fullscreen;
1687
+ }(Control);
1688
+ Fullscreen.cname = 'fullscreen';
1689
+
1690
+ // Control class constructors for left toolbar
1691
+ var LeftControls = [
1692
+ Play,
1693
+ Muted,
1694
+ Screenshot
1695
+ ];
1696
+ // Control class constructors for right toolbar
1697
+ var RightControls = [
1698
+ Mode,
1699
+ Settings,
1700
+ WebFullscreen,
1701
+ Fullscreen
1702
+ ];
1703
+ var __CAN_DISABLED_CONTROL__ = [
1704
+ 'play',
1705
+ 'muted',
1706
+ 'screenshot'
1707
+ ];
1708
+
1709
+ /**
1710
+ * 切换网页全屏模式
1711
+ * @private
1712
+ */ function _toggleWebFullscreen(layout) {
1713
+ if (!layout.isWebFullscreen) {
1714
+ layout.$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "_web-fullscreen");
1715
+ layout.isWebFullscreen = true;
1716
+ } else {
1717
+ layout.$container.classList.remove("" + _EZ_SL_CLASS_PREFIX_ + "_web-fullscreen");
1718
+ layout.isWebFullscreen = false;
1719
+ }
1720
+ layout.emit('fullscreen:change', layout.isWebFullscreen, 'web');
1721
+ return Promise.resolve();
1722
+ }
1723
+ /**
1724
+ * 切换全局全屏模式
1725
+ * @private
1726
+ */ function _toggleGlobalFullscreen(layout) {
1727
+ if (!screenfull.isEnabled) {
1728
+ return Promise.reject();
1729
+ }
1730
+ if (!layout.isGlobalFullscreen) {
1731
+ // prettier-ignore
1732
+ return screenfull.request(layout.$container).then(function() {
1733
+ layout.isGlobalFullscreen = true;
1734
+ layout.emit('fullscreen:change', true, 'global');
1735
+ }).catch(function(err) {
1736
+ });
1737
+ } else {
1738
+ // prettier-ignore
1739
+ return screenfull.exit().then(function() {
1740
+ layout.isGlobalFullscreen = false;
1741
+ layout.emit('fullscreen:change', false, 'global');
1742
+ }).catch(function(err) {
1743
+ });
1744
+ }
1745
+ }
1746
+
1747
+ function _screenshot(layout, filename, format, quality, type, index) {
1748
+ var _layout_players__index_screenshot, _layout_players__index;
1749
+ if (index === undefined) index = layout.current;
1750
+ if (index < 1 || index > layout._totalScreens) {
1751
+ return;
1752
+ }
1753
+ var _index = index - 1; // 数组下标
1754
+ if (layout.players[_index]) return (_layout_players__index = layout.players[_index]) == null ? void 0 : (_layout_players__index_screenshot = _layout_players__index.screenshot) == null ? void 0 : _layout_players__index_screenshot.call(_layout_players__index, filename, format, quality, type);
1755
+ }
1756
+
1757
+ function _destroy(layout) {
1758
+ var _layout_players;
1759
+ // 销毁播放器
1760
+ if (((_layout_players = layout.players) == null ? void 0 : _layout_players.length) > 0) {
1761
+ layout.players.forEach(function(player, index) {
1762
+ if (player) layout.close(index + 1); // close 方法会销毁播放器并清理分屏数据
1763
+ });
1764
+ layout.players = [];
1765
+ }
1766
+ // 销毁所有控件
1767
+ if (layout.controls) {
1768
+ Object.keys(layout.controls).forEach(function(controlName) {
1769
+ return layout.controls[controlName].destroy();
1770
+ });
1771
+ layout.controls = null;
1772
+ }
1773
+ // 移除 screenfull 事件监听器
1774
+ if (screenfull.isEnabled && layout._fullscreenChangeHandler) {
1775
+ screenfull.off('change', layout._fullscreenChangeHandler);
1776
+ layout._fullscreenChangeHandler = null;
1777
+ }
1778
+ // 清理国际化
1779
+ if (layout.i18n) layout.i18n = null;
1780
+ // 移除所有事件监听器
1781
+ layout.removeAllListeners();
1782
+ // 清空容器
1783
+ layout.$container.innerHTML = '';
1784
+ }
1785
+
1786
+ /* eslint-disable @typescript-eslint/array-type */ /* eslint-disable @typescript-eslint/no-unsafe-argument */ /* eslint-disable @typescript-eslint/promise-function-async */ /* eslint-disable @typescript-eslint/no-explicit-any */ function _defineProperties(target, props) {
1787
+ for(var i = 0; i < props.length; i++){
1788
+ var descriptor = props[i];
1789
+ descriptor.enumerable = descriptor.enumerable || false;
1790
+ descriptor.configurable = true;
1791
+ if ("value" in descriptor) descriptor.writable = true;
1792
+ Object.defineProperty(target, descriptor.key, descriptor);
1793
+ }
1794
+ }
1795
+ function _create_class(Constructor, protoProps, staticProps) {
1796
+ if (protoProps) _defineProperties(Constructor.prototype, protoProps);
1797
+ return Constructor;
1798
+ }
1799
+ function _extends() {
1800
+ _extends = Object.assign || function(target) {
1801
+ for(var i = 1; i < arguments.length; i++){
1802
+ var source = arguments[i];
1803
+ for(var key in source){
1804
+ if (Object.prototype.hasOwnProperty.call(source, key)) {
1805
+ target[key] = source[key];
1806
+ }
1807
+ }
1808
+ }
1809
+ return target;
1810
+ };
1811
+ return _extends.apply(this, arguments);
1812
+ }
1813
+ function _inherits(subClass, superClass) {
1814
+ if (typeof superClass !== "function" && superClass !== null) {
1815
+ throw new TypeError("Super expression must either be null or a function");
1816
+ }
1817
+ subClass.prototype = Object.create(superClass && superClass.prototype, {
1818
+ constructor: {
1819
+ value: subClass,
1820
+ writable: true,
1821
+ configurable: true
1822
+ }
1823
+ });
1824
+ if (superClass) _set_prototype_of(subClass, superClass);
1825
+ }
1826
+ function _set_prototype_of(o, p) {
1827
+ _set_prototype_of = Object.setPrototypeOf || function setPrototypeOf(o, p) {
1828
+ o.__proto__ = p;
1829
+ return o;
1830
+ };
1831
+ return _set_prototype_of(o, p);
1832
+ }
1833
+ function _type_of(obj) {
1834
+ "@swc/helpers - typeof";
1835
+ return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
1836
+ }
1837
+ /**
1838
+ * 分屏布局组件
1839
+ * @remarks
1840
+ * 支持多种分屏模式、主题切换、国际化、全屏显示等功能
1841
+ * @example
1842
+ * ```typescript
1843
+ * import MultiScreen from '@ezuikit/player-multi-screen';
1844
+ * import '@ezuikit/player-multi-screen/style.css';
1845
+ * const layout = new MultiScreen('app', Player{
1846
+ * mode: 4,
1847
+ * theme: 'dark',
1848
+ * language: 'zh',
1849
+ * screens: [
1850
+ * { url: 'https://www.example.com/video.flv' },
1851
+ * { url: 'https://www.example.com/video.flv' }
1852
+ * ]
1853
+ * });
1854
+ * // 切换分屏模式
1855
+ * layout.setMode(9);
1856
+ * // 切换主题
1857
+ * layout.setTheme('light');
1858
+ * ```
1859
+ * @public
1860
+ */ var MultiScreen = /*#__PURE__*/ function(EventEmitter) {
1861
+ _inherits(MultiScreen, EventEmitter);
1862
+ function MultiScreen(containerID, Player, options) {
1863
+ var _this;
1864
+ var _this1;
1865
+ _this = EventEmitter.call(this) || this, /** 播放器实例数组 */ _this.players = [], /** 当前选中的分屏索引 */ _this._current = 0, // private _totalScreens = 4;
1866
+ _this._isGlobalFullscreenOp = false, /** 控件集合 */ _this.controls = {}, /** 填充模式 */ _this.scaleMode = 1, /** 音频模式 */ _this.audioMode = 'muted', /** 是否正在播放 */ _this.playing = false, /** 是网页全屏 */ _this.isWebFullscreen = false, /** 是全局全屏 */ _this.isGlobalFullscreen = false, /** 是否启用硬件解码 */ _this.enableHardwareDecoding = true, _this.language = 'zh', _this._delegations = [], _this._delegationsClose = [];
1867
+ // 初始化容器
1868
+ _this.$container = document.getElementById(containerID);
1869
+ _this.options = deepmerge.all([
1870
+ __EZ_SL_OPTIONS__,
1871
+ options
1872
+ ], {
1873
+ clone: false
1874
+ });
1875
+ _this._Player = Player;
1876
+ if (!_this.$container) throw new Error('Container not found');
1877
+ if (!_this._Player) ;
1878
+ // 初始化配置
1879
+ _this.mode = _this.options.mode || 4;
1880
+ _this.customLayout = _this.options.customLayout;
1881
+ _this.enableHardwareDecoding = _this.options.enableHardwareDecoding !== false;
1882
+ _this.language = [
1883
+ 'zh',
1884
+ 'en'
1885
+ ].includes(_this.options.language) ? _this.options.language : 'zh';
1886
+ if (((_this1 = options.screens || []) == null ? void 0 : _this1.length) < _this._totalScreens) {
1887
+ _this._screens = [].concat(options.screens || [], new Array(_this._totalScreens - (options.screens || []).length).fill(null));
1888
+ } else {
1889
+ _this._screens = options.screens || [];
1890
+ }
1891
+ _this.theme = _this.options.theme || 'dark';
1892
+ _this.showToolbar = _this.options.showToolbar !== false;
1893
+ _this.scaleMode = [
1894
+ 0,
1895
+ 1,
1896
+ 2
1897
+ ].includes(_this.options.scaleMode) ? _this.options.scaleMode : 1;
1898
+ _this.audioMode = [
1899
+ 'muted',
1900
+ 'all',
1901
+ 'selected'
1902
+ ].includes(_this.options.audioMode) ? _this.options.audioMode : 'muted';
1903
+ // 初始化国际化
1904
+ _this.i18n = new I18n(translations, {
1905
+ defaultLocale: _this.language
1906
+ });
1907
+ // 绑定事件回调
1908
+ if (options.onScreenClick) _this.on('screen:click', options.onScreenClick);
1909
+ if (options.onModeChange) _this.on('mode:change', options.onModeChange);
1910
+ if (options.onFullscreenChange) _this.on('fullscreen:change', options.onFullscreenChange);
1911
+ // 初始化UI
1912
+ _this._init();
1913
+ _this.current = 1;
1914
+ return _this;
1915
+ }
1916
+ var _proto = MultiScreen.prototype;
1917
+ /**
1918
+ * 初始化组件
1919
+ * @private
1920
+ */ _proto._init = function _init() {
1921
+ this.$container.classList.add(_EZ_SL_CLASS_PREFIX_);
1922
+ this.$container.setAttribute('data-theme', this.theme);
1923
+ // 创建分屏容器
1924
+ this.$screenContainer = document.createElement('div');
1925
+ this.$screenContainer.className = "" + _EZ_SL_CLASS_PREFIX_ + "_container";
1926
+ this.$container.appendChild(this.$screenContainer);
1927
+ // 创建工具栏
1928
+ if (this.showToolbar) {
1929
+ this.toolbar = document.createElement('div');
1930
+ this.toolbar.className = "" + _EZ_SL_CLASS_PREFIX_ + "_toolbar";
1931
+ this.$container.appendChild(this.toolbar);
1932
+ // 创建工具栏左右容器
1933
+ this.$toolbarLeft = document.createElement('div');
1934
+ this.$toolbarLeft.className = "" + _EZ_SL_CLASS_PREFIX_ + "_toolbar-left";
1935
+ this.toolbar.appendChild(this.$toolbarLeft);
1936
+ this.$toolbarRight = document.createElement('div');
1937
+ this.$toolbarRight.className = "" + _EZ_SL_CLASS_PREFIX_ + "_toolbar-right";
1938
+ this.toolbar.appendChild(this.$toolbarRight);
1939
+ // 初始化控件（在 UI 创建后）
1940
+ this._initControls(this.options);
1941
+ }
1942
+ // 渲染分屏
1943
+ this._renderScreens();
1944
+ // 监听全屏变化
1945
+ this._listenFullscreenChange();
1946
+ };
1947
+ /**
1948
+ * 初始化控件
1949
+ * @private
1950
+ */ _proto._initControls = function _initControls(options) {
1951
+ var _this = this;
1952
+ if (this.controls === null) this.controls = {};
1953
+ var leftControls = [].concat(LeftControls, options.plugins || []);
1954
+ // 处理左侧控件
1955
+ leftControls.forEach(function(ControlClass) {
1956
+ var controlName = camel.upperCamel(ControlClass.cname || '');
1957
+ var optionKey = "" + controlName + "Options";
1958
+ if (options[optionKey] !== null) {
1959
+ var control = new ControlClass({
1960
+ layout: _this,
1961
+ getPopupContainer: function() {
1962
+ return _this.$toolbarLeft;
1963
+ }
1964
+ });
1965
+ _this.controls[ControlClass.cname] = control;
1966
+ }
1967
+ });
1968
+ this._disabledControl();
1969
+ // 处理右侧控件
1970
+ RightControls.forEach(function(ControlClass) {
1971
+ var controlName = camel.upperCamel(ControlClass.cname || '');
1972
+ var optionKey = "" + controlName + "Options";
1973
+ if (options[optionKey] !== null) {
1974
+ var control = new ControlClass({
1975
+ layout: _this,
1976
+ getPopupContainer: function() {
1977
+ return _this.$toolbarRight;
1978
+ }
1979
+ });
1980
+ _this.controls[ControlClass.cname] = control;
1981
+ }
1982
+ });
1983
+ };
1984
+ /**
1985
+ * 渲染分屏列表
1986
+ * @private
1987
+ */ _proto._renderScreens = function _renderScreens() {
1988
+ var _this = this;
1989
+ var config = this.mode === 'custom' && this.customLayout ? this.customLayout : getLayoutConfig(this.mode);
1990
+ this.$screenContainer.style.gridTemplateColumns = "repeat(" + config.cols + ", 1fr)";
1991
+ this.$screenContainer.style.gridTemplateRows = "repeat(" + config.rows + ", 1fr)";
1992
+ var existingScreens = this.$screenContainer.querySelectorAll("." + _EZ_SL_CLASS_PREFIX_ + "_screen");
1993
+ // 复用或创建屏幕元素
1994
+ for(var i = 0; i < this._totalScreens; i++){
1995
+ var screen = this._screens[i] || {
1996
+ id: i
1997
+ };
1998
+ var screenEl = existingScreens[i];
1999
+ if (!screenEl) {
2000
+ // 创建新的屏幕元素
2001
+ screenEl = this._createScreenElement(screen, i);
2002
+ this.$screenContainer.appendChild(screenEl);
2003
+ }
2004
+ }
2005
+ if (this._totalScreens < existingScreens.length) this.current = 1;
2006
+ // 移除多余的屏幕元素
2007
+ for(var i1 = this._totalScreens; i1 < existingScreens.length; i1++){
2008
+ if (this.players[i1]) {
2009
+ var _this_players_i_destroy, _this_players_i;
2010
+ (_this_players_i = this.players[i1]) == null ? void 0 : (_this_players_i_destroy = _this_players_i.destroy) == null ? void 0 : _this_players_i_destroy.call(_this_players_i);
2011
+ this.players[i1] = null;
2012
+ }
2013
+ existingScreens[i1].remove();
2014
+ }
2015
+ if (this._delegations.length > 0) {
2016
+ this._delegations.forEach(function(delegation) {
2017
+ return delegation.destroy();
2018
+ });
2019
+ this._delegations = [];
2020
+ }
2021
+ // 只在首次渲染时绑定事件委托
2022
+ this._delegations = delegate(this.$screenContainer, "div." + _EZ_SL_CLASS_PREFIX_ + "_screen", 'click', function(event) {
2023
+ var index = parseInt(event.delegateTarget.dataset.index || '1', 10);
2024
+ _this.current = index;
2025
+ });
2026
+ if (this._delegationsClose.length > 0) {
2027
+ this._delegationsClose.forEach(function(delegation) {
2028
+ return delegation.destroy();
2029
+ });
2030
+ this._delegationsClose = [];
2031
+ }
2032
+ this._delegationsClose = delegate(this.$screenContainer, "div." + _EZ_SL_CLASS_PREFIX_ + "_screen-close", 'click', function(event) {
2033
+ var $parentEle = event.delegateTarget.parentElement;
2034
+ var index = parseInt($parentEle.dataset.index || '1', 10);
2035
+ _this.close(index);
2036
+ });
2037
+ var len = this._totalScreens;
2038
+ for(var i2 = 0; i2 < len; i2++){
2039
+ if (![
2040
+ null,
2041
+ undefined
2042
+ ].includes(this._screens[i2])) {
2043
+ if (!this.players[i2]) {
2044
+ this.players[i2] = this._initPlayer(_extends({
2045
+ scaleMode: this.scaleMode
2046
+ }, this._screens[i2], {
2047
+ id: "_screen_player_" + (i2 + 1)
2048
+ }));
2049
+ }
2050
+ } else {
2051
+ this.players[i2] = null;
2052
+ }
2053
+ }
2054
+ this._disabledControl();
2055
+ };
2056
+ _proto._disabledControl = function _disabledControl() {
2057
+ var _this = this;
2058
+ var isPlaying = this.players.some(function(player) {
2059
+ return player == null ? void 0 : player.playing;
2060
+ });
2061
+ __CAN_DISABLED_CONTROL__.forEach(function(key) {
2062
+ if (_this.controls[key]) _this.controls[key].disabled = !isPlaying;
2063
+ });
2064
+ };
2065
+ /**
2066
+ * 初始化播放器实例
2067
+ * @param playerOptions Player 播放器的配置
2068
+ * @returns 播放器实例
2069
+ * @example
2070
+ * ```typescript
2071
+ * const player = layout._initPlayer({
2072
+ * url: "https://example.com/video.flv",
2073
+ * // 其他播放器配置项...
2074
+ * });
2075
+ * ```
2076
+ */ _proto._initPlayer = function _initPlayer(playerOptions) {
2077
+ if (this._Player) {
2078
+ var _document_getElementById;
2079
+ var $idParentEle = (_document_getElementById = document.getElementById(playerOptions.id)) == null ? void 0 : _document_getElementById.parentElement;
2080
+ if ($idParentEle) {
2081
+ var _$placeholder_classList_add, _$placeholder_classList;
2082
+ var $placeholder = $idParentEle.querySelector("." + _EZ_SL_CLASS_PREFIX_ + "_screen-placeholder");
2083
+ $placeholder == null ? void 0 : (_$placeholder_classList = $placeholder.classList) == null ? void 0 : (_$placeholder_classList_add = _$placeholder_classList.add) == null ? void 0 : _$placeholder_classList_add.call(_$placeholder_classList, "" + _EZ_SL_CLASS_PREFIX_ + "_hide");
2084
+ }
2085
+ if ($idParentEle) {
2086
+ var _$placeholder_classList_remove, _$placeholder_classList1;
2087
+ var $placeholder1 = $idParentEle.querySelector("." + _EZ_SL_CLASS_PREFIX_ + "_screen-close");
2088
+ $placeholder1 == null ? void 0 : (_$placeholder_classList1 = $placeholder1.classList) == null ? void 0 : (_$placeholder_classList_remove = _$placeholder_classList1.remove) == null ? void 0 : _$placeholder_classList_remove.call(_$placeholder_classList1, "" + _EZ_SL_CLASS_PREFIX_ + "_hide");
2089
+ }
2090
+ var _playerOptions_muted;
2091
+ var muted = (_playerOptions_muted = playerOptions.muted) != null ? _playerOptions_muted : this.audioMode === 'all' ? false : this.audioMode === 'muted' ? true : this.audioMode !== 'selected';
2092
+ try {
2093
+ return new this._Player(_extends({}, playerOptions, {
2094
+ muted: muted,
2095
+ staticPath: './flv/',
2096
+ language: this.language || 'zh',
2097
+ useMSE: this.enableHardwareDecoding
2098
+ }));
2099
+ } catch (error) {
2100
+ return null;
2101
+ }
2102
+ } else {
2103
+ return null;
2104
+ }
2105
+ };
2106
+ /**
2107
+ * 创建单个分屏元素
2108
+ * @param screen - 分屏数据
2109
+ * @param index - 分屏索引
2110
+ * @returns 分屏 DOM 元素
2111
+ * @private
2112
+ */ _proto._createScreenElement = function _createScreenElement(screen, index) {
2113
+ var _this_i18n;
2114
+ var _index = index + 1;
2115
+ var el = document.createElement('div');
2116
+ el.className = "" + _EZ_SL_CLASS_PREFIX_ + "_screen";
2117
+ el.dataset.index = String(_index);
2118
+ // 序号
2119
+ var number = document.createElement('div');
2120
+ number.className = "" + _EZ_SL_CLASS_PREFIX_ + "_screen-number";
2121
+ number.textContent = String(_index);
2122
+ el.appendChild(number);
2123
+ var $player = document.createElement('div');
2124
+ $player.className = "" + _EZ_SL_CLASS_PREFIX_ + "_screen-player";
2125
+ $player.id = "_screen_player_" + _index;
2126
+ el.appendChild($player);
2127
+ var placeholder = String((_this_i18n = this.i18n) == null ? void 0 : _this_i18n.t('clickToSelect'));
2128
+ if (this.options.placeholder) placeholder = typeof this.options.placeholder === 'function' ? this.options.placeholder() : this.options.placeholder;
2129
+ if (placeholder !== null) {
2130
+ var _this_i18n1;
2131
+ // 仅当 placeholder 为 () => null 时才不显示占位元素
2132
+ var $placeholder = document.createElement('div');
2133
+ $placeholder.className = "" + _EZ_SL_CLASS_PREFIX_ + "_screen-placeholder";
2134
+ $placeholder.innerHTML = placeholder !== undefined ? placeholder : String((_this_i18n1 = this.i18n) == null ? void 0 : _this_i18n1.t('clickToSelect'));
2135
+ el.appendChild($placeholder);
2136
+ }
2137
+ // close
2138
+ var $close = document.createElement('div');
2139
+ $close.className = _EZ_SL_CLASS_PREFIX_ + "_screen-close " + _EZ_SL_CLASS_PREFIX_ + "_hide";
2140
+ $close.innerHTML = ICONS.close();
2141
+ el.appendChild($close);
2142
+ return el;
2143
+ };
2144
+ /**
2145
+ * 选中指定分屏
2146
+ * @param index - 分屏索引
2147
+ * @private
2148
+ */ _proto._selectScreen = function _selectScreen(index) {
2149
+ var _this = this;
2150
+ // 取消之前的选中
2151
+ if (this._current >= 1) {
2152
+ var els = this.$screenContainer.querySelectorAll("." + _EZ_SL_CLASS_PREFIX_ + "_screen-selected");
2153
+ if (els.length > 0) {
2154
+ els.forEach(function(el) {
2155
+ return el.classList.remove("" + _EZ_SL_CLASS_PREFIX_ + "_screen-selected");
2156
+ });
2157
+ }
2158
+ }
2159
+ var el = this.$screenContainer.querySelector('[data-index="' + index + '"]');
2160
+ el == null ? void 0 : el.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "_screen-selected");
2161
+ if (this.audioMode === 'selected') {
2162
+ (this.players || []).forEach(function(player, index) {
2163
+ if (player) {
2164
+ if (index === _this.current - 1) player.muted = false;
2165
+ else player.muted = true;
2166
+ }
2167
+ });
2168
+ }
2169
+ var screen = this._screens[index] || {
2170
+ id: index
2171
+ };
2172
+ this.emit('screen:click', index, screen);
2173
+ };
2174
+ /**
2175
+ * 获取国际化翻译文本
2176
+ * @param key - 翻译键
2177
+ * @returns 翻译后的文本
2178
+ */ _proto.t = function t(key) {
2179
+ var _this_i18n;
2180
+ return String(((_this_i18n = this.i18n) == null ? void 0 : _this_i18n.t(key)) || key);
2181
+ };
2182
+ /**
2183
+ * 设置分屏模式
2184
+ * @param mode - 分屏模式（预设模式或自定义布局配置）
2185
+ * @fires mode:change - 当模式变化时触发
2186
+ * @example
2187
+ * ```typescript
2188
+ * // 使用预设模式
2189
+ * layout.setMode(9); // 切换为 9 分屏
2190
+ * // 使用自定义布局
2191
+ * layout.setMode({ rows: 3, cols: 5 }); // 自定义 3x5 布局 mode 为 'custom'
2192
+ * ```
2193
+ */ _proto.setMode = function setMode(mode) {
2194
+ // 判断是否为自定义布局
2195
+ if ((typeof mode === "undefined" ? "undefined" : _type_of(mode)) === 'object' && 'rows' in mode && 'cols' in mode) {
2196
+ this.mode = 'custom';
2197
+ this.customLayout = mode;
2198
+ this._renderScreens();
2199
+ this.emit('mode:change', 'custom');
2200
+ } else {
2201
+ this.mode = mode;
2202
+ this._renderScreens();
2203
+ this.emit('mode:change', mode);
2204
+ }
2205
+ if (this.controls['mode']) {
2206
+ this.controls['mode'].setMode(this.mode);
2207
+ }
2208
+ };
2209
+ /**
2210
+ * 设置分屏数据
2211
+ * @param screen - 分屏数据数
2212
+ * @param index - 分屏索引(从1开始)（可选），默认当前选中的分屏索引(从1开始)
2213
+ * @example
2214
+ * ```typescript
2215
+ * layout.setScreen({
2216
+ * url: "https://example.com/video.flv"
2217
+ * });
2218
+ * ```
2219
+ */ _proto.setScreen = function setScreen(screen, index) {
2220
+ var _this = this;
2221
+ if (index === undefined) index = this.current;
2222
+ if (index < 1 || index > this._totalScreens) {
2223
+ return;
2224
+ }
2225
+ var _index = index - 1; // 数组下标
2226
+ if (this.players[_index]) {
2227
+ var // 不对 screen 数据进行对比， 每次都重新创建播放器实例， 以确保播放器状态与 screen 数据完全一致
2228
+ _this_players__index_destroy, _this_players__index;
2229
+ (_this_players__index = this.players[_index]) == null ? void 0 : (_this_players__index_destroy = _this_players__index.destroy) == null ? void 0 : _this_players__index_destroy.call(_this_players__index);
2230
+ this.players[_index] = null;
2231
+ }
2232
+ this._screens[_index] = _extends({}, screen, {
2233
+ id: "_screen_player_" + index
2234
+ });
2235
+ setTimeout(function() {
2236
+ _this.players[_index] = _this._initPlayer(_extends({}, screen, {
2237
+ id: "_screen_player_" + index
2238
+ }));
2239
+ _this._disabledControl();
2240
+ }, 0);
2241
+ };
2242
+ /**
2243
+ * 关闭指定分屏, 删除对应分屏数据（不可恢复）
2244
+ * @param index - 分屏索引(从1开始)（可选），默认当前选中的分屏索引(从1开始)
2245
+ * @example
2246
+ * ```typescript
2247
+ * layout.close(1); // 关闭第 1 分屏
2248
+ * ```
2249
+ */ _proto.close = function close(index) {
2250
+ if (index === undefined) index = this.current;
2251
+ if (index < 1 || index > this._totalScreens) {
2252
+ return;
2253
+ }
2254
+ var _index = index - 1; // 数组下标
2255
+ this._screens[_index] = null;
2256
+ if (this.players[_index]) {
2257
+ var _this_players__index_destroy, _this_players__index;
2258
+ (_this_players__index = this.players[_index]) == null ? void 0 : (_this_players__index_destroy = _this_players__index.destroy) == null ? void 0 : _this_players__index_destroy.call(_this_players__index);
2259
+ this.players[_index] = null;
2260
+ }
2261
+ var $parentEle = this.$screenContainer.querySelector('[data-index="' + index + '"]');
2262
+ if ($parentEle) {
2263
+ var _$parentEle_querySelector, _$parentEle_querySelector_classList_remove, _$parentEle_querySelector_classList, _$parentEle_querySelector1;
2264
+ (_$parentEle_querySelector = $parentEle.querySelector("." + _EZ_SL_CLASS_PREFIX_ + "_screen-close")) == null ? void 0 : _$parentEle_querySelector.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "_hide");
2265
+ (_$parentEle_querySelector1 = $parentEle.querySelector("." + _EZ_SL_CLASS_PREFIX_ + "_screen-placeholder")) == null ? void 0 : (_$parentEle_querySelector_classList = _$parentEle_querySelector1.classList) == null ? void 0 : (_$parentEle_querySelector_classList_remove = _$parentEle_querySelector_classList.remove) == null ? void 0 : _$parentEle_querySelector_classList_remove.call(_$parentEle_querySelector_classList, "" + _EZ_SL_CLASS_PREFIX_ + "_hide");
2266
+ }
2267
+ this._disabledControl();
2268
+ };
2269
+ /**
2270
+ * 设置主题模式
2271
+ * @param theme - 主题（'light' 或 'dark'）
2272
+ * @fires theme:change - 当主题变化时触发
2273
+ * @example
2274
+ * ```typescript
2275
+ * layout.setTheme('light');
2276
+ * ```
2277
+ */ _proto.setTheme = function setTheme(theme) {
2278
+ this.theme = theme;
2279
+ this.$container.setAttribute('data-theme', theme);
2280
+ this.emit('theme:change', theme);
2281
+ };
2282
+ /**
2283
+ * 切换网页全屏模式
2284
+ * @returns Promise - 全屏操作结果
2285
+ * @example
2286
+ * ```typescript
2287
+ * layout.toggleWebFullscreen();
2288
+ * ```
2289
+ */ _proto.toggleWebFullscreen = function toggleWebFullscreen() {
2290
+ var _this = this;
2291
+ return _toggleWebFullscreen(this).then(function() {
2292
+ var _this_controls_webFullscreen_update, _this_controls_webFullscreen;
2293
+ (_this_controls_webFullscreen = _this.controls.webFullscreen) == null ? void 0 : (_this_controls_webFullscreen_update = _this_controls_webFullscreen.update) == null ? void 0 : _this_controls_webFullscreen_update.call(_this_controls_webFullscreen);
2294
+ });
2295
+ };
2296
+ /**
2297
+ * 切换全局`全屏模式
2298
+ * @returns Promise - 全屏操作结果
2299
+ * @example
2300
+ * ```typescript
2301
+ * layout.toggleFullscreen();
2302
+ * ```
2303
+ */ _proto.toggleFullscreen = function toggleFullscreen() {
2304
+ this._isGlobalFullscreenOp = true;
2305
+ return _toggleGlobalFullscreen(this);
2306
+ };
2307
+ /**
2308
+ * 全部播放
2309
+ * @param index - 窗口索引(从1开始)，不传则全部播放
2310
+ */ _proto.play = function play(index) {
2311
+ var list = this._getPlayers(index);
2312
+ if (list.length > 0) {
2313
+ list.forEach(function(player) {
2314
+ if (player) player.play == null ? void 0 : player.play.call(player);
2315
+ });
2316
+ }
2317
+ };
2318
+ /**
2319
+ * 全部暂停
2320
+ * @param index - 窗口索引(从1开始)，不传则全部暂停
2321
+ */ _proto.pause = function pause(index) {
2322
+ var list = this._getPlayers(index);
2323
+ if (list.length > 0) {
2324
+ list.forEach(function(player) {
2325
+ if (player) player.pause == null ? void 0 : player.pause.call(player);
2326
+ });
2327
+ }
2328
+ };
2329
+ /**
2330
+ * 指定窗口静音或取消静音
2331
+ * @param {boolean} muted - 是否静音
2332
+ * @param {number=} index - 窗口索引(从1开始)，空值默认所有窗口
2333
+ */ _proto.muted = function muted(muted, index) {
2334
+ if (muted === void 0) muted = true;
2335
+ var list = this._getPlayers(index);
2336
+ if (list.length > 0) {
2337
+ list.forEach(function(player) {
2338
+ if (player) player.muted = muted;
2339
+ });
2340
+ }
2341
+ // 这里仅做全部静音和全部取消静音状态同步
2342
+ if (index === undefined && this.controls[Settings.cname]) {
2343
+ var _this_controls_Settings_cname__settingsPanel_setAudioMode, _this_controls_Settings_cname__settingsPanel, _this_controls_Settings_cname;
2344
+ (_this_controls_Settings_cname = this.controls[Settings.cname]) == null ? void 0 : (_this_controls_Settings_cname__settingsPanel = _this_controls_Settings_cname._settingsPanel) == null ? void 0 : (_this_controls_Settings_cname__settingsPanel_setAudioMode = _this_controls_Settings_cname__settingsPanel.setAudioMode) == null ? void 0 : _this_controls_Settings_cname__settingsPanel_setAudioMode.call(_this_controls_Settings_cname__settingsPanel, muted ? 'muted' : 'all');
2345
+ }
2346
+ };
2347
+ /**
2348
+ * @description 截图，调用后弹出下载框保存截图
2349
+ * @param {string=} filename 保存的文件名, 默认 时间戳
2350
+ * @param {string=} format 截图的格式，可选png或jpeg或者webp ,默认 png
2351
+ * @param {number=} quality 当格式是jpeg或者webp时，压缩质量，取值0 ~ 1 ,默认 0.92
2352
+ * @param {("download" | "base64" | "blob")=} type download,base64,blob, 默认download
2353
+ * @param {number=} index - 窗口索引(从1开始)，空值默认当前选中窗口
2354
+ *
2355
+ * @returns {string | Blob | undefined} undefined 代表截图失败
2356
+ * @example
2357
+ * ```ts
2358
+ * player.screenshot()
2359
+ * player.screenshot("filename", "jpeg", 0.7, "download")
2360
+ * ```
2361
+ */ _proto.screenshot = function screenshot(filename, format, quality, type, index) {
2362
+ if (format === void 0) format = 'png';
2363
+ if (quality === void 0) quality = 0.92;
2364
+ if (type === void 0) type = 'download';
2365
+ return _screenshot(this, filename, format, quality, type, index);
2366
+ };
2367
+ /**
2368
+ * 设置视频画面缩放模式
2369
+ * @param {0 | 1 | 2} scaleMode - 缩放模式， 0: 窗口铺满， 1: 等比缩放大边铺满， 2: 等比缩放小边铺满
2370
+ * @param {number=} index - 窗口索引(从1开始)，空值默认所有窗口
2371
+ */ _proto.setScaleMode = function setScaleMode(scaleMode, index) {
2372
+ if ([
2373
+ 0,
2374
+ 1,
2375
+ 2
2376
+ ].includes(scaleMode)) {
2377
+ this.scaleMode = scaleMode;
2378
+ var list = this._getPlayers(index);
2379
+ if (list.length > 0) {
2380
+ list.forEach(function(player) {
2381
+ if (player) player.setScaleMode == null ? void 0 : player.setScaleMode.call(player, scaleMode);
2382
+ });
2383
+ }
2384
+ }
2385
+ };
2386
+ /**
2387
+ * 设置视频画面缩放模式
2388
+ * @param {SettingsPanelOptions['audioMode']} audioMode - 音频模式 selected: 选中的有声音 all: 所有窗口都有声音 muted: 所有窗口都静音
2389
+ */ _proto.setAudioMode = function setAudioMode(audioMode) {
2390
+ var _this = this;
2391
+ if ([
2392
+ 'selected',
2393
+ 'all',
2394
+ 'muted'
2395
+ ].includes(audioMode)) {
2396
+ this.audioMode = audioMode;
2397
+ switch(audioMode){
2398
+ case 'muted':
2399
+ this.muted(true);
2400
+ break;
2401
+ case 'all':
2402
+ this.muted(false);
2403
+ break;
2404
+ case 'selected':
2405
+ (this.players || []).forEach(function(player, index) {
2406
+ if (player) {
2407
+ if (index === _this.current - 1) player.muted = false;
2408
+ else player.muted = true;
2409
+ }
2410
+ });
2411
+ break;
2412
+ }
2413
+ // 这里仅做 全部静音和全部取消静音状态同步
2414
+ if (this.controls[Settings.cname]) {
2415
+ var _this_controls_Settings_cname__settingsPanel_setAudioMode, _this_controls_Settings_cname__settingsPanel, _this_controls_Settings_cname;
2416
+ (_this_controls_Settings_cname = this.controls[Settings.cname]) == null ? void 0 : (_this_controls_Settings_cname__settingsPanel = _this_controls_Settings_cname._settingsPanel) == null ? void 0 : (_this_controls_Settings_cname__settingsPanel_setAudioMode = _this_controls_Settings_cname__settingsPanel.setAudioMode) == null ? void 0 : _this_controls_Settings_cname__settingsPanel_setAudioMode.call(_this_controls_Settings_cname__settingsPanel, audioMode);
2417
+ }
2418
+ }
2419
+ };
2420
+ /**
2421
+ * 重新调整播放器窗口大小
2422
+ *
2423
+ * Adjust the player window size
2424
+ * @param {number | string} width 宽度（容器的宽度，支持 CSS 单位或数字（px））
2425
+ * @param {number | string} height 高度（容器的高度，支持 CSS 单位或数字（px））
2426
+ * @example
2427
+ * ```ts
2428
+ * layout.resize(600, 400) // 600px * 400px
2429
+ * layout.resize("600px", "400px") // 600px * 400px
2430
+ * layout.resize("50%", "1vh")
2431
+ * layout.resize("2em", "2rem")
2432
+ * ```
2433
+ */ _proto.resize = function resize(width, height) {
2434
+ _resize(this, width, height);
2435
+ };
2436
+ /**
2437
+ * 销毁组件实例
2438
+ * @remarks
2439
+ * 清理所有事件监听器和 DOM 元素
2440
+ * @example
2441
+ * ```typescript
2442
+ * layout.destroy();
2443
+ * ```
2444
+ */ _proto.destroy = function destroy() {
2445
+ _destroy(this);
2446
+ };
2447
+ /**
2448
+ * @param {number=} index - 窗口索引(从1开始)，空值默认所有窗口
2449
+ */ _proto._getPlayers = function _getPlayers(index) {
2450
+ if (index === undefined || index === null) {
2451
+ return this.players;
2452
+ } else if (index >= 1 && index <= this.players.length) {
2453
+ if (this.players[index - 1]) {
2454
+ return [
2455
+ this.players[index - 1]
2456
+ ];
2457
+ }
2458
+ } else ;
2459
+ return [];
2460
+ };
2461
+ /**
2462
+ * 监听全屏状态变化
2463
+ * @private
2464
+ */ _proto._listenFullscreenChange = function _listenFullscreenChange() {
2465
+ var _this = this;
2466
+ if (!screenfull.isEnabled) return;
2467
+ // 不支持外部实现当前节点全屏， 不做处理， 如果想做请参考 theme 的全屏实现
2468
+ this._fullscreenChangeHandler = function() {
2469
+ if (_this._isGlobalFullscreenOp) {
2470
+ var _this_controls_fullscreen;
2471
+ _this._isGlobalFullscreenOp = false;
2472
+ _this.emit('fullscreen:change', false, 'global');
2473
+ if (_this.isGlobalFullscreen) {
2474
+ _this.$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "_fullscreen");
2475
+ } else {
2476
+ _this.$container.classList.remove("" + _EZ_SL_CLASS_PREFIX_ + "_fullscreen");
2477
+ }
2478
+ if ((_this_controls_fullscreen = _this.controls.fullscreen) == null ? void 0 : _this_controls_fullscreen.update) _this.controls.fullscreen.update();
2479
+ } else if (!screenfull.isFullscreen && _this.isGlobalFullscreen) {
2480
+ var _this_controls_fullscreen1;
2481
+ // 退出
2482
+ _this.isGlobalFullscreen = false;
2483
+ if (_this.isGlobalFullscreen) {
2484
+ _this.$container.classList.add("" + _EZ_SL_CLASS_PREFIX_ + "_fullscreen");
2485
+ } else {
2486
+ _this.$container.classList.remove("" + _EZ_SL_CLASS_PREFIX_ + "_fullscreen");
2487
+ }
2488
+ if ((_this_controls_fullscreen1 = _this.controls.fullscreen) == null ? void 0 : _this_controls_fullscreen1.update) _this.controls.fullscreen.update();
2489
+ }
2490
+ };
2491
+ screenfull.on('change', this._fullscreenChangeHandler);
2492
+ };
2493
+ _create_class(MultiScreen, [
2494
+ {
2495
+ key: "_totalScreens",
2496
+ get: function get() {
2497
+ var config = this.mode === 'custom' && this.customLayout ? this.customLayout : getLayoutConfig(this.mode);
2498
+ return config.rows * config.cols;
2499
+ }
2500
+ },
2501
+ {
2502
+ key: "current",
2503
+ get: function get() {
2504
+ return this._current;
2505
+ },
2506
+ set: function set(index) {
2507
+ // 防止多次操作
2508
+ if (this._current === index) return;
2509
+ this._current = index;
2510
+ this._selectScreen(index);
2511
+ }
2512
+ }
2513
+ ]);
2514
+ return MultiScreen;
2515
+ }(EventEmitter);
2516
+ /** 事件常量 */ MultiScreen.EVENTS = EVENTS;
2517
+
2518
+ /* eslint-disable @typescript-eslint/no-explicit-any */ var AbstractPlayer = function AbstractPlayer(options) {
2519
+ this.options = options;
2520
+ };
2521
+
2522
+ exports.AbstractPlayer = AbstractPlayer;
2523
+ exports.Control = Control;
2524
+ exports.Fullscreen = Fullscreen;
2525
+ exports.LeftControls = LeftControls;
2526
+ exports.Mode = Mode;
2527
+ exports.Muted = Muted;
2528
+ exports.Play = Play;
2529
+ exports.RightControls = RightControls;
2530
+ exports.Screenshot = Screenshot;
2531
+ exports.Settings = Settings;
2532
+ exports.SettingsPanel = SettingsPanel;
2533
+ exports.WebFullscreen = WebFullscreen;
2534
+ exports.__CAN_DISABLED_CONTROL__ = __CAN_DISABLED_CONTROL__;
2535
+ exports.default = MultiScreen;