@volcengine/veplayer 2.3.0 → 2.4.0-rc.0

package/esm/veplayer.development.js

@@ -1010,6 +1010,9 @@ util$1.cancelAnimationFrame = function(frameId) {
   _fun && _fun(frameId);
 };
 util$1.isMSE = function(video) {
+  if (video.media) {
+    video = video.media;
+  }
   if (!video || !(video instanceof HTMLMediaElement)) {
     return false;
   }
@@ -1454,7 +1457,7 @@ var sniffer$1 = {
     }
   }
 };
-var version = "3.0.12";
+var version = "3.0.17";
 var ERROR_TYPE_MAP = {
   1: "media",
   2: "media",
@@ -1560,6 +1563,9 @@ var REPLAY = "replay";
 var DESTROY = "destroy";
 var URL_CHANGE = "urlchange";
 var DOWNLOAD_SPEED_CHANGE = "download_speed_change";
+var LEAVE_PLAYER = "leaveplayer";
+var ENTER_PLAYER = "enterplayer";
+var LOADING = "loading";
 var FULLSCREEN_CHANGE = "fullscreen_change";
 var CSS_FULLSCREEN_CHANGE = "cssFullscreen_change";
 var MINI_STATE_CHANGE = "mini_state_change";
@@ -1605,11 +1611,14 @@ var XGEvents = /* @__PURE__ */ Object.freeze({
   DURATION_CHANGE,
   EMPTIED,
   ENDED,
+  ENTER_PLAYER,
   ERROR,
   FPS_STUCK,
   FULLSCREEN_CHANGE,
+  LEAVE_PLAYER,
   LOADED_DATA,
   LOADED_METADATA,
+  LOADING,
   LOAD_START,
   MINI_STATE_CHANGE,
   PAUSE,
@@ -2209,6 +2218,11 @@ var MediaProxy = /* @__PURE__ */ function(_EventEmitter) {
       }
       this.media.volume = vol;
     }
+  }, {
+    key: "aspectRatio",
+    get: function get() {
+      return this.media ? this.media.videoWidth / this.media.videoHeight : 0;
+    }
   }, {
     key: "addInnerOP",
     value: function addInnerOP(event) {
@@ -2834,6 +2848,10 @@ var POSITIONS$2 = {
   CONTROLS_CENTER: "controlsCenter",
   CONTROLS: "controls"
 };
+var PLUGIN_STATE_CLASS = {
+  ICON_DISABLE: "xg-icon-disable",
+  ICON_HIDE: "xg-icon-hide"
+};
 function isUrl(str) {
   if (!str) {
     return false;
@@ -3067,6 +3085,18 @@ var Plugin = /* @__PURE__ */ function(_BasePlugin) {
     value: function plugins() {
       return this._children;
     }
+  }, {
+    key: "disable",
+    value: function disable() {
+      this.config.disable = true;
+      util$1.addClass(this.find(".xgplayer-icon"), PLUGIN_STATE_CLASS.ICON_DISABLE);
+    }
+  }, {
+    key: "enable",
+    value: function enable() {
+      this.config.disable = false;
+      util$1.removeClass(this.find(".xgplayer-icon"), PLUGIN_STATE_CLASS.ICON_DISABLE);
+    }
   }, {
     key: "children",
     value: function children() {
@@ -3213,7 +3243,7 @@ var Plugin = /* @__PURE__ */ function(_BasePlugin) {
       var cs = window.getComputedStyle(this.root, null);
       var cssDisplayValue = cs.getPropertyValue("display");
       if (cssDisplayValue === "none") {
-        this.root.style.display = "block";
+        return this.root.style.display = "block";
       }
     }
   }, {
@@ -3759,15 +3789,8 @@ var pluginsManager = {
       var item = _Object$keys[_i];
       this.unRegister(cgid, item);
     }
-    var _isUseActive = player.isUseActive;
     delete this.pluginGroup[cgid];
     delete player._pluginInfoId;
-    if (_isUseActive) {
-      var keys = Object.keys(this.pluginGroup);
-      if (keys.length > 0) {
-        this.setCurrentUserActive(keys[keys.length - 1], true);
-      }
-    }
   }
 };
 var STATE_CLASS = {
@@ -4549,6 +4572,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
     }
     _this.userTimer = null;
     _this.waitTimer = null;
+    _this.handleSource = true;
     _this._state = STATES.INITIAL;
     _this.isError = false;
     _this._hasStart = false;
@@ -4777,6 +4801,15 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
       this.media.removeEventListener("webkitbeginfullscreen", this._onWebkitbeginfullscreen);
       this.media.removeEventListener("webkitendfullscreen", this._onWebkitendfullscreen);
     }
+  }, {
+    key: "_clearUserTimer",
+    value: function _clearUserTimer() {
+      if (!this.userTimer) {
+        return;
+      }
+      util$1.clearTimeout(this, this.userTimer);
+      this.userTimer = null;
+    }
   }, {
     key: "_startInit",
     value: function _startInit(url) {
@@ -4792,13 +4825,15 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
           return;
         }
       }
-      this._detachSourceEvents(this.media);
-      if (util$1.typeOf(url) === "Array" && url.length > 0) {
-        this._attachSourceEvents(this.media, url);
-      } else if (!this.media.src || this.media.src !== url) {
-        this.media.src = url;
-      } else if (!url) {
-        this.media.removeAttribute("src");
+      if (this.handleSource) {
+        this._detachSourceEvents(this.media);
+        if (util$1.typeOf(url) === "Array" && url.length > 0) {
+          this._attachSourceEvents(this.media, url);
+        } else if (!this.media.src || this.media.src !== url) {
+          this.media.src = url;
+        } else if (!url) {
+          this.media.removeAttribute("src");
+        }
       }
       if (util$1.typeOf(this.config.volume) === "Number") {
         this.volume = this.config.volume;
@@ -5041,7 +5076,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
         if (!url) {
           url = _this8.url || _this8.config.url;
         }
-        var _furl = _this8.preProcessUrl(url);
+        var _furl = _this8._preProcessUrl(url);
         var ret = _this8._startInit(_furl.url);
         return ret;
       }).catch(function(e3) {
@@ -5059,7 +5094,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
       if (util$1.typeOf(url) === "Object") {
         _src = url.url;
       }
-      _src = this.preProcessUrl(_src).url;
+      _src = this._preProcessUrl(_src).url;
       var curTime = this.currentTime;
       this.__startTime = curTime;
       var isPaused = this.paused && !this.isError;
@@ -5289,8 +5324,8 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
     key: "resetState",
     value: function resetState() {
       var _this16 = this;
-      var NOT_ALLOW_AUTOPLAY = STATE_CLASS.NOT_ALLOW_AUTOPLAY, PLAYING2 = STATE_CLASS.PLAYING, NO_START = STATE_CLASS.NO_START, PAUSED = STATE_CLASS.PAUSED, REPLAY2 = STATE_CLASS.REPLAY, ENTER = STATE_CLASS.ENTER, ENDED2 = STATE_CLASS.ENDED, ERROR2 = STATE_CLASS.ERROR, LOADING = STATE_CLASS.LOADING;
-      var clsList = [NOT_ALLOW_AUTOPLAY, PLAYING2, NO_START, PAUSED, REPLAY2, ENTER, ENDED2, ERROR2, LOADING];
+      var NOT_ALLOW_AUTOPLAY = STATE_CLASS.NOT_ALLOW_AUTOPLAY, PLAYING2 = STATE_CLASS.PLAYING, NO_START = STATE_CLASS.NO_START, PAUSED = STATE_CLASS.PAUSED, REPLAY2 = STATE_CLASS.REPLAY, ENTER = STATE_CLASS.ENTER, ENDED2 = STATE_CLASS.ENDED, ERROR2 = STATE_CLASS.ERROR, LOADING2 = STATE_CLASS.LOADING;
+      var clsList = [NOT_ALLOW_AUTOPLAY, PLAYING2, NO_START, PAUSED, REPLAY2, ENTER, ENDED2, ERROR2, LOADING2];
       this.hasStart = false;
       this.isError = false;
       this._useAutoplay = false;
@@ -5390,7 +5425,6 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
             });
           }
         });
-        _this19.play();
         _this19.emit(REPLAY);
         _this19.onPlay();
       });
