xgplayer 2.32.5 → 2.32.6

package/es/plugins/gapJump/index.js

@@ -0,0 +1,142 @@
+import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, defineProperty as _defineProperty, assertThisInitialized as _assertThisInitialized, createClass as _createClass } from "../../_virtual/_rollupPluginBabelHelpers.js";
+import "../../utils/util.js";
+import { WAITING, PLAY, SEEKING } from "../../events.js";
+import "../../utils/debug.js";
+import Plugin from "../../plugin/plugin.js";
+var GapJump = /* @__PURE__ */ function(_BasePlugin) {
+  _inherits(GapJump2, _BasePlugin);
+  var _super = _createSuper(GapJump2);
+  function GapJump2() {
+    var _this;
+    _classCallCheck(this, GapJump2);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "onGapJump", function() {
+      var _assertThisInitialize = _assertThisInitialized(_this), player = _assertThisInitialize.player, config = _assertThisInitialize.config;
+      if (player.media.readyState === HTMLMediaElement.HAVE_NOTHING) {
+        return;
+      }
+      if (player.media.seeking) {
+        if (!_this.seekingEventReceived) {
+          return;
+        }
+      } else {
+        _this.seekingEventReceived = false;
+      }
+      if (player.media.paused && player.media.currentTime !== 0 && _this.hasPlayed) {
+        return;
+      }
+      var buffered = player.media.buffered;
+      var smallGapLimit = config.smallGapLimit || 0.5;
+      var gapDetectionThreshold = config.gapDetectionThreshold || 0.3;
+      var currentTime = player.media.currentTime;
+      var idx = _this._getIndex(buffered, currentTime, gapDetectionThreshold);
+      if (idx === null || idx === 0) {
+        return;
+      }
+      console.log("GapJump  bufferRange ", buffered.start(idx), buffered.end(idx));
+      var jumpTo = buffered.start(idx) + 0.1;
+      var seekEnd = player.media.duration;
+      if (jumpTo > seekEnd) {
+        return;
+      }
+      var jumpSize = jumpTo - currentTime;
+      var isGapSmall = jumpSize <= smallGapLimit;
+      if (jumpSize < GapJump2.BROWSER_GAP_TOLERANCE) {
+        return;
+      }
+      if (isGapSmall) {
+        if (config.useGapJump !== false) {
+          player.media.currentTime = _this.isSafari ? jumpTo + 0.1 : jumpTo;
+        }
+        _this.player && _this.player.emit("detectGap");
+        console.log("gapJump gapIndex", idx, " isGapSamll:", isGapSmall, " currentTime:", player.media.currentTime, " jumpSize:", currentTime - player.media.currentTime);
+        if (jumpTo !== 0.08) {
+          player && player.emit("log", {
+            type: "oneevent",
+            end_type: "gap",
+            vid: player.config.vid,
+            ext: {
+              video_postion: Math.floor(jumpTo * 1e3)
+            }
+          });
+        }
+      }
+    });
+    return _this;
+  }
+  _createClass(GapJump2, [{
+    key: "afterCreate",
+    value: function afterCreate() {
+      var _this2 = this;
+      var useGapJump = this.config.useGapJump;
+      if (useGapJump === false) {
+        return;
+      }
+      this.hasPlayed = false;
+      this.seekingEventReceived = false;
+      this.isSafari = /(Safari|iPhone|iPad|iPod)/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent) && !/BlackBerry/.test(navigator.platform);
+      this.on(WAITING, this.onGapJump);
+      this.on(PLAY, function() {
+        _this2.hasPlayed = true;
+      });
+      this.on(SEEKING, function() {
+        _this2.seekingEventReceived = true;
+      });
+    }
+  }, {
+    key: "_getIndex",
+    value: function _getIndex(buffered, time, threshold) {
+      if (!buffered || !buffered.length) {
+        return null;
+      }
+      if (buffered.length === 1 && buffered.end(0) - buffered.start(0) < 1e-6) {
+        return null;
+      }
+      var bufferedInfo = this._getBuffered(buffered);
+      var idx = null;
+      for (var i = 0; i < bufferedInfo.length; i++) {
+        var item = bufferedInfo[i];
+        if (item.start > time && (i === 0 || bufferedInfo[i - 1].end - time <= threshold)) {
+          idx = i;
+          break;
+        }
+      }
+      return idx;
+    }
+  }, {
+    key: "_getBuffered",
+    value: function _getBuffered(b) {
+      if (!b) {
+        return [];
+      }
+      var ret = [];
+      for (var i = 0; i < b.length; i++) {
+        ret.push({
+          start: b.start(i),
+          end: b.end(i)
+        });
+      }
+      return ret;
+    }
+  }], [{
+    key: "pluginName",
+    get: function get() {
+      return "gapJump";
+    }
+  }, {
+    key: "defaultConfig",
+    get: function get() {
+      return {
+        useGapJump: false,
+        smallGapLimit: 0.5,
+        gapDetectionThreshold: 0.3
+      };
+    }
+  }]);
+  return GapJump2;
+}(Plugin);
+GapJump.BROWSER_GAP_TOLERANCE = 1e-3;
+export { GapJump as default };

