@ezuikit/player-theme 3.1.0-beta.5 → 3.1.1-beta.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/constant.js +2 -2
- package/dist/index.cjs +171 -80
- package/dist/index.esm.js +171 -80
- package/dist/index.umd.js +210 -184
- package/dist/style.js +2 -2
- package/dist/types/index.d.ts +76 -41
- package/package.json +12 -15
package/dist/index.esm.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*
|
|
2
|
-
* @ezuikit/player-theme v3.1.
|
|
3
|
-
* Copyright (c) 2026-07-
|
|
2
|
+
* @ezuikit/player-theme v3.1.1-beta.2
|
|
3
|
+
* Copyright (c) 2026-07-30 01:56:43 Ezviz-OpenBiz
|
|
4
4
|
* Released under the MIT License.
|
|
5
5
|
*/
|
|
6
6
|
import EventEmitter from 'eventemitter3';
|
|
@@ -952,7 +952,11 @@ var MESSAGE_DEFAULT_OPTIONS = {};
|
|
|
952
952
|
if (duration === void 0) duration = 2;
|
|
953
953
|
this._toast(msg, 'warn', duration);
|
|
954
954
|
};
|
|
955
|
-
|
|
955
|
+
/**
|
|
956
|
+
* toast 错误消息(渲染在 rootContainer 上的浮层)
|
|
957
|
+
* @param {string} msg 消息内容
|
|
958
|
+
* @param {number} duration 自动关闭延时,单位秒, 默认 2s 后关闭
|
|
959
|
+
*/ _proto.toastError = function toastError(msg, duration) {
|
|
956
960
|
if (duration === void 0) duration = 2;
|
|
957
961
|
this._toast(msg, 'error', duration);
|
|
958
962
|
};
|
|
@@ -1792,7 +1796,7 @@ var VOLUME_DEFAULT_OPTIONS = {
|
|
|
1792
1796
|
tagName: 'span',
|
|
1793
1797
|
classNameSuffix: 'volume',
|
|
1794
1798
|
controlType: 'button'
|
|
1795
|
-
})) || this, _this._muted = false, _this._volume = 0, /** 用来记录静音前的音量 */ _this._lastVolume = 0, _this._progress = null;
|
|
1799
|
+
})) || this, _this._muted = false, _this._volume = 0, /** 用来记录静音前的音量 */ _this._lastVolume = 0, /** 音量进度条实例 @private */ _this._progress = null;
|
|
1796
1800
|
_this._options = deepmerge(VOLUME_DEFAULT_OPTIONS, options, {
|
|
1797
1801
|
clone: false
|
|
1798
1802
|
});
|
|
@@ -2494,7 +2498,7 @@ function _set_prototype_of$s(o, p) {
|
|
|
2494
2498
|
tagName: 'span',
|
|
2495
2499
|
classNameSuffix: 'fullscreen',
|
|
2496
2500
|
controlType: 'button'
|
|
2497
|
-
}, options)) || this, _this.isCurrentFullscreen = false;
|
|
2501
|
+
}, options)) || this, /** 当前是否处于全屏状态 */ _this.isCurrentFullscreen = false;
|
|
2498
2502
|
_this.options = options;
|
|
2499
2503
|
_this.isCurrentFullscreen = !!((_options_props = options.props) == null ? void 0 : _options_props.isCurrentFullscreen);
|
|
2500
2504
|
_this._$rootContainer = (_this_options = _this.options) == null ? void 0 : _this_options.rootContainer;
|
|
@@ -2610,14 +2614,19 @@ function _set_prototype_of$r(o, p) {
|
|
|
2610
2614
|
return _this;
|
|
2611
2615
|
}
|
|
2612
2616
|
var _proto = Rec.prototype;
|
|
2613
|
-
|
|
2617
|
+
/**
|
|
2618
|
+
* 销毁
|
|
2619
|
+
*/ _proto.destroy = function destroy() {
|
|
2614
2620
|
var _this__delegation;
|
|
2615
2621
|
this.$container.removeEventListener('dblclick', this._onDBlClick);
|
|
2616
2622
|
(_this__delegation = this._delegation) == null ? void 0 : _this__delegation.destroy();
|
|
2617
2623
|
this._delegation = null;
|
|
2618
2624
|
Control.prototype.destroy.call(this);
|
|
2619
2625
|
};
|
|
2620
|
-
|
|
2626
|
+
/**
|
|
2627
|
+
* 添加回放类型图标
|
|
2628
|
+
* @param {string} id 回放类型 'rec' | 'cloudRec' | 'cloudRecord'
|
|
2629
|
+
*/ _proto.addRecType = function addRecType(id) {
|
|
2621
2630
|
var spanIcon = '';
|
|
2622
2631
|
switch(id){
|
|
2623
2632
|
case 'rec':
|
|
@@ -5119,7 +5128,12 @@ function _ts_generator$6(thisArg, body) {
|
|
|
5119
5128
|
};
|
|
5120
5129
|
}
|
|
5121
5130
|
}
|
|
5122
|
-
|
|
5131
|
+
/**
|
|
5132
|
+
* 获取开放平台轻应用模板数据
|
|
5133
|
+
* @param theme
|
|
5134
|
+
* @param id 开放平台轻应用模板id (https://open.ys7.com/console/ezuikit/template.html)
|
|
5135
|
+
* @returns
|
|
5136
|
+
*/ function getThemeDataByTemplate(theme, id) {
|
|
5123
5137
|
return _async_to_generator$6(function() {
|
|
5124
5138
|
var _theme_options_token_httpToken, _theme_options_token, url;
|
|
5125
5139
|
return _ts_generator$6(this, function(_state) {
|
|
@@ -5428,7 +5442,8 @@ function _filterLeftRightControls(btnList) {
|
|
|
5428
5442
|
}
|
|
5429
5443
|
/**
|
|
5430
5444
|
* 获取主题数据 (主题优先级: template > themeDate)
|
|
5431
|
-
* @param
|
|
5445
|
+
* @param theme 主题实例
|
|
5446
|
+
* @param data 主题数据或模板id(萤石开放平台轻应用32位模板字符串)或模板名称
|
|
5432
5447
|
* @returns
|
|
5433
5448
|
*/ function getThemeData(theme, data) {
|
|
5434
5449
|
return _async_to_generator$5(function() {
|
|
@@ -9720,6 +9735,97 @@ var _renderRecType = function(theme, container, recType, props) {
|
|
|
9720
9735
|
if ((_theme_controls1 = theme.controls) == null ? void 0 : _theme_controls1['recControl']) ((_theme_controls2 = theme.controls) == null ? void 0 : _theme_controls2['recControl']).addRecType(recType);
|
|
9721
9736
|
};
|
|
9722
9737
|
|
|
9738
|
+
/**
|
|
9739
|
+
* 布局溢出(More 收纳)与响应式尺寸分档的**纯函数**模块。
|
|
9740
|
+
*
|
|
9741
|
+
* @remarks
|
|
9742
|
+
* 这些函数只做「计算 / 判定」,不含任何 DOM 副作用,因此可以在没有布局引擎的环境(如 jsdom)
|
|
9743
|
+
* 中被完整单元测试。`theme.ts` 中的命令式外壳(读取 `clientWidth`、增删 class、创建 More、
|
|
9744
|
+
* 搬移控件)负责副作用,具体的判定逻辑全部下沉到这里。
|
|
9745
|
+
*/ /**
|
|
9746
|
+
* 一次 classList 变更集合:需要添加与需要移除的类名。
|
|
9747
|
+
*/ /**
|
|
9748
|
+
* 根据尺寸计算某一维度(宽或高)需要增删的响应式档位类名。
|
|
9749
|
+
*
|
|
9750
|
+
* 档位规则:
|
|
9751
|
+
* - `(280, 375]` → medium
|
|
9752
|
+
* - `(200, 280]` → small
|
|
9753
|
+
* - `<= 200` → mini
|
|
9754
|
+
* - 其它(> 375)→ 无档位(移除全部)
|
|
9755
|
+
*
|
|
9756
|
+
* @param size 尺寸(px)
|
|
9757
|
+
* @param axis `'width'` 或 `'height'`
|
|
9758
|
+
* @param prefix 类名前缀(如 `ezplayer`)
|
|
9759
|
+
*/ function computeDimensionClasses(size, axis, prefix) {
|
|
9760
|
+
var medium = prefix + "-medium-" + axis;
|
|
9761
|
+
var small = prefix + "-small-" + axis;
|
|
9762
|
+
var mini = prefix + "-mini-" + axis;
|
|
9763
|
+
var add = [];
|
|
9764
|
+
var remove = [];
|
|
9765
|
+
if (size > 280 && size <= 375) {
|
|
9766
|
+
add.push(medium);
|
|
9767
|
+
remove.push(small, mini);
|
|
9768
|
+
} else if (size > 200 && size <= 280) {
|
|
9769
|
+
add.push(small);
|
|
9770
|
+
remove.push(medium, mini);
|
|
9771
|
+
} else {
|
|
9772
|
+
if (size <= 200) {
|
|
9773
|
+
add.push(mini);
|
|
9774
|
+
} else {
|
|
9775
|
+
remove.push(mini);
|
|
9776
|
+
}
|
|
9777
|
+
remove.push(small, medium);
|
|
9778
|
+
}
|
|
9779
|
+
return {
|
|
9780
|
+
add: add,
|
|
9781
|
+
remove: remove
|
|
9782
|
+
};
|
|
9783
|
+
}
|
|
9784
|
+
/**
|
|
9785
|
+
* 计算宽、高两个维度的响应式档位类名增删集合。
|
|
9786
|
+
* @param width 容器宽度(px)
|
|
9787
|
+
* @param height 容器高度(px)
|
|
9788
|
+
* @param prefix 类名前缀
|
|
9789
|
+
*/ function computeSizeClasses(width, height, prefix) {
|
|
9790
|
+
var w = computeDimensionClasses(width, 'width', prefix);
|
|
9791
|
+
var h = computeDimensionClasses(height, 'height', prefix);
|
|
9792
|
+
return {
|
|
9793
|
+
add: [].concat(w.add, h.add),
|
|
9794
|
+
remove: [].concat(w.remove, h.remove)
|
|
9795
|
+
};
|
|
9796
|
+
}
|
|
9797
|
+
/**
|
|
9798
|
+
* header 左右控件宽度之和 + 30 是否超过容器宽度 —— 超过则需要显示 More。
|
|
9799
|
+
*/ function shouldShowHeaderMore(width, leftWidth, rightWidth) {
|
|
9800
|
+
return leftWidth + rightWidth + 30 > width;
|
|
9801
|
+
}
|
|
9802
|
+
/**
|
|
9803
|
+
* header 剩余空间是否 > 100 —— 足够则可以移除 More,把控件放回工具栏。
|
|
9804
|
+
*/ function shouldRemoveHeaderMore(width, leftWidth, rightWidth) {
|
|
9805
|
+
return width - leftWidth - rightWidth > 100;
|
|
9806
|
+
}
|
|
9807
|
+
/**
|
|
9808
|
+
* footer 剩余空间是否 < 16 —— 不足则需要把控件收拢进 More。
|
|
9809
|
+
*/ function shouldCollapseFooter(width, leftWidth, rightWidth) {
|
|
9810
|
+
return width - leftWidth - rightWidth < 16;
|
|
9811
|
+
}
|
|
9812
|
+
/**
|
|
9813
|
+
* footer 从 More 中释放控件时的展开阈值。
|
|
9814
|
+
*
|
|
9815
|
+
* 基准为 50;当 More 中已有控件时,加上首个控件宽度(保持与历史实现一致的运算与兜底:
|
|
9816
|
+
* `50 + firstItemWidth || 0`)。
|
|
9817
|
+
* @param firstItemWidth More 列表中第一个控件的宽度;未提供表示 More 为空。
|
|
9818
|
+
*/ function computeFooterExpandOffset(firstItemWidth) {
|
|
9819
|
+
var base = 50;
|
|
9820
|
+
if (firstItemWidth === undefined) return base;
|
|
9821
|
+
return base + firstItemWidth || 0;
|
|
9822
|
+
}
|
|
9823
|
+
/**
|
|
9824
|
+
* footer 剩余空间是否足够把一个控件从 More 释放回工具栏。
|
|
9825
|
+
*/ function shouldExpandFooter(width, leftWidth, rightWidth, offset) {
|
|
9826
|
+
return width - leftWidth - rightWidth > offset;
|
|
9827
|
+
}
|
|
9828
|
+
|
|
9723
9829
|
/* eslint-disable @typescript-eslint/no-non-null-assertion */ function _array_like_to_array(arr, len) {
|
|
9724
9830
|
if (len == null || len > arr.length) len = arr.length;
|
|
9725
9831
|
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
|
|
@@ -9973,7 +10079,7 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
9973
10079
|
_inherits(Theme, EventEmitter);
|
|
9974
10080
|
function Theme(options) {
|
|
9975
10081
|
var _this;
|
|
9976
|
-
var _this_options_volumeOptions, _this_options_volumeOptions1, _this_options_speedOptions, _this_options, _this_options1
|
|
10082
|
+
var _this_options_volumeOptions, _this_options_volumeOptions1, _this_options_speedOptions, _this_options, _this_options1;
|
|
9977
10083
|
_this = EventEmitter.call(this) || this, /** 播放器配置项 */ _this.options = THEME_DEFAULT_OPTIONS, _this.staticPath = '', /** 所有控件列表, 所有控件名称规则(`${iconId}Control`), 如音量控件 this.controls["volumeControl"] @since 0.0.1 */ _this.controls = {}, /**
|
|
9978
10084
|
* @since 0.0.1
|
|
9979
10085
|
* @private
|
|
@@ -10053,16 +10159,31 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10053
10159
|
_this._headerMoreControlShow = debounce(_this._headerMoreControlShow.bind(_this), 200);
|
|
10054
10160
|
_this._footerMoreControlShow = debounce(_this._footerMoreControlShow.bind(_this), 200);
|
|
10055
10161
|
_this.destroyed = false;
|
|
10056
|
-
|
|
10057
|
-
//
|
|
10058
|
-
//
|
|
10059
|
-
|
|
10060
|
-
|
|
10061
|
-
|
|
10162
|
+
// 标准流暂时仅支持 TEMPLATES 中的配置,多余的展示不生效(如电子放大等),待版本更新后才能支持。
|
|
10163
|
+
//
|
|
10164
|
+
// 下面根据播放类型决定初始渲染使用的「主题数据 / 模板」,规则如下:
|
|
10165
|
+
// 关键点:themeData 只要不是 undefined(即便显式传入 null)就以它为准,
|
|
10166
|
+
// 仅当未传(undefined)时才回退到对应的标准模板;
|
|
10167
|
+
// 因此 themeData: null 表示「不展示主题」,而非回退到默认模板。
|
|
10168
|
+
var themeData = (_this_options = _this.options) == null ? void 0 : _this_options.themeData; // IThemeData | null | undefined
|
|
10169
|
+
var template = (_this_options1 = _this.options) == null ? void 0 : _this_options1.template; // ThemeTemplateType | string | undefined
|
|
10170
|
+
var initialThemeData;
|
|
10171
|
+
if (options.type === 'hls' || options.type === 'ezhls') {
|
|
10172
|
+
// hls / ezhls:@3.1.1 起支持自定义 themeData,但不支持标准提供的模板;未传时回退 hlsLiveTemplate
|
|
10173
|
+
// FIXME: 部分控件在 hls 下不生效,开发者需自行斟酌
|
|
10174
|
+
initialThemeData = themeData !== undefined ? themeData : hlsLiveTemplate;
|
|
10175
|
+
} else if ([
|
|
10062
10176
|
'flv',
|
|
10063
10177
|
'mp4'
|
|
10064
|
-
].includes(options.type)
|
|
10065
|
-
|
|
10178
|
+
].includes(options.type)) {
|
|
10179
|
+
// flv / mp4:支持自定义 themeData,未传时回退到标准直播模板 LiveTemplate(2026-01-19 起支持自定义)
|
|
10180
|
+
initialThemeData = themeData !== undefined ? themeData : LiveTemplate;
|
|
10181
|
+
} else {
|
|
10182
|
+
var _ref3;
|
|
10183
|
+
// 其余类型(如 ezopen 私有流):template 优先级高于 themeData,二者都未设置时为 null
|
|
10184
|
+
initialThemeData = (_ref3 = template != null ? template : themeData) != null ? _ref3 : null;
|
|
10185
|
+
}
|
|
10186
|
+
_this._renderTheme(initialThemeData);
|
|
10066
10187
|
_this._addEventListener();
|
|
10067
10188
|
_themeEventemitter(_this);
|
|
10068
10189
|
return _this;
|
|
@@ -10457,6 +10578,7 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10457
10578
|
this._mobileInnerWidthHeight();
|
|
10458
10579
|
window.addEventListener('resize', this._throttleMobileInnerWidthHeight);
|
|
10459
10580
|
// ------------------------------ resize observer ----------------------------
|
|
10581
|
+
// istanbul ignore next -- jsdom has no layout engine; clientWidth/height-driven resize bucketing is not exercisable in unit tests
|
|
10460
10582
|
// prettier-ignore
|
|
10461
10583
|
this._cleanUpResizeObserver = Utils.resizeObserver(this.$container, throttle(function() {
|
|
10462
10584
|
var // 窗口尺寸变化时,设置窗口超出隐藏,防止出现滚动条
|
|
@@ -10465,40 +10587,14 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10465
10587
|
// 这里不要使用 $containerWarp.getBoundingClientRect() 获取宽和高 因为会出现小数导致两次(设置后的值和设置后再次获取的值)的宽高不一致 (因为缩放后取整设置,再次获取还有可能是带小数的然后取整 对比两次不一致,一般在屏幕缩放百分比变化和浏览器页面缩放时出现),致使一直触发 resize 事件
|
|
10466
10588
|
var width = Math.floor(_this.$container.clientWidth);
|
|
10467
10589
|
var height = Math.floor(_this.$container.clientHeight);
|
|
10468
|
-
|
|
10469
|
-
|
|
10470
|
-
|
|
10471
|
-
_this.$container.classList.
|
|
10472
|
-
}
|
|
10473
|
-
|
|
10474
|
-
_this.$container.classList.remove(
|
|
10475
|
-
|
|
10476
|
-
} else {
|
|
10477
|
-
if (width <= 200) {
|
|
10478
|
-
_this.$container.classList.add("" + PREFIX_CLASS + "-mini-width");
|
|
10479
|
-
} else {
|
|
10480
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-mini-width");
|
|
10481
|
-
}
|
|
10482
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-small-width");
|
|
10483
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-medium-width");
|
|
10484
|
-
}
|
|
10485
|
-
if (height > 280 && height <= 375) {
|
|
10486
|
-
_this.$container.classList.add("" + PREFIX_CLASS + "-medium-height");
|
|
10487
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-small-height");
|
|
10488
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-mini-height");
|
|
10489
|
-
} else if (height > 200 && height <= 280) {
|
|
10490
|
-
_this.$container.classList.add("" + PREFIX_CLASS + "-small-height");
|
|
10491
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-medium-height");
|
|
10492
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-mini-height");
|
|
10493
|
-
} else {
|
|
10494
|
-
if (height <= 200) {
|
|
10495
|
-
_this.$container.classList.add("" + PREFIX_CLASS + "-mini-height");
|
|
10496
|
-
} else {
|
|
10497
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-mini-height");
|
|
10498
|
-
}
|
|
10499
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-small-height");
|
|
10500
|
-
_this.$container.classList.remove("" + PREFIX_CLASS + "-medium-height");
|
|
10501
|
-
}
|
|
10590
|
+
// 响应式档位类名(纯逻辑见 ./Theme/overflow computeSizeClasses)
|
|
10591
|
+
var sizeClasses = computeSizeClasses(width, height, PREFIX_CLASS);
|
|
10592
|
+
sizeClasses.add.forEach(function(c) {
|
|
10593
|
+
return _this.$container.classList.add(c);
|
|
10594
|
+
});
|
|
10595
|
+
sizeClasses.remove.forEach(function(c) {
|
|
10596
|
+
return _this.$container.classList.remove(c);
|
|
10597
|
+
});
|
|
10502
10598
|
//
|
|
10503
10599
|
if (_this.width !== width || _this.height !== height) {
|
|
10504
10600
|
var _this_controls;
|
|
@@ -10544,7 +10640,7 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10544
10640
|
/**
|
|
10545
10641
|
* 窗口尺寸变化判断头部是否需要隐藏控件展示在更多中
|
|
10546
10642
|
* 尺寸变化结束时 进行判断,为了节省开销
|
|
10547
|
-
*/ _proto._headerMoreControlShow = function _headerMoreControlShow() {
|
|
10643
|
+
*/ /* istanbul ignore next -- jsdom has no layout engine; clientWidth-driven header overflow (More) logic is not exercisable in unit tests */ _proto._headerMoreControlShow = function _headerMoreControlShow() {
|
|
10548
10644
|
var _this = this;
|
|
10549
10645
|
if (this._header) {
|
|
10550
10646
|
var _this__header_$left, _this__header, _this__header_$right, _this__header1;
|
|
@@ -10555,7 +10651,7 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10555
10651
|
var rightWidth = ((_this__header1 = this._header) == null ? void 0 : (_this__header_$right = _this__header1.$right) == null ? void 0 : _this__header_$right.clientWidth) || 0;
|
|
10556
10652
|
// 当header 中 left 和 right 宽度之和大于 header 宽度,则 header more 显示
|
|
10557
10653
|
// 如果 header more 存在,则偏移量量宽度为 150,否则为 100, 因为隐藏多个控件时 right 会变短
|
|
10558
|
-
var showHeaderMore = leftWidth
|
|
10654
|
+
var showHeaderMore = shouldShowHeaderMore(this._width, leftWidth, rightWidth);
|
|
10559
10655
|
if (showHeaderMore) {
|
|
10560
10656
|
var _this_controls;
|
|
10561
10657
|
if (!this._headerMoreControl && ((_this_controls = this.controls) == null ? void 0 : _this_controls.recControl)) {
|
|
@@ -10583,7 +10679,7 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10583
10679
|
(_this_controls1 = this.controls) == null ? void 0 : (_this_controls_recControl = _this_controls1.recControl) == null ? void 0 : _this_controls_recControl.resetPopupContainer(this._headerMoreControl.$panel);
|
|
10584
10680
|
}
|
|
10585
10681
|
this.emit(Theme.EVENTS.control.headerMoreShowControlsChange, showHeaderMore);
|
|
10586
|
-
} else if (this._width
|
|
10682
|
+
} else if (shouldRemoveHeaderMore(this._width, leftWidth, rightWidth)) {
|
|
10587
10683
|
var _this_controls2;
|
|
10588
10684
|
//
|
|
10589
10685
|
if (this._headerMoreControl && ((_this_controls2 = this.controls) == null ? void 0 : _this_controls2.recControl)) {
|
|
@@ -10603,7 +10699,7 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10603
10699
|
*/ _proto._footerMoreControlShow = function _footerMoreControlShow() {
|
|
10604
10700
|
this._displayMore();
|
|
10605
10701
|
};
|
|
10606
|
-
_proto._displayMore = function _displayMore() {
|
|
10702
|
+
/* istanbul ignore next -- jsdom has no layout engine; clientWidth-driven footer overflow (More) logic is not exercisable in unit tests */ _proto._displayMore = function _displayMore() {
|
|
10607
10703
|
var _this = this;
|
|
10608
10704
|
if (this._footer) {
|
|
10609
10705
|
var _this__footer_$left, _this__footer_$right;
|
|
@@ -10611,7 +10707,7 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10611
10707
|
var leftWidth = ((_this__footer_$left = this._footer.$left) == null ? void 0 : _this__footer_$left.clientWidth) || 0;
|
|
10612
10708
|
var rightWidth = ((_this__footer_$right = this._footer.$right) == null ? void 0 : _this__footer_$right.clientWidth) || 0;
|
|
10613
10709
|
// 当footer 中 left 和 right 宽度之和大于 footer 宽度,则 footer more 显示
|
|
10614
|
-
var collapseControl = this._width
|
|
10710
|
+
var collapseControl = shouldCollapseFooter(this._width, leftWidth, rightWidth); // 收拢控件到 More 中
|
|
10615
10711
|
if (collapseControl) {
|
|
10616
10712
|
var _this__footer, _this__themeData_footer, _this__themeData, _this__footerMoreControl_list, _this__footerMoreControl, _this__footerMoreControl_list1, _this__footerMoreControl1;
|
|
10617
10713
|
if (!this._footerMoreControl && ((_this__footer = this._footer) == null ? void 0 : _this__footer.$right)) {
|
|
@@ -10691,28 +10787,23 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10691
10787
|
this._displayMore();
|
|
10692
10788
|
}
|
|
10693
10789
|
} else {
|
|
10694
|
-
var _this__footerMoreControl_list2,
|
|
10695
|
-
|
|
10696
|
-
|
|
10697
|
-
|
|
10698
|
-
|
|
10699
|
-
if ((_this__footerMoreControl5 = this._footerMoreControl) == null ? void 0 : (_this__footerMoreControl_list2 = _this__footerMoreControl5.list) == null ? void 0 : _this__footerMoreControl_list2.length) {
|
|
10700
|
-
offset = offset + this._footerMoreControl.list[0].width || 0;
|
|
10701
|
-
}
|
|
10702
|
-
if (((_this__footerMoreControl6 = this._footerMoreControl) == null ? void 0 : (_this__footerMoreControl_list3 = _this__footerMoreControl6.list) == null ? void 0 : _this__footerMoreControl_list3.length) && this._width - leftWidth - rightWidth > offset) {
|
|
10703
|
-
var _this__footerMoreControl7, _this__footerMoreControl_list4, _this__footerMoreControl8, _this__footerMoreControl_list5, _this__footerMoreControl9;
|
|
10790
|
+
var _this__footerMoreControl_list2, _this__footerMoreControl4, _this__footerMoreControl_list3, _this__footerMoreControl5;
|
|
10791
|
+
// 展开阈值(纯逻辑见 ./Theme/overflow computeFooterExpandOffset)
|
|
10792
|
+
var offset = computeFooterExpandOffset(((_this__footerMoreControl4 = this._footerMoreControl) == null ? void 0 : (_this__footerMoreControl_list2 = _this__footerMoreControl4.list) == null ? void 0 : _this__footerMoreControl_list2.length) ? this._footerMoreControl.list[0].width : undefined);
|
|
10793
|
+
if (((_this__footerMoreControl5 = this._footerMoreControl) == null ? void 0 : (_this__footerMoreControl_list3 = _this__footerMoreControl5.list) == null ? void 0 : _this__footerMoreControl_list3.length) && shouldExpandFooter(this._width, leftWidth, rightWidth, offset)) {
|
|
10794
|
+
var _this__footerMoreControl6, _this__footerMoreControl_list4, _this__footerMoreControl7, _this__footerMoreControl_list5, _this__footerMoreControl8;
|
|
10704
10795
|
// 110 是为了保住个别控件的宽度超出已知的值, 如英文下 按钮的宽度
|
|
10705
10796
|
// 从 More 中一次移除一个控件到 header/footer 中
|
|
10706
10797
|
//
|
|
10707
|
-
var item2 = (
|
|
10798
|
+
var item2 = (_this__footerMoreControl6 = this._footerMoreControl) == null ? void 0 : _this__footerMoreControl6.list.shift();
|
|
10708
10799
|
if (item2) {
|
|
10709
|
-
var
|
|
10800
|
+
var _this__footerMoreControl9;
|
|
10710
10801
|
if (item2.part === 'left') {
|
|
10711
10802
|
var _item_control_resetPopupContainer, _item_control;
|
|
10712
10803
|
(_item_control = item2.control) == null ? void 0 : (_item_control_resetPopupContainer = _item_control.resetPopupContainer) == null ? void 0 : _item_control_resetPopupContainer.call(_item_control, this._footer.$left, 'append');
|
|
10713
10804
|
} else if (item2.part === 'right') {
|
|
10714
|
-
var _this__footerMoreControl_list6,
|
|
10715
|
-
if (((
|
|
10805
|
+
var _this__footerMoreControl_list6, _this__footerMoreControl10;
|
|
10806
|
+
if (((_this__footerMoreControl10 = this._footerMoreControl) == null ? void 0 : (_this__footerMoreControl_list6 = _this__footerMoreControl10.list) == null ? void 0 : _this__footerMoreControl_list6.length) === 0) {
|
|
10716
10807
|
var _item_control_resetPopupContainer1, _item_control1;
|
|
10717
10808
|
(_item_control1 = item2.control) == null ? void 0 : (_item_control_resetPopupContainer1 = _item_control1.resetPopupContainer) == null ? void 0 : _item_control_resetPopupContainer1.call(_item_control1, this._footer.$right, 'append');
|
|
10718
10809
|
} else {
|
|
@@ -10720,14 +10811,14 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10720
10811
|
(_item_control2 = item2.control) == null ? void 0 : (_item_control_resetPopupContainer2 = _item_control2.resetPopupContainer) == null ? void 0 : _item_control_resetPopupContainer2.call(_item_control2, this._footer.$right, 'before', this._footerMoreControl.$container);
|
|
10721
10812
|
}
|
|
10722
10813
|
}
|
|
10723
|
-
(
|
|
10814
|
+
(_this__footerMoreControl9 = this._footerMoreControl) == null ? void 0 : _this__footerMoreControl9.remove(item2.control);
|
|
10724
10815
|
}
|
|
10725
|
-
if (((
|
|
10726
|
-
var
|
|
10816
|
+
if (((_this__footerMoreControl7 = this._footerMoreControl) == null ? void 0 : (_this__footerMoreControl_list4 = _this__footerMoreControl7.list) == null ? void 0 : _this__footerMoreControl_list4.length) === 1) {
|
|
10817
|
+
var _this__footerMoreControl11, _this__footerMoreControl_destroy, _this__footerMoreControl12;
|
|
10727
10818
|
// 最后一个, 移除 More
|
|
10728
|
-
var item11 = (
|
|
10819
|
+
var item11 = (_this__footerMoreControl11 = this._footerMoreControl) == null ? void 0 : _this__footerMoreControl11.list.shift();
|
|
10729
10820
|
if (item11) {
|
|
10730
|
-
var
|
|
10821
|
+
var _this__footerMoreControl13;
|
|
10731
10822
|
if (item11.part === 'left') {
|
|
10732
10823
|
var _item1_control_resetPopupContainer, _item1_control;
|
|
10733
10824
|
(_item1_control = item11.control) == null ? void 0 : (_item1_control_resetPopupContainer = _item1_control.resetPopupContainer) == null ? void 0 : _item1_control_resetPopupContainer.call(_item1_control, this._footer.$left, 'append');
|
|
@@ -10735,13 +10826,13 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
10735
10826
|
var _item1_control_resetPopupContainer1, _item1_control1;
|
|
10736
10827
|
(_item1_control1 = item11.control) == null ? void 0 : (_item1_control_resetPopupContainer1 = _item1_control1.resetPopupContainer) == null ? void 0 : _item1_control_resetPopupContainer1.call(_item1_control1, this._footer.$right, 'append');
|
|
10737
10828
|
}
|
|
10738
|
-
(
|
|
10829
|
+
(_this__footerMoreControl13 = this._footerMoreControl) == null ? void 0 : _this__footerMoreControl13.remove(item11.control);
|
|
10739
10830
|
}
|
|
10740
|
-
(
|
|
10831
|
+
(_this__footerMoreControl12 = this._footerMoreControl) == null ? void 0 : (_this__footerMoreControl_destroy = _this__footerMoreControl12.destroy) == null ? void 0 : _this__footerMoreControl_destroy.call(_this__footerMoreControl12);
|
|
10741
10832
|
this._footerMoreControl = null;
|
|
10742
10833
|
}
|
|
10743
10834
|
// prettier-ignore
|
|
10744
|
-
this.emit(Theme.EVENTS.control.footerMoreShowControlsChange, !!this._footerMoreControl, (
|
|
10835
|
+
this.emit(Theme.EVENTS.control.footerMoreShowControlsChange, !!this._footerMoreControl, (_this__footerMoreControl8 = this._footerMoreControl) == null ? void 0 : (_this__footerMoreControl_list5 = _this__footerMoreControl8.list) == null ? void 0 : _this__footerMoreControl_list5.map(function(item) {
|
|
10745
10836
|
return item.key;
|
|
10746
10837
|
}));
|
|
10747
10838
|
this._displayMore();
|
|
@@ -11268,6 +11359,6 @@ var THEME_DEFAULT_OPTIONS = {
|
|
|
11268
11359
|
zh: zh,
|
|
11269
11360
|
en: en
|
|
11270
11361
|
};
|
|
11271
|
-
/** 版本号 @since 0.0.1 */ Theme.THEME_VERSION = '3.1.
|
|
11362
|
+
/** 版本号 @since 0.0.1 */ Theme.THEME_VERSION = '3.1.1-beta.2';
|
|
11272
11363
|
|
|
11273
11364
|
export { Control, EVENTS, Fullscreen, Loading, Message, Play, Poster, Rec, Theme, Utils, Volume };
|