@volcengine/veplayer 2.3.0 → 2.4.0-rc.0

package/umd/veplayer.live.development.js

@@ -1014,6 +1014,9 @@ var __publicField = (obj, key, value) => {
     _fun && _fun(frameId);
   };
   util$1.isMSE = function(video) {
+    if (video.media) {
+      video = video.media;
+    }
     if (!video || !(video instanceof HTMLMediaElement)) {
       return false;
     }
@@ -1458,7 +1461,7 @@ var __publicField = (obj, key, value) => {
       }
     }
   };
-  var version = "3.0.12";
+  var version = "3.0.17";
   var ERROR_TYPE_MAP = {
     1: "media",
     2: "media",
@@ -1564,6 +1567,9 @@ var __publicField = (obj, key, value) => {
   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";
@@ -1609,11 +1615,14 @@ var __publicField = (obj, key, value) => {
     DURATION_CHANGE,
     EMPTIED,
     ENDED,
+    ENTER_PLAYER,
     ERROR,
     FPS_STUCK,
     FULLSCREEN_CHANGE,
+    LEAVE_PLAYER,
     LOADED_DATA,
     LOADED_METADATA,
+    LOADING,
     LOAD_START,
     MINI_STATE_CHANGE,
     PAUSE,
@@ -2213,6 +2222,11 @@ var __publicField = (obj, key, value) => {
         }
         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) {
@@ -2838,6 +2852,10 @@ var __publicField = (obj, key, value) => {
     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;
@@ -3071,6 +3089,18 @@ var __publicField = (obj, key, value) => {
       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() {
@@ -3217,7 +3247,7 @@ var __publicField = (obj, key, value) => {
         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";
         }
       }
     }, {
@@ -3763,15 +3793,8 @@ var __publicField = (obj, key, value) => {
         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 = {
@@ -4553,6 +4576,7 @@ var __publicField = (obj, key, value) => {
       }
       _this.userTimer = null;
       _this.waitTimer = null;
+      _this.handleSource = true;
       _this._state = STATES.INITIAL;
       _this.isError = false;
       _this._hasStart = false;
@@ -4781,6 +4805,15 @@ var __publicField = (obj, key, value) => {
         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) {
@@ -4796,13 +4829,15 @@ var __publicField = (obj, key, value) => {
             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;
@@ -5045,7 +5080,7 @@ var __publicField = (obj, key, value) => {
           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(e2) {
@@ -5063,7 +5098,7 @@ var __publicField = (obj, key, value) => {
         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;
@@ -5293,8 +5328,8 @@ var __publicField = (obj, key, value) => {
       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;
@@ -5394,7 +5429,6 @@ var __publicField = (obj, key, value) => {
               });
             }
           });
-          _this19.play();
           _this19.emit(REPLAY);
           _this19.onPlay();
         });
@@ -5408,7 +5442,7 @@ var __publicField = (obj, key, value) => {
         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;
@@ -5636,6 +5670,7 @@ var __publicField = (obj, key, value) => {
           this.onBlur(data);
           return;
         }
+        this._clearUserTimer();
         this.emit(PLAYER_BLUR, _objectSpread2$1({
           paused: this.paused,
           ended: this.ended
@@ -5652,18 +5687,12 @@ var __publicField = (obj, key, value) => {
         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;
@@ -5676,7 +5705,7 @@ var __publicField = (obj, key, value) => {
       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;
@@ -5735,10 +5764,7 @@ var __publicField = (obj, key, value) => {
         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();
         }
       }
@@ -5789,6 +5815,7 @@ var __publicField = (obj, key, value) => {
         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);
@@ -5798,8 +5825,8 @@ var __publicField = (obj, key, value) => {
       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);
         });
@@ -5868,6 +5895,11 @@ var __publicField = (obj, key, value) => {
     }, {
       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;
@@ -5875,7 +5907,7 @@ var __publicField = (obj, key, value) => {
         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;
           }
         }
@@ -6061,10 +6093,10 @@ var __publicField = (obj, key, value) => {
         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
         };
       }
@@ -6330,13 +6362,15 @@ var __publicField = (obj, key, value) => {
       }
     }, {
       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",
@@ -6357,14 +6391,14 @@ var __publicField = (obj, key, value) => {
     }, {
       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",
@@ -6784,8 +6818,8 @@ var __publicField = (obj, key, value) => {
           case "cover":
             _bg = "cover";
             break;
-          case "container":
-            _bg = "container";
+          case "contain":
+            _bg = "contain";
             break;
           case "fixHeight":
             _bg = "auto 100%";
@@ -7828,6 +7862,7 @@ var __publicField = (obj, key, value) => {
         } else {
           player.focus();
         }
+        _this.emit(ENTER_PLAYER);
       });
       _defineProperty$1(_assertThisInitialized(_this), "onMouseLeave", function(e2) {
         var _this$playerConfig = _this.playerConfig, closePlayerBlur = _this$playerConfig.closePlayerBlur, leavePlayerTime = _this$playerConfig.leavePlayerTime, closeDelayBlur = _this$playerConfig.closeDelayBlur;
@@ -7838,9 +7873,12 @@ var __publicField = (obj, key, value) => {
               delay: leavePlayerTime
             });
           } else {
-            _this.player.blur();
+            _this.player.blur({
+              ignorePaused: true
+            });
           }
         }
+        _this.emit(LEAVE_PLAYER);
       });
       _defineProperty$1(_assertThisInitialized(_this), "onVideoClick", function(e2) {
         var _assertThisInitialize3 = _assertThisInitialized(_this), player = _assertThisInitialize3.player, playerConfig = _assertThisInitialize3.playerConfig;
@@ -8219,6 +8257,7 @@ var __publicField = (obj, key, value) => {
         var touche = _this.getTouche(e2);
         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();
@@ -8279,6 +8318,9 @@ var __publicField = (obj, key, value) => {
       });
       _defineProperty$1(_assertThisInitialized(_this), "onTouchEnd", function(e2) {
         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;
         }
@@ -8288,9 +8330,6 @@ var __publicField = (obj, key, value) => {
         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;
         }
@@ -8419,8 +8458,10 @@ var __publicField = (obj, key, value) => {
             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);
+              });
             });
           }
         }
@@ -8440,15 +8481,23 @@ var __publicField = (obj, key, value) => {
       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");
       }
     }, {
@@ -8781,7 +8830,7 @@ var __publicField = (obj, key, value) => {
       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",
@@ -8975,6 +9024,14 @@ var __publicField = (obj, key, value) => {
         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() {
@@ -8992,11 +9049,11 @@ var __publicField = (obj, key, value) => {
     }, {
       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;
@@ -9187,6 +9244,7 @@ var __publicField = (obj, key, value) => {
               }, this.keyCodeMap[arr[i2]]));
             }
             preventDefault(event);
+            event.stopPropagation();
             break;
           }
         }
@@ -9301,6 +9359,9 @@ var __publicField = (obj, key, value) => {
       value: function afterCreate() {
         this.bind("mouseenter", this._onMouseenter);
         this.bind("mouseleave", this._onMouseLeave);
+        if (this.config.disable) {
+          this.disable();
+        }
       }
     }, {
       key: "destroy",
@@ -9632,9 +9693,15 @@ var __publicField = (obj, key, value) => {
         } 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);
+            }
           }
         }
       }
