xgplayer 2.32.5 → 2.32.6

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

@@ -0,0 +1,37 @@
+export default PIP;
+declare class PIP extends IconPlugin {
+    static get defaultConfig(): {
+        position: string;
+        index: number;
+        showIcon: boolean;
+    };
+    static checkWebkitSetPresentationMode(video: any): boolean;
+    beforeCreate(args: any): void;
+    pMode: any;
+    registerIcons(): {
+        pipIcon: {
+            icon: any;
+            class: string;
+        };
+        pipIconExit: {
+            icon: any;
+            class: string;
+        };
+    };
+    initIcons(): void;
+    initPipEvents(): void;
+    leavePIPCallback: () => void;
+    enterPIPCallback: (e: any) => void;
+    pipWindow: any;
+    onWebkitpresentationmodechanged: (e: any) => void;
+    switchPIP: (e: any) => boolean;
+    requestPIP(): boolean;
+    /**
+     * 退出画中画
+     */
+    exitPIP(): boolean;
+    get isPip(): boolean;
+    isPIPAvailable(): boolean;
+    render(): string;
+}
+import IconPlugin from "../common/iconPlugin";

package/es/plugins/pip/index.js

@@ -0,0 +1,222 @@
+import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, defineProperty as _defineProperty, assertThisInitialized as _assertThisInitialized, createClass as _createClass, get as _get, getPrototypeOf as _getPrototypeOf } from "../../_virtual/_rollupPluginBabelHelpers.js";
+import util from "../../utils/util.js";
+import { COMPLETE, PIP_CHANGE } from "../../events.js";
+import "../../utils/debug.js";
+import { POSITIONS } from "../../plugin/plugin.js";
+import { xgIconTips } from "../common/iconTools.js";
+import Icon from "../common/iconPlugin.js";
+import PipIcon from "../assets/pipIcon.js";
+import PipIconExit from "../assets/pipIconExit.js";
+var PresentationMode = {
+  PIP: "picture-in-picture",
+  INLINE: "inline",
+  FULLSCREEN: "fullscreen"
+};
+var PIP = /* @__PURE__ */ function(_IconPlugin) {
+  _inherits(PIP2, _IconPlugin);
+  var _super = _createSuper(PIP2);
+  function PIP2() {
+    var _this;
+    _classCallCheck(this, PIP2);
+    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), "switchPIP", function(e) {
+      if (!_this.isPIPAvailable()) {
+        return false;
+      }
+      e.stopPropagation && e.stopPropagation();
+      if (_this.isPip) {
+        _this.exitPIP();
+        _this.emitUserAction(e, "change_pip", {
+          props: "pip",
+          from: true,
+          to: false
+        });
+        _this.setAttr("data-state", "normal");
+      } else if (_this.player.media.readyState === 4) {
+        _this.requestPIP();
+        _this.emitUserAction(e, "change_pip", {
+          props: "pip",
+          from: false,
+          to: true
+        });
+        _this.setAttr("data-state", "pip");
+      }
+    });
+    return _this;
+  }
+  _createClass(PIP2, [{
+    key: "beforeCreate",
+    value: function beforeCreate(args) {
+      if (typeof args.player.config.pip === "boolean") {
+        args.config.showIcon = args.player.config.pip;
+      }
+    }
+  }, {
+    key: "afterCreate",
+    value: function afterCreate() {
+      var _this2 = this;
+      if (!this.isPIPAvailable()) {
+        return;
+      }
+      _get(_getPrototypeOf(PIP2.prototype), "afterCreate", this).call(this);
+      this.pMode = PresentationMode.INLINE;
+      this.initPipEvents();
+      if (this.config.showIcon) {
+        this.initIcons();
+      }
+      this.once(COMPLETE, function() {
+        if (_this2.config.showIcon) {
+          util.removeClass(_this2.find(".xgplayer-icon"), "xg-icon-disable");
+          _this2.bind("click", _this2.switchPIP);
+        }
+      });
+    }
+  }, {
+    key: "registerIcons",
+    value: function registerIcons() {
+      return {
+        pipIcon: {
+          icon: PipIcon,
+          class: "xg-get-pip"
+        },
+        pipIconExit: {
+          icon: PipIconExit,
+          class: "xg-exit-pip"
+        }
+      };
+    }
+  }, {
+    key: "initIcons",
+    value: function initIcons() {
+      var icons = this.icons;
+      this.appendChild(".xgplayer-icon", icons.pipIcon);
+      this.appendChild(".xgplayer-icon", icons.pipIconExit);
+    }
+  }, {
+    key: "initPipEvents",
+    value: function initPipEvents() {
+      var _this3 = this;
+      var player = this.player;
+      this.leavePIPCallback = function() {
+        var paused = player.paused;
+        util.setTimeout(_this3, function() {
+          !paused && player.mediaPlay();
+        }, 0);
+        !paused && player.mediaPlay();
+        _this3.setAttr("data-state", "normal");
+        player.emit(PIP_CHANGE, false);
+      };
+      this.enterPIPCallback = function(e) {
+        player.emit(PIP_CHANGE, true);
+        _this3.pipWindow = e.pictureInPictureWindow;
+        _this3.setAttr("data-state", "pip");
+      };
+      this.onWebkitpresentationmodechanged = function(e) {
+        var mode = player.media.webkitPresentationMode;
+        if (_this3.pMode === PresentationMode.FULLSCREEN && mode !== PresentationMode.FULLSCREEN) {
+          player.onFullscreenChange(null, false);
+        }
+        _this3.pMode = mode;
+        if (mode === PresentationMode.PIP) {
+          _this3.enterPIPCallback(e);
+        } else if (mode === PresentationMode.INLINE) {
+          _this3.leavePIPCallback(e);
+        }
+      };
+      if (player.media) {
+        player.media.addEventListener("enterpictureinpicture", this.enterPIPCallback);
+        player.media.addEventListener("leavepictureinpicture", this.leavePIPCallback);
+        PIP2.checkWebkitSetPresentationMode(player.media) && player.media.addEventListener("webkitpresentationmodechanged", this.onWebkitpresentationmodechanged);
+      }
+    }
+  }, {
+    key: "requestPIP",
+    value: function requestPIP() {
+      var player = this.player, playerConfig = this.playerConfig;
+      if (!this.isPIPAvailable() || this.isPip) {
+        return;
+      }
+      try {
+        var poster = playerConfig.poster;
+        if (poster) {
+          player.media.poster = util.typeOf(poster) === "String" ? poster : poster.poster;
+        }
+        PIP2.checkWebkitSetPresentationMode(player.media) ? player.media.webkitSetPresentationMode("picture-in-picture") : player.media.requestPictureInPicture();
+        return true;
+      } catch (reason) {
+        console.error("requestPiP", reason);
+        return false;
+      }
+    }
+  }, {
+    key: "exitPIP",
+    value: function exitPIP() {
+      var player = this.player;
+      try {
+        if (this.isPIPAvailable() && this.isPip) {
+          PIP2.checkWebkitSetPresentationMode(player.media) ? player.media.webkitSetPresentationMode("inline") : document.exitPictureInPicture();
+        }
+        return true;
+      } catch (reason) {
+        console.error("exitPIP", reason);
+        return false;
+      }
+    }
+  }, {
+    key: "isPip",
+    get: function get() {
+      var player = this.player;
+      return document.pictureInPictureElement && document.pictureInPictureElement === player.media || player.media.webkitPresentationMode === PresentationMode.PIP;
+    }
+  }, {
+    key: "isPIPAvailable",
+    value: function isPIPAvailable() {
+      var video = this.player.media;
+      var _isEnabled = util.typeOf(document.pictureInPictureEnabled) === "Boolean" ? document.pictureInPictureEnabled : true;
+      return _isEnabled && (util.typeOf(video.disablePictureInPicture) === "Boolean" && !video.disablePictureInPicture || video.webkitSupportsPresentationMode && util.typeOf(video.webkitSetPresentationMode) === "Function");
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      _get(_getPrototypeOf(PIP2.prototype), "destroy", this).call(this);
+      var player = this.player;
+      player.media.removeEventListener("enterpictureinpicture", this.enterPIPCallback);
+      player.media.removeEventListener("leavepictureinpicture", this.leavePIPCallback);
+      PIP2.checkWebkitSetPresentationMode(player.media) && player.media.removeEventListener("webkitpresentationmodechanged", this.onWebkitpresentationmodechanged);
+      this.exitPIP();
+      this.unbind("click", this.btnClick);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      if (!this.config.showIcon || !this.isPIPAvailable()) {
+        return;
+      }
+      return '<xg-icon class="xgplayer-pip">\n      <div class="xgplayer-icon xg-icon-disable">\n      </div>\n      '.concat(xgIconTips(this, "PIP", this.playerConfig.isHideTips), "\n    </xg-icon>");
+    }
+  }], [{
+    key: "pluginName",
+    get: function get() {
+      return "pip";
+    }
+  }, {
+    key: "defaultConfig",
+    get: function get() {
+      return {
+        position: POSITIONS.CONTROLS_RIGHT,
+        index: 6,
+        showIcon: false
+      };
+    }
+  }, {
+    key: "checkWebkitSetPresentationMode",
+    value: function checkWebkitSetPresentationMode(video) {
+      return typeof video.webkitSetPresentationMode === "function";
+    }
+  }]);
+  return PIP2;
+}(Icon);
+export { PIP as default };

