src/js/core.js - patch - alexxhub/playerjs

src/js/core.js
109 строк3 KB
apavlov3rednet
doca
02 фев 2026, 20:44
02 фев 2026, 20:441368ae9
// core.js
import { bindCoreMethods } from "./controls.js";
import { formatTime } from "./format.js";
import { initTimeline, destroyTimeline } from "./timeline.js";
import {
  applyStartTimeFromUrl,
  bindUrlTimeEvents,
  destroyUrlTimeEvents,
} from "./urlTime.js";

/**
 * VideoPlayer
 * @param {HTMLElement} rootEl
 * @param {Object} options
 * @param {number} options.defaultVolume
 * @param {number} options.defaultPlaybackRate
 * @returns {VideoPlayer}
 * @class
 * @description Класс VideoPlayer
 * @example
 * ```js
 * const options = { ... };
 * const player = new VideoPlayer(document.querySelector(".player"), { ...options });
 * ```
 */
export class VideoPlayer {
  constructor(rootEl, options = {}) {
    this.root = rootEl;

    this.options = {
      defaultVolume: 1,
      defaultPlaybackRate: 1,
      updateUrlByTime: options.updateUrlByTime ?? false,
      segments: options.segments || [],
      ...options,
    };

    this.video = this.root.querySelector(".player__video");
    this.bigPlayBtn = this.root.querySelector(".player__big-play");

    this.playBtn = this.root.querySelector(".js-play");
    this.skipBackBtn = this.root.querySelector(".js-skip-back");
    this.skipForwardBtn = this.root.querySelector(".js-skip-forward");
    this.muteBtn = this.root.querySelector(".js-mute");
    this.fullscreenBtn = this.root.querySelector(".js-fullscreen");

    this.progressRange = this.root.querySelector(".js-progress");
    this.bufferBar = this.root.querySelector(".js-buffer");
    this.volumeRange = this.root.querySelector(".js-volume");

    this.speedRoot = this.root.querySelector(".js-speed");
    this.speedToggleBtn = this.root.querySelector(".js-speed-toggle");
    this.speedMenu = this.root.querySelector(".js-speed-menu");

    this.currentTimeEl = this.root.querySelector(".time__current");
    this.durationTimeEl = this.root.querySelector(".time__duration");

    this.segments = this.options.segments || [];
    this.segmentsContainer = this.root.querySelector(".js-segments");
    this.activeSegmentIndex = -1;

    this.updateUrlByTime = this.options.updateUrlByTime ?? false;

    this.formatTime = formatTime;

    bindCoreMethods(this);
    this._init();
  }

  /**
   * Инициализация VideoPlayer
   * @private
   * @description Инициализация VideoPlayer
   * @returns {void}
   */
  _init() {
    // начальные значения
    this.video.volume = this.options.defaultVolume;
    this.video.playbackRate = this.options.defaultPlaybackRate ?? 1;

    if (this.volumeRange) {
      this.volumeRange.value = this.video.volume;
    }

    // controls (play/pause/mute/fs/keyboard)
    this._initControls();

    // таймлайн, прогресс, буфер, сегменты
    initTimeline(this);

    // стартовый таймкод из URL
    applyStartTimeFromUrl(this);

    // обновление URL по времени и share‑ссылки
    bindUrlTimeEvents(this);
  }

  /**
   * Уничтожение VideoPlayer
   * @returns {void}
   * @description Уничтожение VideoPlayer
   */
  destroy() {
    // отписка от событий
    this._destroyControls();
    destroyTimeline(this);
    destroyUrlTimeEvents(this);
  }
}