package/es/plugins/keyboard/index.d.ts

@@ -0,0 +1,89 @@
+export default Keyboard;
+export type IKeyboardConfig = {
+    [propName: string]: any;
+    seekStep?: number;
+    checkVisible?: boolean;
+    disableBodyTrigger?: boolean;
+    keyCodeMap?: {
+        [propName: string]: any;
+    };
+    disable: boolean;
+    playbackRate: number;
+    isIgnoreUserActive: boolean;
+};
+declare class Keyboard extends BasePlugin {
+    /**
+     * @type IKeyboardConfig
+     */
+    static get defaultConfig(): IKeyboardConfig;
+    mergekeyCodeMap(): void;
+    seekStep: number;
+    keyCodeMap: {
+        space: {
+            keyCode: number;
+            action: string;
+            disable: boolean;
+            disablePress: boolean;
+            noBodyTarget: boolean;
+        };
+        up: {
+            keyCode: number;
+            action: string;
+            disable: boolean;
+            disablePress: boolean;
+            noBodyTarget: boolean;
+        };
+        down: {
+            keyCode: number;
+            action: string;
+            disable: boolean;
+            disablePress: boolean;
+            noBodyTarget: boolean;
+        };
+        left: {
+            keyCode: number;
+            action: string;
+            disablePress: boolean;
+            disable: boolean;
+        };
+        right: {
+            keyCode: number;
+            action: string;
+            pressAction: string;
+            disablePress: boolean;
+            disable: boolean;
+        };
+        esc: {
+            keyCode: number;
+            action: string;
+            disablePress: boolean;
+            disable: boolean;
+        };
+    };
+    _keyState: {
+        isKeyDown: boolean;
+        isBodyKeyDown: boolean;
+        isPress: boolean;
+        tt: number;
+        playbackRate: number;
+    };
+    checkIsVisible(): boolean;
+    checkCode(code: any, isBodyTarget: any): boolean;
+    downVolume(event: any): void;
+    upVolume(event: any): void;
+    seek(event: any): void;
+    seekBack(event: any): void;
+    changePlaybackRate(event: any): void;
+    playPause(event: any): void;
+    exitFullscreen(event: any): void;
+    onBodyKeyDown: (event: any) => void;
+    onBodyKeyUp: (event: any) => void;
+    onKeydown: (event: any) => void;
+    onKeyup: (event: any) => void;
+    handleKeyDown(e: any): void;
+    handleKeyUp(e: any): void;
+    handleKeyCode(curKeyCode: any, event: any, isPress: any): void;
+    disable(): void;
+    enable(): void;
+}
+import { BasePlugin } from "../../plugin";

package/es/plugins/keyboard/index.js