package/es/plugins/pip/index.scss

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

package/es/plugins/play/index.css

@@ -0,0 +1,12 @@
+.xgplayer .xgplayer-play .xg-icon-play {
+  display: none;
+}
+.xgplayer .xgplayer-play .xg-icon-pause {
+  display: block;
+}
+.xgplayer .xgplayer-play[data-state=pause] .xg-icon-play {
+  display: block;
+}
+.xgplayer .xgplayer-play[data-state=pause] .xg-icon-pause {
+  display: none;
+}

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

@@ -0,0 +1,23 @@
+export default Play;
+declare class Play extends IconPlugin {
+    static get defaultConfig(): {
+        position: string;
+        index: number;
+        disable: boolean;
+    };
+    btnClick(e: any): boolean;
+    registerIcons(): {
+        play: {
+            icon: any;
+            class: string;
+        };
+        pause: {
+            icon: any;
+            class: string;
+        };
+    };
+    initIcons(): void;
+    animate(paused: any): void;
+    render(): string;
+}
+import IconPlugin from "../common/iconPlugin";

package/es/plugins/play/index.js

@@ -0,0 +1,127 @@
+import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, createClass as _createClass, get as _get, getPrototypeOf as _getPrototypeOf } from "../../_virtual/_rollupPluginBabelHelpers.js";
+import "../../utils/util.js";
+import { PAUSE, ERROR, EMPTIED, PLAY } from "../../events.js";
+import "../../utils/debug.js";
+import { POSITIONS } from "../../plugin/plugin.js";
+import { xgIconTips } from "../common/iconTools.js";
+import Icon from "../common/iconPlugin.js";
+import PlaySvg from "../assets/play.js";
+import PauseSvg from "../assets/pause.js";
+var Play = /* @__PURE__ */ function(_IconPlugin) {
+  _inherits(Play2, _IconPlugin);
+  var _super = _createSuper(Play2);
+  function Play2() {
+    _classCallCheck(this, Play2);
+    return _super.apply(this, arguments);
+  }
+  _createClass(Play2, [{
+    key: "afterCreate",
+    value: function afterCreate() {
+      var _this = this;
+      _get(_getPrototypeOf(Play2.prototype), "afterCreate", this).call(this);
+      var player = this.player, config = this.config;
+      if (config.disable) {
+        return;
+      }
+      this.initIcons();
+      this.btnClick = this.btnClick.bind(this);
+      this.bind(["touchend", "click"], this.btnClick);
+      this.on([PAUSE, ERROR, EMPTIED], function() {
+        _this.animate(player.paused);
+      });
+      this.on(PLAY, function() {
+        _this.animate(player.paused);
+      });
+      this.animate(true);
+    }
+  }, {
+    key: "registerIcons",
+    value: function registerIcons() {
+      return {
+        play: {
+          icon: PlaySvg,
+          class: "xg-icon-play"
+        },
+        pause: {
+          icon: PauseSvg,
+          class: "xg-icon-pause"
+        }
+      };
+    }
+  }, {
+    key: "btnClick",
+    value: function btnClick(e) {
+      e.preventDefault();
+      e.stopPropagation();
+      var player = this.player;
+      this.emitUserAction(e, "switch_play_pause", {
+        prop: "paused",
+        from: player.paused,
+        to: !player.paused
+      });
+      if (player.ended) {
+        player.replay();
+      } else if (player.paused) {
+        player.play();
+        this.animate(false);
+      } else {
+        player.pause();
+        this.animate(true);
+      }
+      return false;
+    }
+  }, {
+    key: "initIcons",
+    value: function initIcons() {
+      var icons = this.icons;
+      this.appendChild(".xgplayer-icon", icons.play);
+      this.appendChild(".xgplayer-icon", icons.pause);
+    }
+  }, {
+    key: "animate",
+    value: function animate(paused) {
+      if (!this.player) {
+        return;
+      }
+      var i18nKeys = this.i18nKeys;
+      var tipDom = this.find(".xg-tips");
+      if (paused) {
+        this.setAttr("data-state", "pause");
+        tipDom && this.changeLangTextKey(tipDom, i18nKeys.PLAY_TIPS);
+      } else {
+        this.setAttr("data-state", "play");
+        tipDom && this.changeLangTextKey(tipDom, i18nKeys.PAUSE_TIPS);
+      }
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      _get(_getPrototypeOf(Play2.prototype), "destroy", this).call(this);
+      this.unbind(["touchend", "click"], this.btnClick);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      if (this.config.disable) {
+        return;
+      }
+      return '<xg-icon class="xgplayer-play">\n    <div class="xgplayer-icon">\n    </div>\n    '.concat(xgIconTips(this, "PLAY_TIPS", this.playerConfig.isHideTips), "\n    </xg-icon>");
+    }
+  }], [{
+    key: "pluginName",
+    get: function get() {
+      return "play";
+    }
+  }, {
+    key: "defaultConfig",
+    get: function get() {
+      return {
+        position: POSITIONS.CONTROLS_LEFT,
+        index: 0,
+        disable: false
+      };
+    }
+  }]);
+  return Play2;
+}(Icon);
+export { Play as default };