@@ -5404,7 +5438,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
       runHooks(this, "retry", function() {
         var cur = _this20.currentTime;
         var url = _this20.config.url;
-        var _srcRet = !util$1.isMSE(_this20.media) ? _this20.preProcessUrl(url) : {
+        var _srcRet = !util$1.isMSE(_this20.media) ? _this20._preProcessUrl(url) : {
           url
         };
         _this20.src = _srcRet.url;
@@ -5632,6 +5666,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
         this.onBlur(data);
         return;
       }
+      this._clearUserTimer();
       this.emit(PLAYER_BLUR, _objectSpread2$1({
         paused: this.paused,
         ended: this.ended
@@ -5648,18 +5683,12 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
       var innerStates = this.innerStates;
       this.isActive = true;
       this.removeClass(STATE_CLASS.INACTIVE);
-      if (this.userTimer) {
-        util$1.clearTimeout(this, this.userTimer);
-        this.userTimer = null;
-      }
+      this._clearUserTimer();
       if (data.isLock !== void 0) {
         innerStates.isActiveLocked = data.isLock;
       }
       if (data.autoHide === false || data.isLock === true || innerStates.isActiveLocked) {
-        if (this.userTimer) {
-          util$1.clearTimeout(this, this.userTimer);
-          this.userTimer = null;
-        }
+        this._clearUserTimer();
         return;
       }
       var time = data && data.delay ? data.delay : this.config.inactive;
@@ -5672,7 +5701,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
     key: "onBlur",
     value: function onBlur() {
       var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ref$ignorePaused = _ref.ignorePaused, ignorePaused = _ref$ignorePaused === void 0 ? false : _ref$ignorePaused;
-      if (!this.isActive || this.innerStates.isActiveLocked) {
+      if (this.innerStates.isActiveLocked) {
         return;
       }
       var closePauseVideoFocus = this.config.closePauseVideoFocus;
@@ -5731,10 +5760,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
       this.addClass(STATE_CLASS.PAUSED);
       this.updateAcc("pause");
       if (!this.config.closePauseVideoFocus) {
-        if (this.userTimer) {
-          util$1.clearTimeout(this, this.userTimer);
-          this.userTimer = null;
-        }
+        this._clearUserTimer();
         this.focus();
       }
     }
@@ -5785,6 +5811,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
       this.updateAcc("waiting");
       this.waitTimer = util$1.setTimeout(this, function() {
         _this22.addClass(STATE_CLASS.LOADING);
+        _this22.emit(LOADING);
         util$1.clearTimeout(_this22, _this22.waitTimer);
         _this22.waitTimer = null;
       }, this.config.minWaitDelay);
@@ -5794,8 +5821,8 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
     value: function onPlaying() {
       var _this23 = this;
       this.isError = false;
-      var NO_START = STATE_CLASS.NO_START, PAUSED = STATE_CLASS.PAUSED, ENDED2 = STATE_CLASS.ENDED, ERROR2 = STATE_CLASS.ERROR, REPLAY2 = STATE_CLASS.REPLAY, LOADING = STATE_CLASS.LOADING;
-      var clsList = [NO_START, PAUSED, ENDED2, ERROR2, REPLAY2, LOADING];
+      var NO_START = STATE_CLASS.NO_START, PAUSED = STATE_CLASS.PAUSED, ENDED2 = STATE_CLASS.ENDED, ERROR2 = STATE_CLASS.ERROR, REPLAY2 = STATE_CLASS.REPLAY, LOADING2 = STATE_CLASS.LOADING;
+      var clsList = [NO_START, PAUSED, ENDED2, ERROR2, REPLAY2, LOADING2];
       clsList.forEach(function(cls) {
         _this23.removeClass(cls);
       });
@@ -5864,6 +5891,11 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
   }, {
     key: "checkBuffer",
     value: function checkBuffer(time) {
+      var options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {
+        startDiff: 0,
+        endDiff: 0
+      };
+      var _ref2 = options || {}, _ref2$startDiff = _ref2.startDiff, startDiff = _ref2$startDiff === void 0 ? 0 : _ref2$startDiff, _ref2$endDiff = _ref2.endDiff, endDiff = _ref2$endDiff === void 0 ? 0 : _ref2$endDiff;
       var buffered = this.media.buffered;
       if (!buffered || buffered.length === 0 || !this.duration) {
         return true;
@@ -5871,7 +5903,7 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
       var currentTime = time || this.media.currentTime || 0.2;
       var len = buffered.length;
       for (var i2 = 0; i2 < len; i2++) {
-        if (buffered.start(i2) <= currentTime && buffered.end(i2) > currentTime) {
+        if (buffered.start(i2) + startDiff <= currentTime && buffered.end(i2) - endDiff > currentTime) {
           return true;
         }
       }
@@ -6057,10 +6089,10 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
       this._state = newState;
     }
   }, {
-    key: "preProcessUrl",
-    value: function preProcessUrl(url, ext) {
-      var preProcessUrl2 = this.config.preProcessUrl;
-      return !util$1.isBlob(url) && preProcessUrl2 && typeof preProcessUrl2 === "function" ? preProcessUrl2(url, ext) : {
+    key: "_preProcessUrl",
+    value: function _preProcessUrl(url, ext) {
+      var preProcessUrl = this.config.preProcessUrl;
+      return !util$1.isBlob(url) && typeof preProcessUrl === "function" ? preProcessUrl(url, ext) : {
         url
       };
     }
@@ -6326,13 +6358,15 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
     }
   }, {
     key: "setUserActive",
-    value: function setUserActive(isActive) {
-      var isMuted = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
+    value: function setUserActive(isActive, isMuted) {
+      var _instManager3;
       if (typeof isMuted === "boolean" && isMuted !== this.muted) {
         this.addInnerOP("volumechange");
-        this.muted = isMuted;
+        if (util$1.typeOf(isMuted) === Boolean) {
+          this.muted = isMuted;
+        }
       }
-      pluginsManager.setCurrentUserActive(this.playerId, isActive);
+      (_instManager3 = instManager) === null || _instManager3 === void 0 ? void 0 : _instManager3.setActive(this.playerId, isActive);
     }
   }], [{
     key: "debugger",
@@ -6353,14 +6387,14 @@ var Player = /* @__PURE__ */ function(_MediaProxy) {
   }, {
     key: "getCurrentUserActivePlayerId",
     value: function getCurrentUserActivePlayerId() {
-      var _instManager3;
-      return (_instManager3 = instManager) === null || _instManager3 === void 0 ? void 0 : _instManager3.getActiveId();
+      var _instManager4;
+      return (_instManager4 = instManager) === null || _instManager4 === void 0 ? void 0 : _instManager4.getActiveId();
     }
   }, {
     key: "setCurrentUserActive",
     value: function setCurrentUserActive(playerId, isActive) {
-      var _instManager4;
-      (_instManager4 = instManager) === null || _instManager4 === void 0 ? void 0 : _instManager4.setActive(playerId, isActive);
+      var _instManager5;
+      (_instManager5 = instManager) === null || _instManager5 === void 0 ? void 0 : _instManager5.setActive(playerId, isActive);
     }
   }, {
     key: "isHevcSupported",
@@ -6780,8 +6814,8 @@ var Poster = /* @__PURE__ */ function(_Plugin) {
         case "cover":
           _bg = "cover";
           break;
-        case "container":
-          _bg = "container";
+        case "contain":
+          _bg = "contain";
           break;
         case "fixHeight":
           _bg = "auto 100%";
@@ -7824,6 +7858,7 @@ var PCPlugin = /* @__PURE__ */ function(_BasePlugin) {
       } else {
         player.focus();
       }
+      _this.emit(ENTER_PLAYER);
     });
     _defineProperty$1(_assertThisInitialized(_this), "onMouseLeave", function(e3) {
       var _this$playerConfig = _this.playerConfig, closePlayerBlur = _this$playerConfig.closePlayerBlur, leavePlayerTime = _this$playerConfig.leavePlayerTime, closeDelayBlur = _this$playerConfig.closeDelayBlur;
@@ -7834,9 +7869,12 @@ var PCPlugin = /* @__PURE__ */ function(_BasePlugin) {
             delay: leavePlayerTime
           });
         } else {
-          _this.player.blur();
+          _this.player.blur({
+            ignorePaused: true
+          });
         }
       }
+      _this.emit(LEAVE_PLAYER);
     });
     _defineProperty$1(_assertThisInitialized(_this), "onVideoClick", function(e3) {
       var _assertThisInitialize3 = _assertThisInitialized(_this), player = _assertThisInitialize3.player, playerConfig = _assertThisInitialize3.playerConfig;
@@ -8215,6 +8253,7 @@ var MobilePlugin = /* @__PURE__ */ function(_Plugin) {
       var touche = _this.getTouche(e3);
       if (touche && !config.disableGesture && _this.duration > 0 && !player.ended) {
         pos.isStart = true;
+        _this.timer && clearTimeout(_this.timer);
         util$1.checkIsFunction(playerConfig.disableSwipeHandler) && playerConfig.disableSwipeHandler();
         _this.find(".xg-dur").innerHTML = util$1.format(_this.duration);
         var rect = _this.root.getBoundingClientRect();
@@ -8275,6 +8314,9 @@ var MobilePlugin = /* @__PURE__ */ function(_Plugin) {
     });
     _defineProperty$1(_assertThisInitialized(_this), "onTouchEnd", function(e3) {
       var _assertThisInitialize3 = _assertThisInitialized(_this), player = _assertThisInitialize3.player, pos = _assertThisInitialize3.pos, playerConfig = _assertThisInitialize3.playerConfig;
+      setTimeout(function() {
+        player.getPlugin("progress") && player.getPlugin("progress").resetSeekState();
+      }, 10);
       if (!pos.isStart) {
         return;
       }
@@ -8284,9 +8326,6 @@ var MobilePlugin = /* @__PURE__ */ function(_Plugin) {
       var _this$config = _this.config, disableGesture = _this$config.disableGesture, gestureX = _this$config.gestureX;
       if (!disableGesture && gestureX) {
         _this.endLastMove(pos.scope);
-        setTimeout(function() {
-          player.getPlugin("progress") && player.getPlugin("progress").resetSeekState();
-        }, 10);
       } else {
         pos.time = 0;
       }
@@ -8415,8 +8454,10 @@ var MobilePlugin = /* @__PURE__ */ function(_Plugin) {
           progressPlugin.addCallBack("dragmove", function(data) {
             _this2.activeSeekNote(data.currentTime, data.forward);
           });
-          progressPlugin.addCallBack("dragend", function() {
-            _this2.changeAction(ACTIONS.AUTO);
+          ["dragend", "click"].forEach(function(key) {
+            progressPlugin.addCallBack(key, function() {
+              _this2.changeAction(ACTIONS.AUTO);
+            });
           });
         }
       }
@@ -8436,15 +8477,23 @@ var MobilePlugin = /* @__PURE__ */ function(_Plugin) {
     key: "initCustomStyle",
     value: function initCustomStyle() {
       var _ref = this.playerConfig || {}, commonStyle = _ref.commonStyle;
-      var playedColor = commonStyle.playedColor, progressColor = commonStyle.progressColor;
+      var playedColor = commonStyle.playedColor, progressColor = commonStyle.progressColor, timePreviewStyle = commonStyle.timePreviewStyle, curTimeColor = commonStyle.curTimeColor, durationColor = commonStyle.durationColor;
       if (playedColor) {
         this.find(".xg-curbar").style.backgroundColor = playedColor;
-        this.find(".xg-cur").style.color = playedColor;
       }
       if (progressColor) {
         this.find(".xg-bar").style.backgroundColor = progressColor;
-        this.find(".time-preview").style.color = progressColor;
       }
+      if (timePreviewStyle) {
+        var previewDom = this.find(".time-preview");
+        Object.keys(timePreviewStyle).forEach(function(key) {
+          previewDom.style[key] = timePreviewStyle[key];
+        });
+      }
+      var curColor = curTimeColor || playedColor;
+      var durColor = durationColor;
+      curColor && (this.find(".xg-cur").style.color = curColor);
+      durColor && (this.find(".xg-dur").style.color = durColor);
       this.config.disableTimeProgress && util$1.addClass(this.find(".xg-timebar"), "hide");
     }
   }, {
@@ -8777,7 +8826,7 @@ var MobilePlugin = /* @__PURE__ */ function(_Plugin) {
     key: "render",
     value: function render() {
       var className = this.config.gradient !== "normal" ? "gradient ".concat(this.config.gradient) : "gradient";
-      return '\n     <xg-trigger class="trigger">\n     <div class="'.concat(className, '"></div>\n        <div class="time-preview">\n            <div class="xg-seek-show ').concat(this.config.disableSeekIcon ? " hide-seek-icon" : "", '">\n              <i class="xg-seek-icon"></i>\n              <span class="xg-cur">00:00</span>\n              <span>/</span>\n              <span class="xg-dur">00:00</span>\n            </div>\n              <div class="xg-bar xg-timebar">\n                <div class="xg-curbar"></div>\n              </div>\n        </div>\n        <div class="xg-playbackrate xg-top-note">\n            <span><i>').concat(this.config.pressRate, "X</i>").concat(this.i18n.FORWARD, "</span>\n        </div>\n     </xg-trigger>\n    ");
+      return '\n     <xg-trigger class="trigger">\n     <div class="'.concat(className, '"></div>\n        <div class="time-preview">\n            <div class="xg-seek-show ').concat(this.config.disableSeekIcon ? " hide-seek-icon" : "", '">\n              <i class="xg-seek-icon"></i>\n              <span class="xg-cur">00:00</span>\n              <span class="xg-separator">/</span>\n              <span class="xg-dur">00:00</span>\n            </div>\n              <div class="xg-bar xg-timebar">\n                <div class="xg-curbar"></div>\n              </div>\n        </div>\n        <div class="xg-playbackrate xg-top-note">\n            <span><i>').concat(this.config.pressRate, "X</i>").concat(this.i18n.FORWARD, "</span>\n        </div>\n     </xg-trigger>\n    ");
     }
   }], [{
     key: "pluginName",
@@ -8971,6 +9020,14 @@ var Keyboard = /* @__PURE__ */ function(_BasePlugin) {
       this.player.root.addEventListener("keydown", this.onKeydown);
       document.addEventListener("keydown", this.onBodyKeyDown);
     }
+  }, {
+    key: "setConfig",
+    value: function setConfig(newConfig) {
+      var _this3 = this;
+      Object.keys(newConfig).forEach(function(key) {
+        _this3.config[key] = newConfig[key];
+      });
+    }
   }, {
     key: "checkIsVisible",
     value: function checkIsVisible() {
@@ -8988,11 +9045,11 @@ var Keyboard = /* @__PURE__ */ function(_BasePlugin) {
   }, {
     key: "checkCode",
     value: function checkCode(code, isBodyTarget) {
-      var _this3 = this;
+      var _this4 = this;
       var flag = false;
       Object.keys(this.keyCodeMap).map(function(key) {
-        if (_this3.keyCodeMap[key] && code === _this3.keyCodeMap[key].keyCode && !_this3.keyCodeMap[key].disable) {
-          flag = !isBodyTarget || isBodyTarget && !_this3.keyCodeMap[key].noBodyTarget;
+        if (_this4.keyCodeMap[key] && code === _this4.keyCodeMap[key].keyCode && !_this4.keyCodeMap[key].disable) {
+          flag = !isBodyTarget || isBodyTarget && !_this4.keyCodeMap[key].noBodyTarget;
         }
       });
       return flag;
@@ -9183,6 +9240,7 @@ var Keyboard = /* @__PURE__ */ function(_BasePlugin) {
             }, this.keyCodeMap[arr[i2]]));
           }
           preventDefault(event);
+          event.stopPropagation();
           break;
         }
       }
@@ -9297,6 +9355,9 @@ var Icon = /* @__PURE__ */ function(_Plugin) {
     value: function afterCreate() {
       this.bind("mouseenter", this._onMouseenter);
       this.bind("mouseleave", this._onMouseLeave);
+      if (this.config.disable) {
+        this.disable();
+      }
     }
   }, {
     key: "destroy",
@@ -9628,9 +9689,15 @@ var Fullscreen = /* @__PURE__ */ function(_IconPlugin) {
       } else {
         if (player.fullscreen) {
           player.exitFullscreen();
+          if (config.useScreenOrientation) {
+            this.unlockScreen();
+          }
         } else {
           player.getFullscreen().catch(function(e22) {
           });
+          if (config.useScreenOrientation && player.aspectRatio > 1) {
+            this.lockScreen(config.lockOrientationType);
+          }
         }
       }
     }
@@ -9657,6 +9724,24 @@ var Fullscreen = /* @__PURE__ */ function(_IconPlugin) {
       var langKey = "FULLSCREEN_TIPS";
       return '<xg-icon class="xgplayer-fullscreen">\n    <div class="xgplayer-icon">\n    </div>\n    '.concat(xgIconTips(this, langKey, this.playerConfig.isHideTips), "\n    </xg-icon>");
     }
+  }, {
+    key: "lockScreen",
+    value: function lockScreen(orientation) {
+      try {
+        screen.orientation.lock(orientation).catch(function(e3) {
+        });
+      } catch (e3) {
+      }
+    }
+  }, {
+    key: "unlockScreen",
+    value: function unlockScreen() {
+      try {
+        screen.orientation.unlock().catch(function(e3) {
+        });
+      } catch (e3) {
+      }
+    }
   }], [{
     key: "pluginName",
     get: function get() {
@@ -9670,6 +9755,8 @@ var Fullscreen = /* @__PURE__ */ function(_IconPlugin) {
         index: 0,
         useCssFullscreen: false,
         rotateFullscreen: false,
+        useScreenOrientation: false,
+        lockOrientationType: "landscape",
         switchCallback: null,
         target: null,
         disable: false,
@@ -10532,7 +10619,10 @@ const BaseEvents = {
   AUTOPLAY_FAIL: "autoplayFail",
   AUTOPLAY_SUCCESS: "autoplaySuccess",
   ERROR_REFRESH_CLICK: "errorRefreshClick",
-  SOURCE_CHANGE: "sourceChange"
+  SOURCE_CHANGE: "sourceChange",
+  SWITCH_DEFINITION_START: "switchDefinitionStart",
+  SWITCH_DEFINITION_SUCCESS: "switchDefinitionSuccess",
+  DOWN_DEFINITION: "downDefinition"
 };
 const Events$1 = {
   ...XGEvents,
@@ -10578,6 +10668,15 @@ const EVENT_TRANSFORMATION = {
   },
   [BaseEvents.DOWNLOAD_SPEED_CHANGE]: {
     event: DOWNLOAD_SPEED_CHANGE
+  },
+  [BaseEvents.SWITCH_DEFINITION_START]: {
+    event: "switch_definition_start"
+  },
+  [BaseEvents.SWITCH_DEFINITION_SUCCESS]: {
+    event: "switch_definition_success"
+  },
+  [BaseEvents.DOWN_DEFINITION]: {
+    event: "down_definition"
   }
 };
 function transform(event, callback) {
@@ -12477,7 +12576,8 @@ const NAME_MAP = {
   "plugin:shaka": "veplayer.plugin.shaka.[env].[ext]",
   "plugin:rtm": "veplayer.plugin.rtm.[env].[ext]",
   "plugin:xgvideo": "veplayer.plugin.xgvideo.[env].[ext]",
-  "plugin:drm": "veplayer.plugin.drm.[env].[ext]"
+  "plugin:drm": "veplayer.plugin.drm.[env].[ext]",
+  "plugin:abr": "veplayer.plugin.abr.[env].[ext]"
 };
 var DynamicModule = /* @__PURE__ */ ((DynamicModule2) => {
   DynamicModule2["BizVod"] = "biz:vod";
@@ -12489,6 +12589,7 @@ var DynamicModule = /* @__PURE__ */ ((DynamicModule2) => {
   DynamicModule2["PluginRtm"] = "plugin:rtm";
   DynamicModule2["PluginXgvideo"] = "plugin:xgvideo";
   DynamicModule2["PluginDrm"] = "plugin:drm";
+  DynamicModule2["PluginAbr"] = "plugin:abr";
   return DynamicModule2;
 })(DynamicModule || {});
 class Loader {
@@ -13802,7 +13903,7 @@ class VePlayerBase {
    * @param callback 表示事件的回调函数。
    */
   /** {en}
-   * @brief Listens for a specified event. The event handler is executed only once.
+   * @brief Add a one-time listener function for the specified event.
    * @param event The event name.
    * @param callback The callback function for the event.
    */
@@ -21789,9 +21890,9 @@ class Logger extends Plugin {
       user_id: this._userId,
       device_id: this._deviceId,
       ext: {
-        veplayer_version: "2.3.0",
-        flv_version: "3.0.12",
-        hls_version: "3.0.12",
+        veplayer_version: "2.4.0-rc.0",
+        flv_version: "3.0.17",
+        hls_version: "3.0.17",
         rts_version: "0.2.0-alpha.5"
       }
     });
@@ -22086,6 +22187,25 @@ const getDrmStrategy = async (options, player) => {
   }
   return {};
 };
+const getAbrStrategy = async (options) => {
+  var _a, _b;
+  const streamType = options.url && getStreamType(options.url);
+  if (streamType === "rtm")
+    return {};
+  const abrOptions = streamType === "flv" ? (_a = options == null ? void 0 : options.flv) == null ? void 0 : _a.abr : (_b = options == null ? void 0 : options.hls) == null ? void 0 : _b.abr;
+  if (!abrOptions) {
+    return {};
+  }
+  const abrPlugin = await load(DynamicModule.PluginAbr).catch(() => void 0);
+  return {
+    options: {
+      [streamType === "flv" ? "abr" : "hlsabr"]: abrOptions
+    },
+    plugins: [
+      streamType === "flv" ? abrPlugin == null ? void 0 : abrPlugin.AbrPlugin : abrPlugin == null ? void 0 : abrPlugin.HlsAbrPlugin
+    ]
+  };
+};
 VeI18n.extend([
   {
     LANG: "zh-cn",
@@ -22158,6 +22278,14 @@ class VePlayerLive extends VePlayerBase {
     var _a;
     (_a = this._player.plugins) == null ? void 0 : _a.infopanel.close();
   }
+  openAbr() {
+    var _a, _b;
+    (_b = (_a = this._player.plugins) == null ? void 0 : _a.abr) == null ? void 0 : _b.switchAbr(true);
+  }
+  closeAbr() {
+    var _a, _b;
+    (_b = (_a = this._player.plugins) == null ? void 0 : _a.abr) == null ? void 0 : _b.switchAbr(false);
+  }
   /** {zh}
    * @brief 调用此方法更新 DRM 鉴权配置。
    * @hidden
@@ -22166,6 +22294,14 @@ class VePlayerLive extends VePlayerBase {
     var _a, _b, _c;
     (_c = (_b = (_a = this._player) == null ? void 0 : _a.plugins) == null ? void 0 : _b.drm) == null ? void 0 : _c.updateDrmConfig(config);
   }
+  async switch(target, options) {
+    var _a, _b, _c;
+    const { abr, ...rest } = options ?? {};
+    if (abr) {
+      (_c = (_b = (_a = this._player) == null ? void 0 : _a.plugins) == null ? void 0 : _b.abr) == null ? void 0 : _c.updateConfig(abr);
+    }
+    return super.switch(target, rest);
+  }
 }
 async function createLivePlayer(options) {
   var _a, _b;
@@ -22190,15 +22326,21 @@ async function createLivePlayer(options) {
         };
       },
       async preparePlugins(url) {
-        const [typeStrategy, drmStrategy] = await Promise.all([
+        const [typeStrategy, drmStrategy, abrStrategy] = await Promise.all([
           getTypeStrategy({ ...finalOptions, url }, player),
-          getDrmStrategy({ ...finalOptions, url }, player)
+          getDrmStrategy({ ...finalOptions, url }, player),
+          getAbrStrategy({ ...finalOptions, url })
         ]);
         const { options: options2, plugins } = typeStrategy ?? {};
         const { options: drmOptions, plugins: drmPlugins } = drmStrategy ?? {};
+        const { options: abrOptions, plugins: abrPlugins } = abrStrategy ?? {};
         return {
-          options: Object.assign({}, options2, drmOptions),
-          plugins: [...plugins ?? [], ...drmPlugins ?? []]
+          options: Object.assign({}, options2, drmOptions, abrOptions),
+          plugins: [
+            ...plugins ?? [],
+            ...drmPlugins ?? [],
+            ...abrPlugins ?? []
+          ]
         };
       }
     },