xgplayer 2.32.5 → 2.32.6

package/es/plugins/mobile/index.scss

@@ -0,0 +1,180 @@
+@import '../common/thumbnail.scss';
+$color: #FF0000;
+
+.xgplayer {
+  xg-trigger {
+    -webkit-user-select:none;
+    -moz-user-select:none;
+    -ms-user-select:none;
+    -khtml-user-select:none;
+    user-select:none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    .time-preview {
+      display: none;
+      pointer-events: none;
+      position: absolute;
+      width: 200px;
+      margin: 0 auto;
+      padding: 0 20px 30px;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      color: #fff;
+      text-shadow: 0 0 1px rgba(0,0,0,0.54);
+      font-size: 17px;
+      text-align: center;
+      pointer-events: none;
+      span {
+        line-height: 24px;
+        &.xg-cur {
+          color: #FF0000;
+        }
+      }
+      .xg-seek-show {
+        transform: translateX(-10px);
+        &.xg-back {
+          .xg-seek-pre {
+            transform: rotate(180deg) translateX(-5px);
+          }
+        }
+        &.hide-seek-icon {
+          .xg-seek-icon {
+            display: none;
+          }
+        }
+      }
+      .xg-bar {
+        width: 96px;
+        height: 2px;
+        margin: 0 auto;
+        margin-top: 8px;
+        border-radius: 10px;
+        box-sizing: content-box;
+        background: rgba(255,255,255,0.3);
+        .xg-curbar {
+          width: 0;
+          height: 100%;
+          background-color: #FF0000;
+        }
+        &.hide {
+          display: none;
+        }
+      }
+    }
+
+    .mobile-thumbnail {
+      position: relative;
+      left: 50%;
+      transform: translateX(-50%);
+    }
+
+    .xg-top-note {
+      position: absolute;
+      height: 32px;
+      width: 135px;
+      top: 26px;
+      left: 50%;
+      margin-left: -78px;
+      background: rgba(0, 0, 0, 0.3);
+      border-radius: 100px;
+      color: #fff;
+      span {
+        display: block;
+        font-size: 13px;
+        line-height: 32px;
+        height: 32px;
+        font-size: 13px;
+        text-align: center;
+      }
+      i {
+        color: $color;
+        margin: 0 5px
+      }
+    }
+    .xg-playbackrate {
+      display: none;
+    }
+    &[data-xg-action=seeking] {
+      .time-preview {
+        display: block;
+      }
+    }
+    &[data-xg-action=playbackrate] {
+      .xg-playbackrate {
+        display: block;
+      }
+    }
+  }
+  .gradient {
+    display: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    pointer-events: none;
+    background-image: linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.36) 20%,rgba(0,0,0,0) 36%,rgba(0,0,0,0) 70%,rgba(0,0,0,0.24) 77%,rgba(0,0,0,0.36) 83%,rgba(0,0,0,.6));
+
+    &.top {
+      background-image: linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.36) 20%,rgba(0,0,0,0) 36%,rgba(0,0,0,0) 70%);
+    }
+
+    &.bottom {
+      background-image: linear-gradient(rgba(0,0,0,0) 70%,rgba(0,0,0,0.24) 77%,rgba(0,0,0,0.36) 83%,rgba(0,0,0,.6));
+    }
+
+    &.none {
+      background-image: initial;
+    }
+  }
+}
+.xgplayer-mobile {
+  .xgplayer-controls {
+    background-image: initial;
+  }
+
+  &.xgplayer-playing {
+    .gradient {
+      display: block;
+    }
+  }
+
+  &.xgplayer-inactive {
+    .gradient {
+      background-image: initial;
+    }
+  }
+
+  .xgmask {
+    position: absolute;
+    height: 100%;
+    z-index: 10;
+    top: 0;
+    left: 0;
+    width: 100%;
+    pointer-events: none;
+    background-color: rgba(0,0,0,0);
+  }
+  /**/
+}
+
+@media (prefers-color-scheme: dark) {
+  .xgplayer-mobile {
+    xg-trigger .time-preview  {
+      color: #fff;
+      span.xg-cur {
+        color: #FF0000;
+      }
+      .xg-bar {
+        background-color: rgba(255, 255, 255, 0.3);
+        &.xg-curbar {
+          background-color: #FF0000;
+        }
+      }
+    }
+  }
+}

package/es/plugins/mobile/touch.d.ts