package/es/plugins/play/index.scss

@@ -0,0 +1,18 @@
+.xgplayer {
+  .xgplayer-play {
+    .xg-icon-play {
+      display: none;
+    }
+    .xg-icon-pause {
+      display: block;
+    }
+    &[data-state=pause] {
+      .xg-icon-play {
+        display: block;
+      }
+      .xg-icon-pause {
+        display: none;
+      }
+    }
+  }
+}

package/es/plugins/playNext/index.css

@@ -0,0 +1,22 @@
+.xgplayer .xgplayer-playnext {
+  position: relative;
+  display: none;
+  cursor: pointer;
+}
+.xgplayer .xgplayer-playnext .xgplayer-tips .xgplayer-tip-playnext {
+  display: block;
+}
+.xgplayer .xgplayer-playnext:hover {
+  opacity: 0.85;
+}
+.xgplayer .xgplayer-playnext:hover .xgplayer-tips {
+  display: block;
+}
+
+.lang-is-en .xgplayer-playnext .xgplayer-tips {
+  margin-left: -25px;
+}
+
+.lang-is-jp .xgplayer-playnext .xgplayer-tips {
+  margin-left: -38px;
+}

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

@@ -0,0 +1,19 @@
+export default class PlayNextIcon extends Plugin {
+    static get defaultConfig(): {
+        position: string;
+        index: number;
+        url: any;
+        urlList: any[];
+    };
+    constructor(options: any);
+    idx: number;
+    registerIcons(): {
+        playNext: any;
+    };
+    initEvents(): void;
+    nextHandler: any;
+    playNext: (e: any) => void;
+    changeSrc(url: any): void;
+    render(): string;
+}
+import Plugin from "../../plugin";