@@ -9661,6 +9728,24 @@ var __publicField = (obj, key, value) => {
         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(e2) {
+          });
+        } catch (e2) {
+        }
+      }
+    }, {
+      key: "unlockScreen",
+      value: function unlockScreen() {
+        try {
+          screen.orientation.unlock().catch(function(e2) {
+          });
+        } catch (e2) {
+        }
+      }
     }], [{
       key: "pluginName",
       get: function get() {
@@ -9674,6 +9759,8 @@ var __publicField = (obj, key, value) => {
           index: 0,
           useCssFullscreen: false,
           rotateFullscreen: false,
+          useScreenOrientation: false,
+          lockOrientationType: "landscape",
           switchCallback: null,
           target: null,
           disable: false,
@@ -10536,7 +10623,10 @@ var __publicField = (obj, key, value) => {
     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,
@@ -10582,6 +10672,15 @@ var __publicField = (obj, key, value) => {
     },
     [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) {
@@ -12481,7 +12580,8 @@ var __publicField = (obj, key, value) => {
     "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";
@@ -12493,6 +12593,7 @@ var __publicField = (obj, key, value) => {
     DynamicModule2["PluginRtm"] = "plugin:rtm";
     DynamicModule2["PluginXgvideo"] = "plugin:xgvideo";
     DynamicModule2["PluginDrm"] = "plugin:drm";
+    DynamicModule2["PluginAbr"] = "plugin:abr";
     return DynamicModule2;
   })(DynamicModule || {});
   class Loader {
@@ -13806,7 +13907,7 @@ var __publicField = (obj, key, value) => {
      * @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.
      */
@@ -21793,9 +21894,9 @@ var __publicField = (obj, key, value) => {
         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"
         }
       });
@@ -22090,6 +22191,25 @@ var __publicField = (obj, key, value) => {
     }
     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",
@@ -22162,6 +22282,14 @@ var __publicField = (obj, key, value) => {
       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
@@ -22170,6 +22298,14 @@ var __publicField = (obj, key, value) => {
       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;
@@ -22194,15 +22330,21 @@ var __publicField = (obj, key, value) => {
           };
         },
         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 ?? []
+            ]
           };
         }
       },