@@ -0,0 +1,43 @@
+export default Touche;
+declare class Touche {
+    constructor(dom: any, config?: {
+        eventType: string;
+    });
+    _pos: {
+        moving: boolean;
+        start: boolean;
+        x: number;
+        y: number;
+    };
+    config: {
+        pressDelay: number;
+        dbClickDelay: number;
+        disablePress: boolean;
+        disableDbClick: boolean;
+        miniStep: number;
+        needPreventDefault: boolean;
+    };
+    root: any;
+    events: {
+        start: string;
+        end: string;
+        move: string;
+        cancel: string;
+    };
+    pressIntrvalId: NodeJS.Timeout;
+    dbIntrvalId: NodeJS.Timeout;
+    __handlers: {};
+    _initEvent(): void;
+    __setPress(e: any): void;
+    __clearPress(): void;
+    __setDb(e: any): void;
+    __clearDb(): void;
+    on(event: any, handler: any): void;
+    off(event: any, handler: any): void;
+    trigger(event: any, e: any): void;
+    onTouchStart: (e: any) => void;
+    onTouchCancel: (e: any) => void;
+    onTouchEnd: (e: any) => void;
+    onTouchMove: (e: any) => void;
+    destroy(): void;
+}

package/es/plugins/mobile/touch.js