package/es/plugins/playNext/index.js

@@ -0,0 +1,104 @@
+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 { PLAYNEXT } from "../../events.js";
+import "../../utils/debug.js";
+import Plugin, { POSITIONS } from "../../plugin/plugin.js";
+import { xgIconTips } from "../common/iconTools.js";
+import Next from "../assets/playNext.js";
+var PlayNextIcon = /* @__PURE__ */ function(_Plugin) {
+  _inherits(PlayNextIcon2, _Plugin);
+  var _super = _createSuper(PlayNextIcon2);
+  function PlayNextIcon2(options) {
+    var _this;
+    _classCallCheck(this, PlayNextIcon2);
+    _this = _super.call(this, options);
+    _defineProperty(_assertThisInitialized(_this), "playNext", function(e) {
+      var _assertThisInitialize = _assertThisInitialized(_this), player = _assertThisInitialize.player;
+      e.preventDefault();
+      e.stopPropagation();
+      if (_this.idx + 1 < _this.config.urlList.length) {
+        _this.idx++;
+        _this.nextHandler(_this.config.urlList[_this.idx], _this.idx);
+        player.emit(PLAYNEXT, _this.idx + 1);
+      } else {
+        _this.nextHandler();
+        player.emit(PLAYNEXT);
+      }
+    });
+    _this.idx = -1;
+    return _this;
+  }
+  _createClass(PlayNextIcon2, [{
+    key: "afterCreate",
+    value: function afterCreate() {
+      if (!this.config.urlList || this.config.urlList.length === 0) {
+        return;
+      }
+      this.appendChild(".xgplayer-icon", this.icons.playNext);
+      this.initEvents();
+    }
+  }, {
+    key: "registerIcons",
+    value: function registerIcons() {
+      return {
+        playNext: Next
+      };
+    }
+  }, {
+    key: "initEvents",
+    value: function initEvents() {
+      this.nextHandler = this.hook("nextClick", this.changeSrc);
+      var event = sniffer.device === "mobile" ? "touchend" : "click";
+      this.bind(event, this.playNext);
+      this.show();
+    }
+  }, {
+    key: "changeSrc",
+    value: function changeSrc(url) {
+      var player = this.player;
+      if (!url) {
+        return;
+      }
+      player.pause();
+      player.currentTime = 0;
+      if (player.switchURL) {
+        player.switchURL(url);
+      } else {
+        player.src = url;
+      }
+      player.config.url = url;
+      player.play();
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      this.unbind(["touchend", "click"], this.playNext);
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      if (!this.config.urlList || this.config.urlList.length === 0) {
+        return;
+      }
+      return '\n     <xg-icon class="xgplayer-playnext">\n      <div class="xgplayer-icon">\n      </div>\n      '.concat(xgIconTips(this, "PLAYNEXT_TIPS", this.playerConfig.isHideTips), "\n     </xg-icon>\n    ");
+    }
+  }], [{
+    key: "pluginName",
+    get: function get() {
+      return "playNext";
+    }
+  }, {
+    key: "defaultConfig",
+    get: function get() {
+      return {
+        position: POSITIONS.CONTROLS_LEFT,
+        index: 1,
+        url: null,
+        urlList: []
+      };
+    }
+  }]);
+  return PlayNextIcon2;
+}(Plugin);
+export { PlayNextIcon as default };