@@ -0,0 +1,421 @@
+import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, defineProperty as _defineProperty, assertThisInitialized as _assertThisInitialized, createClass as _createClass, objectSpread2 as _objectSpread2 } from "../../_virtual/_rollupPluginBabelHelpers.js";
+import util from "../../utils/util.js";
+import { SHORTCUT } from "../../events.js";
+import BasePlugin from "../../plugin/basePlugin.js";
+import "delegate";
+function preventDefault(e) {
+  e.preventDefault();
+  e.returnValue = false;
+}
+function isDisableTag(el) {
+  var tagName = el.tagName;
+  if (tagName === "INPUT" || tagName === "TEXTAREA" || el.isContentEditable) {
+    return true;
+  }
+  return false;
+}
+var Keyboard = /* @__PURE__ */ function(_BasePlugin) {
+  _inherits(Keyboard2, _BasePlugin);
+  var _super = _createSuper(Keyboard2);
+  function Keyboard2() {
+    var _this;
+    _classCallCheck(this, Keyboard2);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "onBodyKeyDown", function(event) {
+      if (!_this.player) {
+        return;
+      }
+      var e = event || window.event;
+      var keyCode = e.keyCode;
+      var _assertThisInitialize = _assertThisInitialized(_this), _keyState = _assertThisInitialize._keyState, player = _assertThisInitialize.player;
+      var _this$config = _this.config, disable = _this$config.disable, disableBodyTrigger = _this$config.disableBodyTrigger, isIgnoreUserActive = _this$config.isIgnoreUserActive;
+      if (disable || disableBodyTrigger || !player.isUserActive && !isIgnoreUserActive || isDisableTag(e.target) || !_this.checkIsVisible() || e.metaKey || e.altKey || e.ctrlKey) {
+        _keyState.isBodyKeyDown = false;
+        return;
+      }
+      if (!event.repeat && !_keyState.isKeyDown) {
+        if ((e.target === document.body || _this.config.isGlobalTrigger && !isDisableTag(e.target)) && _this.checkCode(keyCode, true)) {
+          _keyState.isBodyKeyDown = true;
+        }
+        document.addEventListener("keyup", _this.onBodyKeyUp);
+      }
+      _keyState.isBodyKeyDown && _this.handleKeyDown(e);
+    });
+    _defineProperty(_assertThisInitialized(_this), "onBodyKeyUp", function(event) {
+      if (!_this.player) {
+        return;
+      }
+      document.removeEventListener("keyup", _this.onBodyKeyUp);
+      _this.handleKeyUp(event);
+    });
+    _defineProperty(_assertThisInitialized(_this), "onKeydown", function(event) {
+      if (!_this.player) {
+        return;
+      }
+      var e = event || window.event;
+      var _assertThisInitialize2 = _assertThisInitialized(_this), _keyState = _assertThisInitialize2._keyState;
+      if (!e.repeat) {
+        if (_this.config.disable || _this.config.disableRootTrigger || e.metaKey || e.altKey || e.ctrlKey) {
+          return;
+        }
+        if (!_this.player.isUserActive && !_this.config.isIgnoreUserActive) {
+          return;
+        }
+        if (e && (e.keyCode === 37 || _this.checkCode(e.keyCode)) && (e.target === _this.player.root || e.target === _this.player.video || e.target === _this.player.controls.el)) {
+          _keyState.isKeyDown = true;
+        }
+        _this.player.root.addEventListener("keyup", _this.onKeyup);
+      }
+      if (!_keyState.isKeyDown) {
+        return;
+      }
+      _this.handleKeyDown(e);
+    });
+    _defineProperty(_assertThisInitialized(_this), "onKeyup", function(event) {
+      if (!_this.player) {
+        return;
+      }
+      _this.player.root.removeEventListener("keyup", _this.onKeyup);
+      _this.handleKeyUp(event);
+    });
+    return _this;
+  }
+  _createClass(Keyboard2, [{
+    key: "mergekeyCodeMap",
+    value: function mergekeyCodeMap() {
+      var _this2 = this;
+      var extendkeyCodeMap = this.config.keyCodeMap;
+      if (extendkeyCodeMap) {
+        Object.keys(extendkeyCodeMap).map(function(key) {
+          if (!_this2.keyCodeMap[key]) {
+            _this2.keyCodeMap[key] = extendkeyCodeMap[key];
+          } else {
+            ["keyCode", "action", "disable", "pressAction", "disablePress", "isBodyTarget"].map(function(key1) {
+              extendkeyCodeMap[key][key1] && (_this2.keyCodeMap[key][key1] = extendkeyCodeMap[key][key1]);
+            });
+          }
+        });
+      }
+    }
+  }, {
+    key: "afterCreate",
+    value: function afterCreate() {
+      this.config.disable = !this.playerConfig.keyShortcut;
+      var seekStep = typeof this.config.seekStep === "function" ? this.config.seekStep(this.player) : this.config.seekStep;
+      if (!(!seekStep || typeof seekStep !== "number")) {
+        this.seekStep = seekStep;
+      }
+      this.keyCodeMap = {
+        space: {
+          keyCode: 32,
+          action: "playPause",
+          disable: false,
+          disablePress: false,
+          noBodyTarget: false
+        },
+        up: {
+          keyCode: 38,
+          action: "upVolume",
+          disable: false,
+          disablePress: false,
+          noBodyTarget: true
+        },
+        down: {
+          keyCode: 40,
+          action: "downVolume",
+          disable: false,
+          disablePress: false,
+          noBodyTarget: true
+        },
+        left: {
+          keyCode: 37,
+          action: "seekBack",
+          disablePress: false,
+          disable: false
+        },
+        right: {
+          keyCode: 39,
+          action: "seek",
+          pressAction: "changePlaybackRate",
+          disablePress: false,
+          disable: false
+        },
+        esc: {
+          keyCode: 27,
+          action: "exitFullscreen",
+          disablePress: true,
+          disable: false
+        }
+      };
+      this.mergekeyCodeMap();
+      this._keyState = {
+        isKeyDown: false,
+        isBodyKeyDown: false,
+        isPress: false,
+        tt: 0,
+        playbackRate: 0
+      };
+      this.player.root.addEventListener("keydown", this.onKeydown);
+      document.addEventListener("keydown", this.onBodyKeyDown);
+    }
+  }, {
+    key: "checkIsVisible",
+    value: function checkIsVisible() {
+      if (!this.config.checkVisible) {
+        return true;
+      }
+      var rec = this.player.root.getBoundingClientRect();
+      var height = rec.height, top = rec.top, bottom = rec.bottom;
+      var h = window.innerHeight;
+      if (top < 0 && top < 0 - height * 0.9 || bottom > 0 && bottom - h > height * 0.9) {
+        return false;
+      }
+      return true;
+    }
+  }, {
+    key: "checkCode",
+    value: function checkCode(code, isBodyTarget) {
+      var _this3 = 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;
+        }
+      });
+      return flag;
+    }
+  }, {
+    key: "downVolume",
+    value: function downVolume(event) {
+      var player = this.player;
+      if (player.volume <= 0) {
+        return;
+      }
+      var val = parseFloat((player.volume - 0.1).toFixed(1));
+      var props = {
+        volume: {
+          from: player.volume,
+          to: val
+        }
+      };
+      this.emitUserAction(event, "change_volume", {
+        props
+      });
+      if (val >= 0) {
+        player.volume = val;
+      } else {
+        player.volume = 0;
+      }
+    }
+  }, {
+    key: "upVolume",
+    value: function upVolume(event) {
+      var player = this.player;
+      if (player.volume >= 1) {
+        return;
+      }
+      var val = parseFloat((player.volume + 0.1).toFixed(1));
+      var props = {
+        volume: {
+          from: player.volume,
+          to: val
+        }
+      };
+      this.emitUserAction(event, "change_volume", {
+        props
+      });
+      if (val <= 1) {
+        player.volume = val;
+      } else {
+        player.volume = 1;
+      }
+    }
+  }, {
+    key: "seek",
+    value: function seek(event) {
+      var _this$player = this.player, currentTime = _this$player.currentTime, offsetCurrentTime = _this$player.offsetCurrentTime, duration = _this$player.duration, offsetDuration = _this$player.offsetDuration, timeSegments = _this$player.timeSegments;
+      var _time = offsetCurrentTime > -1 ? offsetCurrentTime : currentTime;
+      var _duration = offsetDuration || duration;
+      var _step = event.repeat && this.seekStep >= 4 ? parseInt(this.seekStep / 2, 10) : this.seekStep;
+      if (_time + _step <= _duration) {
+        _time = _time + _step;
+      } else {
+        _time = _duration;
+      }
+      var _seekTime = util.getCurrentTimeByOffset(_time, timeSegments);
+      var props = {
+        currentTime: {
+          from: currentTime,
+          to: _seekTime
+        }
+      };
+      this.emitUserAction(event, "seek", {
+        props
+      });
+      this.player.currentTime = _seekTime;
+    }
+  }, {
+    key: "seekBack",
+    value: function seekBack(event) {
+      var _this$player2 = this.player, currentTime = _this$player2.currentTime, offsetCurrentTime = _this$player2.offsetCurrentTime, timeSegments = _this$player2.timeSegments;
+      var _step = event.repeat ? parseInt(this.seekStep / 2, 10) : this.seekStep;
+      var _time = offsetCurrentTime > -1 ? offsetCurrentTime : currentTime;
+      var _seekTime = _time - _step;
+      if (_seekTime < 0) {
+        _seekTime = 0;
+      }
+      _seekTime = util.getCurrentTimeByOffset(_seekTime, timeSegments);
+      var props = {
+        currentTime: {
+          from: currentTime,
+          to: _seekTime
+        }
+      };
+      this.emitUserAction(event, "seek", {
+        props
+      });
+      this.player.currentTime = _seekTime;
+    }
+  }, {
+    key: "changePlaybackRate",
+    value: function changePlaybackRate(event) {
+      var _keyState = this._keyState, config = this.config, player = this.player;
+      if (_keyState.playbackRate === 0) {
+        _keyState.playbackRate = player.playbackRate;
+        player.playbackRate = config.playbackRate;
+      }
+    }
+  }, {
+    key: "playPause",
+    value: function playPause(event) {
+      var player = this.player;
+      if (!player) {
+        return;
+      }
+      this.emitUserAction(event, "switch_play_pause");
+      if (player.paused) {
+        player.play();
+      } else {
+        player.pause();
+      }
+    }
+  }, {
+    key: "exitFullscreen",
+    value: function exitFullscreen(event) {
+      var player = this.player;
+      var fullscreen = player.fullscreen, cssfullscreen = player.cssfullscreen;
+      if (fullscreen) {
+        this.emitUserAction("keyup", "switch_fullscreen", {
+          prop: "fullscreen",
+          from: fullscreen,
+          to: !fullscreen
+        });
+        player.exitFullscreen();
+      }
+      if (cssfullscreen) {
+        this.emitUserAction("keyup", "switch_css_fullscreen", {
+          prop: "cssfullscreen",
+          from: cssfullscreen,
+          to: !cssfullscreen
+        });
+        player.exitCssFullscreen();
+      }
+    }
+  }, {
+    key: "handleKeyDown",
+    value: function handleKeyDown(e) {
+      var _keyState = this._keyState;
+      if (e.repeat) {
+        _keyState.isPress = true;
+        var _t = Date.now();
+        if (_t - _keyState.tt < 200) {
+          return;
+        }
+        _keyState.tt = _t;
+      }
+      preventDefault(e);
+      this.handleKeyCode(e.keyCode, e, _keyState.isPress);
+    }
+  }, {
+    key: "handleKeyUp",
+    value: function handleKeyUp(e) {
+      var _keyState = this._keyState;
+      if (_keyState.playbackRate > 0) {
+        this.player.playbackRate = _keyState.playbackRate;
+        _keyState.playbackRate = 0;
+      }
+      _keyState.isKeyDown = false;
+      _keyState.isPress = false;
+      _keyState.tt = 0;
+    }
+  }, {
+    key: "handleKeyCode",
+    value: function handleKeyCode(curKeyCode, event, isPress) {
+      var arr = Object.keys(this.keyCodeMap);
+      for (var i = 0; i < arr.length; i++) {
+        var _this$keyCodeMap$arr$ = this.keyCodeMap[arr[i]], action = _this$keyCodeMap$arr$.action, keyCode = _this$keyCodeMap$arr$.keyCode, disable = _this$keyCodeMap$arr$.disable, pressAction = _this$keyCodeMap$arr$.pressAction, disablePress = _this$keyCodeMap$arr$.disablePress;
+        if (keyCode === curKeyCode) {
+          if (!disable && !(isPress && disablePress)) {
+            var _action = !isPress ? action : pressAction || action;
+            if (typeof _action === "function") {
+              action(event, this.player, isPress);
+            } else if (typeof _action === "string") {
+              if (typeof this[_action] === "function") {
+                this[_action](event, this.player, isPress);
+              }
+            }
+            this.emit(SHORTCUT, _objectSpread2({
+              key: arr[i],
+              target: event.target,
+              isPress
+            }, this.keyCodeMap[arr[i]]));
+          }
+          break;
+        }
+      }
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      this.player.root.removeEventListener("keydown", this.onKeydown);
+      document.removeEventListener("keydown", this.onBodyKeyDown);
+      this.player.root.removeEventListener("keyup", this.onKeyup);
+      document.removeEventListener("keyup", this.onBodyKeyUp);
+    }
+  }, {
+    key: "disable",
+    value: function disable() {
+      this.config.disable = true;
+    }
+  }, {
+    key: "enable",
+    value: function enable() {
+      this.config.disable = false;
+    }
+  }], [{
+    key: "pluginName",
+    get: function get() {
+      return "keyboard";
+    }
+  }, {
+    key: "defaultConfig",
+    get: function get() {
+      return {
+        seekStep: 10,
+        checkVisible: false,
+        disableBodyTrigger: false,
+        disableRootTrigger: false,
+        isGlobalTrigger: false,
+        keyCodeMap: {},
+        disable: false,
+        playbackRate: 2,
+        isIgnoreUserActive: false
+      };
+    }
+  }]);
+  return Keyboard2;
+}(BasePlugin);
+export { Keyboard as default };