@@ -0,0 +1,214 @@
+import { createClass as _createClass, classCallCheck as _classCallCheck, defineProperty as _defineProperty } from "../../_virtual/_rollupPluginBabelHelpers.js";
+var EVENTS = {
+  PRESS: "press",
+  PRESS_END: "pressend",
+  DOUBlE_CLICK: "doubleclick",
+  CLICK: "click",
+  TOUCH_MOVE: "touchmove",
+  TOUCH_START: "touchstart",
+  TOUCH_END: "touchend"
+};
+var TOUCHS = {
+  start: "touchstart",
+  end: "touchend",
+  move: "touchmove",
+  cancel: "touchcancel"
+};
+var MOUSES = {
+  start: "mousedown",
+  end: "mouseup",
+  move: "mousemove",
+  cancel: "mouseleave"
+};
+function getTouch(touches) {
+  if (touches && touches.length > 0) {
+    return touches[touches.length - 1];
+  } else {
+    return null;
+  }
+}
+function getDefaultConfig() {
+  return {
+    pressDelay: 600,
+    dbClickDelay: 200,
+    disablePress: false,
+    disableDbClick: false,
+    miniStep: 2,
+    needPreventDefault: true
+  };
+}
+var Touche = /* @__PURE__ */ function() {
+  function Touche2(dom) {
+    var _this = this;
+    var _config = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {
+      eventType: "touch"
+    };
+    _classCallCheck(this, Touche2);
+    _defineProperty(this, "onTouchStart", function(e) {
+      var _pos = _this._pos, root = _this.root;
+      var touch = getTouch(e.touches);
+      _pos.x = touch ? parseInt(touch.pageX, 10) : e.pageX;
+      _pos.y = touch ? parseInt(touch.pageX, 10) : e.pageX;
+      _pos.start = true;
+      _this.__setPress(e);
+      root.addEventListener(_this.events.end, _this.onTouchEnd);
+      root.addEventListener(_this.events.cancel, _this.onTouchCancel);
+      root.addEventListener(_this.events.move, _this.onTouchMove);
+      _this.trigger(EVENTS.TOUCH_START, e);
+    });
+    _defineProperty(this, "onTouchCancel", function(e) {
+      _this.onTouchEnd(e);
+    });
+    _defineProperty(this, "onTouchEnd", function(e) {
+      var _pos = _this._pos, root = _this.root;
+      _this.__clearPress();
+      root.removeEventListener(_this.events.cancel, _this.onTouchCancel);
+      root.removeEventListener(_this.events.end, _this.onTouchEnd);
+      root.removeEventListener(_this.events.move, _this.onTouchMove);
+      e.moving = _pos.moving;
+      e.press = _pos.press;
+      _pos.press && _this.trigger(EVENTS.PRESS_END, e);
+      _this.trigger(EVENTS.TOUCH_END, e);
+      !_pos.press && !_pos.moving && _this.__setDb(e);
+      _pos.press = false;
+      _pos.start = false;
+      _pos.moving = false;
+    });
+    _defineProperty(this, "onTouchMove", function(e) {
+      var _pos = _this._pos, config = _this.config;
+      var touch = getTouch(e.touches);
+      var x = touch ? parseInt(touch.pageX, 10) : e.pageX;
+      var y = touch ? parseInt(touch.pageY, 10) : e.pageX;
+      var diffx = x - _pos.x;
+      var diffy = y - _pos.y;
+      if (Math.abs(diffy) < config.miniStep && Math.abs(diffx) < config.miniStep) {
+        return;
+      }
+      _this.__clearPress();
+      _pos.press && _this.trigger(EVENTS.PRESS_END, e);
+      _pos.press = false;
+      _pos.moving = true;
+      _this.trigger(EVENTS.TOUCH_MOVE, e);
+    });
+    this._pos = {
+      moving: false,
+      start: false,
+      x: 0,
+      y: 0
+    };
+    this.config = getDefaultConfig();
+    Object.keys(_config).map(function(key) {
+      _this.config[key] = _config[key];
+    });
+    this.root = dom;
+    this.events = _config.eventType === "mouse" ? MOUSES : TOUCHS;
+    this.pressIntrvalId = null;
+    this.dbIntrvalId = null;
+    this.__handlers = {};
+    this._initEvent();
+  }
+  _createClass(Touche2, [{
+    key: "_initEvent",
+    value: function _initEvent() {
+      this.root.addEventListener(this.events.start, this.onTouchStart);
+    }
+  }, {
+    key: "__setPress",
+    value: function __setPress(e) {
+      var _this2 = this;
+      var config = this.config;
+      if (this.pressIntrvalId) {
+        this.__clearPress();
+      }
+      this.pressIntrvalId = setTimeout(function() {
+        _this2.trigger(EVENTS.PRESS, e);
+        _this2._pos.press = true;
+        _this2.__clearPress();
+      }, config.pressDelay);
+    }
+  }, {
+    key: "__clearPress",
+    value: function __clearPress() {
+      window.clearTimeout(this.pressIntrvalId);
+      this.pressIntrvalId = null;
+    }
+  }, {
+    key: "__setDb",
+    value: function __setDb(e) {
+      var _this3 = this;
+      var config = this.config;
+      if (this.dbIntrvalId) {
+        this.__clearDb();
+        this.trigger(EVENTS.DOUBlE_CLICK, e);
+        return;
+      }
+      this.dbIntrvalId = setTimeout(function() {
+        _this3.__clearDb();
+        if (!_this3._pos.start && !_this3._pos.press && !_this3._pos.moving) {
+          _this3.trigger(EVENTS.CLICK, e);
+        }
+      }, config.dbClickDelay);
+    }
+  }, {
+    key: "__clearDb",
+    value: function __clearDb() {
+      clearTimeout(this.dbIntrvalId);
+      this.dbIntrvalId = null;
+    }
+  }, {
+    key: "on",
+    value: function on(event, handler) {
+      if (!this.__handlers[event]) {
+        this.__handlers[event] = [];
+      }
+      this.__handlers[event].push(handler);
+    }
+  }, {
+    key: "off",
+    value: function off(event, handler) {
+      if (!this.__handlers[event]) {
+        return;
+      }
+      var handlers = this.__handlers[event];
+      var index = -1;
+      for (var i = 0; i < handlers.length; i++) {
+        if (handlers[i] === handler) {
+          index = i;
+          break;
+        }
+      }
+      if (index >= 0) {
+        this.__handlers[event].splice(index, 1);
+      }
+    }
+  }, {
+    key: "trigger",
+    value: function trigger(event, e) {
+      if (!this.__handlers[event]) {
+        return;
+      }
+      this.__handlers[event].map(function(handler) {
+        try {
+          handler(e);
+        } catch (error) {
+          console.error("trigger>>:".concat(event), error);
+        }
+      });
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      var _this4 = this;
+      var map = {
+        touchend: "onTouchEnd",
+        touchmove: "onTouchMove",
+        touchstart: "onTouchStart"
+      };
+      Object.keys(map).forEach(function(key) {
+        _this4.root.removeEventListener(key, _this4[map[key]]);
+      });
+    }
+  }]);
+  return Touche2;
+}();
+export { Touche as default };

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

@@ -0,0 +1,5 @@
+export default class NetAdaption extends BasePlugin {
+    _timer: NodeJS.Timer;
+    _checkStatus(): void;
+}
+import BasePlugin from "../../plugin/basePlugin";

package/es/plugins/pc/index.css