package/es/plugins/playNext/index.scss

@@ -0,0 +1,35 @@
+.xgplayer {
+  .xgplayer-playnext {
+    position: relative;
+    display: none;
+    cursor: pointer;
+    // .xgplayer-icon {
+    //   width: 24px;
+    // }
+    .xgplayer-tips {
+      .xgplayer-tip-playnext {
+        display: block;
+      }
+    }
+    &:hover {
+      opacity: 0.85;
+      .xgplayer-tips {
+        display: block;
+      }
+    }
+  }
+}
+.lang-is-en {
+  .xgplayer-playnext {
+    .xgplayer-tips {
+      margin-left: -25px;
+    }
+  }
+}
+.lang-is-jp {
+  .xgplayer-playnext {
+    .xgplayer-tips {
+      margin-left: -38px;
+    }
+  }
+}

package/es/plugins/playbackRate/index.css

@@ -0,0 +1,4 @@
+.xgplayer .xgplayer-playbackrate {
+  display: none;
+  cursor: default;
+}

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

@@ -0,0 +1,31 @@
+/**
+ * @typedef {{
+ *  position?: string,
+ *  index?: number,
+ *  list?: Array<number | { [propName: string]: any }>,
+ *  className?: string,
+ *  hidePortrait?: boolean,
+ *  [propName: string]: any
+ * }} IPlaybackRateConfig
+ */
+export default class PlaybackRate extends OptionsIcon {
+    /**
+     * @type IPlaybackRateConfig
+     */
+    static get defaultConfig(): IPlaybackRateConfig;
+    curRate: number;
+    beforeCreate(args: any): void;
+    onItemClick(e: any, data: any, ...args: any[]): boolean;
+    renderItemList(): void;
+}
+export type IPlaybackRateConfig = {
+    [propName: string]: any;
+    position?: string;
+    index?: number;
+    list?: (number | {
+        [propName: string]: any;
+    })[];
+    className?: string;
+    hidePortrait?: boolean;
+};
+import OptionsIcon from "../common/optionsIcon";