package/es/plugins/loading/index.css

@@ -0,0 +1,58 @@
+@keyframes loadingRotate {
+  0% {
+    transform: rotate(0);
+  }
+  25% {
+    transform: rotate(90deg);
+  }
+  50% {
+    transform: rotate(180deg);
+  }
+  75% {
+    transform: rotate(270deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+@keyframes loadingDashOffset {
+  0% {
+    stroke-dashoffset: 236;
+  }
+  100% {
+    stroke-dashoffset: 0;
+  }
+}
+xg-loading-inner {
+  display: block;
+  height: 100%;
+  width: 100%;
+  transform-origin: center;
+  animation: loadingRotate 1s 0.1s linear infinite;
+}
+.xgplayer-loading {
+  display: none;
+  width: 70px;
+  height: 70px;
+  overflow: hidden;
+  position: absolute;
+  z-index: 10;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  pointer-events: none;
+}
+.xgplayer-loading svg, .xgplayer-loading img {
+  width: 100%;
+  height: 100%;
+}
+.xgplayer-mobile .xgplayer-loading {
+  width: 50px;
+  height: 50px;
+}
+.xgplayer-isloading .xgplayer-loading {
+  display: block;
+}
+.xgplayer-nostart .xgplayer-loading, .xgplayer-pause .xgplayer-loading, .xgplayer-is-enter .xgplayer-loading, .xgplayer-is-ended .xgplayer-loading, .xgplayer-is-error .xgplayer-loading {
+  display: none;
+}