@@ -0,0 +1,3 @@
+.xgplayer.xgplayer-inactive {
+  cursor: none;
+}

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

@@ -0,0 +1,14 @@
+export default class PCPlugin extends BasePlugin {
+    static get defaultConfig(): {};
+    _clickCount: number;
+    initEvents(): void;
+    switchPlayPause(e: any): void;
+    onMouseMove: (e: any) => void;
+    onMouseEnter: (e: any) => void;
+    onMouseLeave: (e: any) => void;
+    onContextmenu(e: any): void;
+    onVideoClick: (e: any) => void;
+    clickTimer: any;
+    onVideoDblClick: (e: any) => void;
+}
+import { BasePlugin } from "../../plugin";

package/es/plugins/pc/index.js

@@ -0,0 +1,199 @@
+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 sniffer from "../../utils/sniffer.js";
+import BasePlugin from "../../plugin/basePlugin.js";
+import "delegate";
+import { runHooks } from "../../plugin/hooksDescriptor.js";
+var MOUSE_EVENTS = {
+  mouseenter: "onMouseEnter",
+  mouseleave: "onMouseLeave",
+  mousemove: "onMouseMove"
+};
+var HOOKS = ["videoClick", "videoDbClick"];
+var PCPlugin = /* @__PURE__ */ function(_BasePlugin) {
+  _inherits(PCPlugin2, _BasePlugin);
+  var _super = _createSuper(PCPlugin2);
+  function PCPlugin2() {
+    var _this;
+    _classCallCheck(this, PCPlugin2);
+    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), "onMouseMove", function(e) {
+      var _assertThisInitialize = _assertThisInitialized(_this), player = _assertThisInitialize.player, playerConfig = _assertThisInitialize.playerConfig;
+      if (!player.isActive) {
+        player.focus({
+          autoHide: !playerConfig.closeDelayBlur
+        });
+        !playerConfig.closeFocusVideoFocus && player.media.focus();
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "onMouseEnter", function(e) {
+      var _assertThisInitialize2 = _assertThisInitialized(_this), playerConfig = _assertThisInitialize2.playerConfig, player = _assertThisInitialize2.player;
+      !playerConfig.closeFocusVideoFocus && player.media.focus();
+      if (playerConfig.closeDelayBlur) {
+        player.focus({
+          autoHide: false
+        });
+      } else {
+        player.focus();
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "onMouseLeave", function(e) {
+      var _this$playerConfig = _this.playerConfig, closePlayerBlur = _this$playerConfig.closePlayerBlur, leavePlayerTime = _this$playerConfig.leavePlayerTime, closeDelayBlur = _this$playerConfig.closeDelayBlur;
+      if (!closePlayerBlur && !closeDelayBlur) {
+        if (leavePlayerTime) {
+          _this.player.focus({
+            autoHide: true,
+            delay: leavePlayerTime
+          });
+        } else {
+          _this.player.blur();
+        }
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "onVideoClick", function(e) {
+      var _assertThisInitialize3 = _assertThisInitialized(_this), player = _assertThisInitialize3.player, playerConfig = _assertThisInitialize3.playerConfig;
+      if (e.target && playerConfig.closeVideoClick) {
+        return;
+      }
+      if (e.target === player.root || e.target === player.media || e.target === player.innerContainer || e.target === player.media.__canvas) {
+        e.preventDefault();
+        if (!playerConfig.closeVideoStopPropagation) {
+          e.stopPropagation();
+        }
+        _this._clickCount++;
+        if (_this.clickTimer) {
+          clearTimeout(_this.clickTimer);
+          _this.clickTimer = null;
+        }
+        _this.clickTimer = setTimeout(function() {
+          if (!_this._clickCount) {
+            return;
+          }
+          _this._clickCount--;
+          runHooks(_assertThisInitialized(_this), HOOKS[0], function(plugin, data) {
+            _this.switchPlayPause(data.e);
+          }, {
+            e,
+            paused: player.paused
+          });
+          clearTimeout(_this.clickTimer);
+          _this.clickTimer = null;
+        }, 300);
+      }
+    });
+    _defineProperty(_assertThisInitialized(_this), "onVideoDblClick", function(e) {
+      var _assertThisInitialize4 = _assertThisInitialized(_this), player = _assertThisInitialize4.player, playerConfig = _assertThisInitialize4.playerConfig;
+      if (playerConfig.closeVideoDblclick || !e.target || e.target !== player.media && e.target !== player.media.__canvas) {
+        return;
+      }
+      if (!playerConfig.closeVideoClick && _this._clickCount < 2) {
+        _this._clickCount = 0;
+        return;
+      }
+      _this._clickCount = 0;
+      if (_this.clickTimer) {
+        clearTimeout(_this.clickTimer);
+        _this.clickTimer = null;
+      }
+      e.preventDefault();
+      e.stopPropagation();
+      runHooks(_assertThisInitialized(_this), HOOKS[1], function(plugin, data) {
+        _this.emitUserAction(data.e, "switch_fullscreen", {
+          props: "fullscreen",
+          from: player.fullscreen,
+          to: !player.fullscreen
+        });
+        player.fullscreen ? player.exitFullscreen() : player.getFullscreen();
+      }, {
+        e,
+        fullscreen: player.fullscreen
+      });
+    });
+    return _this;
+  }
+  _createClass(PCPlugin2, [{
+    key: "afterCreate",
+    value: function afterCreate() {
+      var _this2 = this;
+      this._clickCount = 0;
+      HOOKS.map(function(item) {
+        _this2.__hooks[item] = null;
+      });
+      var isMobileSimulateMode = this.playerConfig.isMobileSimulateMode;
+      if (isMobileSimulateMode === "mobile" || sniffer.device === "mobile" && !sniffer.os.isIpad) {
+        return;
+      }
+      this.initEvents();
+    }
+  }, {
+    key: "initEvents",
+    value: function initEvents() {
+      var _this3 = this;
+      var _this$player = this.player, video = _this$player.video, root = _this$player.root;
+      var enableContextmenu = this.playerConfig.enableContextmenu;
+      root && root.addEventListener("click", this.onVideoClick, false);
+      root && root.addEventListener("dblclick", this.onVideoDblClick, false);
+      Object.keys(MOUSE_EVENTS).map(function(item) {
+        root.addEventListener(item, _this3[MOUSE_EVENTS[item]], false);
+      });
+      enableContextmenu && video && video.addEventListener("contextmenu", this.onContextmenu, false);
+    }
+  }, {
+    key: "switchPlayPause",
+    value: function switchPlayPause(e) {
+      var player = this.player;
+      this.emitUserAction(e, "switch_play_pause", {
+        props: "paused",
+        from: player.paused,
+        to: !player.paused
+      });
+      if (!player.ended) {
+        player.paused ? player.play() : player.pause();
+      } else {
+        player.duration !== Infinity && player.duration > 0 && player.replay();
+      }
+    }
+  }, {
+    key: "onContextmenu",
+    value: function onContextmenu(e) {
+      e = e || window.event;
+      if (e.preventDefault) {
+        e.preventDefault();
+      }
+      if (e.stopPropagation) {
+        e.stopPropagation();
+      } else {
+        e.returnValue = false;
+        e.cancelBubble = true;
+      }
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      var _this4 = this;
+      var _this$player2 = this.player, video = _this$player2.video, root = _this$player2.root;
+      this.clickTimer && clearTimeout(this.clickTimer);
+      root.removeEventListener("click", this.onVideoClick, false);
+      root.removeEventListener("dblclick", this.onVideoDblClick, false);
+      video.removeEventListener("contextmenu", this.onContextmenu, false);
+      Object.keys(MOUSE_EVENTS).map(function(item) {
+        root.removeEventListener(item, _this4[MOUSE_EVENTS[item]], false);
+      });
+    }
+  }], [{
+    key: "pluginName",
+    get: function get() {
+      return "pc";
+    }
+  }, {
+    key: "defaultConfig",
+    get: function get() {
+      return {};
+    }
+  }]);
+  return PCPlugin2;
+}(BasePlugin);
+export { PCPlugin as default };

package/es/plugins/pc/index.scss

@@ -0,0 +1,5 @@
+.xgplayer {
+  &.xgplayer-inactive{
+    cursor: none;
+  }
+}

package/es/plugins/pip/index.css

@@ -0,0 +1,12 @@
+.xgplayer .xgplayer-pip .xg-exit-pip {
+  display: none;
+}
+.xgplayer .xgplayer-pip .xg-get-pip {
+  display: block;
+}
+.xgplayer .xgplayer-pip[data-state=pip] .xg-exit-pip {
+  display: block;
+}
+.xgplayer .xgplayer-pip[data-state=pip] .xg-get-pip {
+  display: none;
+}