ravnur-player-public 3.4.4 → 3.4.6

package/src/players/base.js

@@ -1,209 +0,0 @@
-// @flow
-import Entity from '../entity';
-
-import type { Player$ControllerOptions } from '../types/Options';
-
-const MS_IN_SEC = 1000;
-
-export default class BasePlayer extends Entity {
-   options: Player$ControllerOptions
-   state;
-   constructor(options: Player$ControllerOptions, state) {
-      super(options.bus, options.logger);
-      this.state = state;
-      this.logger.debug('player:created');
-      this.options = options;
-      setTimeout( () => this.getElement().setAttribute('tabindex', '-1') );
-   }
-
-   focus() {
-      let el = this.getElement();
-      // fix for ff
-      if ( this.options.isAudio ) {
-         // $FlowFixMe
-         el = el.parentNode.parentNode;
-      }
-
-      if ( el && el instanceof HTMLElement ) {
-         el.focus();
-      }
-   }
-
-   getTimeCode(): number {
-      return this.options.timecode;
-   }
-
-   getCurrentTime() {
-      return this.getElement().currentTime + this.getTimeCode();
-   }
-
-   setCurrentTime(time: number, silent: ?boolean = true) {
-      if (!this.getElement()) return;
-
-      time -= this.getTimeCode();
-
-      const { clip } = this.options;
-      if ( clip ) {
-         let [ start, end ]  = clip;
-         start = start || 0;
-         end = end || this.getElement().duration;
-         time = Math.max(time, start);
-         time = Math.min(time, end);
-      }
-
-      this.getElement().currentTime = time;
-      if ( !silent ) {
-         this.focus();
-      }
-   }
-
-   nextFrame() {
-      const frameDuration = this._getFrameDuration();
-      let time = this.getElement().currentTime;
-      let frameNumber = Math.floor(time * MS_IN_SEC / frameDuration);
-      time = Math.ceil(++frameNumber * frameDuration) / MS_IN_SEC;
-      this.setCurrentTime(time + this.getTimeCode());
-   }
-
-   prevFrame() {
-      const frameDuration = this._getFrameDuration();
-      let time = this.getElement().currentTime;
-      let frameNumber = Math.floor(time * MS_IN_SEC / frameDuration);
-      time = Math.ceil(--frameNumber * frameDuration) / MS_IN_SEC;
-      this.setCurrentTime(time + this.getTimeCode());
-   }
-
-   isPaused() {
-      if (!this.getElement()) return false;
-      return this.getElement().paused;
-   }
-
-   isEnded() {
-      if (!this.getElement()) return false;
-
-      const { clip } = this.options;
-      if ( clip ) {
-         const duration = this.getElement().duration;
-         let [ start, end ]  = clip; // eslint-disable-line no-unused-vars
-         end = end || duration;
-         end += this.getTimeCode();
-         return this.getCurrentTime() >= end;
-      }
-      return this.getElement().ended;
-   }
-
-   play(silent: ?boolean = true) {
-      this.bus.emit('handle-play-clicked');
-      if (!silent) {
-         this.focus();
-      }
-
-      const { clip } = this.options;
-      if ( this.isEnded() && clip ) {
-         const [ start ] = clip;
-         this.setCurrentTime(start || 0);
-      }
-      return this.getElement().play();
-   }
-
-   pause(silent: ?boolean = true) {
-      if (!silent) {
-         this.focus();
-      }
-      return this.getElement().pause();
-   }
-
-   getDuration() {
-      if (!this.getElement()) return '';
-
-      let duration = this.getElement().duration;
-      const { clip } = this.options;
-      if ( clip ) {
-         let [ start, end ]  = clip;
-         start = start || 0;
-         end = end || duration;
-         duration = end - start;
-      }
-      return duration + this.getTimeCode();
-   }
-
-   isMuted() {
-      return this.getElement().muted;
-   }
-
-   setMuted(muted: boolean, silent: ?boolean = true) {
-      this.getElement().muted = muted;
-      if (!silent) {
-         this.focus();
-      }
-   }
-
-   getVolume() {
-      return this.getElement().volume;
-   }
-
-   setVolume(volume: number, silent: ?boolean = true) {
-      this.getElement().volume = volume;
-      if (!silent) {
-         this.focus();
-      }
-   }
-
-   destroy() {
-      this.logger.debug('player:destroy');
-      super.destroy();
-   }
-
-   getLevels() {
-      throw new Error('You must override it');
-   }
-
-   getLevel() {
-      throw new Error('You must override it');
-   }
-
-   setLevel(/* level */) {
-      throw new Error('You must override it');
-   }
-
-   isMultiAudioTracks() {
-      return this.getAudioTracks().length > 1;
-   }
-
-   getAudioTracks() {
-      return [];
-   }
-
-   getAudioTrack() {
-      return 0;
-   }
-
-   setAudioTrack(idx) {
-      // noop;
-   }
-
-   getTextTracks() {
-      // noop;
-   }
-
-   load(/* sources */) {
-      throw new Error('You must override it');
-   }
-
-   isMultiQuality(): boolean {
-      // eslint-disable-next-line no-magic-numbers
-      return this.getLevels().length > 1;
-   }
-
-   getBufferedPercent(): number {
-      return 0;
-   }
-
-   getElement(): HTMLVideoElement | HTMLAudioElement {
-      throw new Error('You must override it');
-   }
-
-   _getFrameDuration(): number {
-      return MS_IN_SEC / this.options.frameRate;
-   }
-}

package/src/players/flash.js

@@ -1,172 +0,0 @@
-import BasePlayer from './base';
-
-import MediaElement from '../flash/MediaElement';
-
-import { get, createElement, toArray, find, first, isArray } from '../utils';
-
-import type { Player$Options } from '../types/Options';
-
-const AUTO_LEVEL = { name: 'Auto', index: -1 };
-
-export default class FlashPlayer extends BasePlayer {
-   $el: HTMLAudioElement | HTMLVideoElement
-   _levels = [];
-   _currentLevel = null;
-
-   mediaElement: ?MediaElement = null
-
-   constructor(options: Player$Options, state) {
-      super(options, state);
-      this.logger.debug('flash:controller:creating');
-
-      this.$el = createElement(options.isAudio ? 'audio' : 'video');
-
-      this.onFullScreenChanged = this.onFullScreenChanged.bind(this);
-
-      this.logger.debug('flash:controller:created');
-   }
-
-   load({src}) {
-
-      if ( isArray(src) ) {
-         this._levels = src;
-         this._currentLevel = find(this._levels, lvl => lvl.default) || first(this._levels);
-         src = this._currentLevel.src;
-      }
-
-      this.logger.debug('flash:controller:loading', src);
-
-      const mediaElement = new MediaElement(this.$el, this.options);
-      this.mediaElement = mediaElement;
-      mediaElement.setSrc(src);
-      mediaElement.setSize('100%', '100%');
-
-      mediaElement.play();
-
-      this.bus.once('loadedmetadata', () => {
-         mediaElement.pause();
-
-         if (this.options.qualityLevel) {
-            const h = parseInt(this.options.qualityLevel, 10);
-            const level = find(this.getLevels(), l => l.height === h);
-            if (level) {
-               this.setLevel(level);
-               this.bus.emit('qualitychange', `${h}p`);
-            }
-         }
-      });
-
-      if (this.options.isAudio) {
-         mediaElement.pause();
-         this.bus.once('canplaythrough', () => {
-            mediaElement.pause();
-            this.bus.emit('loadedmetadata');
-         });
-      }
-
-      this.bus.on('fullscreenchanged', this.onFullScreenChanged);
-      this.bus.on('cclayoutchange', this.onFullScreenChanged);
-   }
-
-   isHLS() {
-      return get(this.mediaElement, 'rendererName') === 'flash_hls';
-   }
-
-   getLevels() {
-      if (this.isHLS()) {
-         const levels = toArray(this.mediaElement.levels);
-         return [ AUTO_LEVEL ].concat(levels);
-      }
-      return this._levels;
-   }
-
-   setLevel(level) {
-      if (this.isHLS()) {
-         this.mediaElement.level = level.index;
-      } else if ( this._currentLevel !== level ) {
-         const currentTime = this.mediaElement.currentTime;
-         const paused = this.mediaElement.paused;
-         this._currentLevel = level;
-         this.mediaElement.setSrc(level.src);
-         this.mediaElement.setSize('100%', '100%');
-         this.mediaElement.play();
-         this.bus.once('loadedmetadata', () => {
-            this.mediaElement.currentTime = currentTime;
-            this.mediaElement.pause();
-            this.mediaElement.play();
-            if (paused) {
-               this.mediaElement.pause();
-            }
-         });
-      }
-   }
-
-   getLevel() {
-      if (this.isHLS()) {
-         return this.mediaElement.levels[this.getElement().currentLevel] || AUTO_LEVEL;
-      }
-      return this._currentLevel;
-   }
-
-   getElement() {
-      return this.mediaElement;
-   }
-
-   setCurrentTime(time: number, silent: ?boolean = true) {
-      const paused = this.isPaused();
-      this.pause(silent);
-      super.setCurrentTime(time, silent);
-      if ( !paused ) {
-         this.play(silent);
-      }
-   }
-
-   isMultiQuality() {
-      const levels = this.isHLS() ? this.mediaElement.levels : this._levels;
-      // eslint-disable-next-line no-magic-numbers
-      return levels.length > 1;
-   }
-
-   onFullScreenChanged(isFullScreen: ?boolean = false) {
-      if (isFullScreen) {
-         const { mediaElement } = this;
-         if (mediaElement) {
-            mediaElement.setSize('100%', '100%');
-         }
-      } else {
-         setTimeout(() => this._resizeME());
-      }
-   }
-
-   _resizeME() {
-      const parent = this.$el.parentNode;
-      const me = this.mediaElement;
-      if (parent && me && parent instanceof HTMLElement) {
-         const width = parent.offsetWidth;
-         const height = parent.offsetHeight;
-         me.setSize(`${width}px`, `${height}px`);
-      }
-   }
-
-   getBufferedPercent() {
-      const $el = this.mediaElement;
-      return $el.buffered.end($el.buffered.length - 1) / $el.duration;
-   }
-
-   destroy() {
-      this.pause();
-      const { mediaElement } = this;
-      if ( mediaElement ) {
-         mediaElement.renderer.hide();
-      }
-      super.destroy();
-      this.bus.off('fullscreenchanged', this.onFullScreenChanged);
-      this.bus.off('cclayoutchange', this.onFullScreenChanged);
-
-      if (mediaElement) {
-         mediaElement.removeChild(this.$el);
-         mediaElement.parentNode.removeChild(mediaElement);
-      }
-      this.mediaElement = null;
-   }
-}

package/src/players/hls.js

@@ -1,278 +0,0 @@
-import HTMLPlayer from './html';
-
-// import { C2PA, ValidationResult, C2PAValidationError } from '@ravnur-inc/c2pa';
-import {
-   findIndex,
-   existy,
-   createElement,
-   first,
-   isArray,
-   isObject,
-   head,
-   extend,
-   find
-   // isEqualBuffer
-} from '../utils';
-
-const AUTO_LEVEL = { name: 'Auto' };
-const HLS_OPTIONS = {
-   maxFragLookUpTolerance: 0.5,
-   maxMaxBufferLength: 600,
-   highBufferWatchdogPeriod: 3,
-   playlistLoadPolicy: {
-      default: {
-         maxTimeToFirstByteMs: 10000,
-         maxLoadTimeMs: 120000,
-         timeoutRetry: {
-            maxNumRetry: 10,
-            retryDelayMs: 0,
-            maxRetryDelayMs: 0
-         },
-         errorRetry: {
-            maxNumRetry: 10,
-            retryDelayMs: 3000,
-            maxRetryDelayMs: 8000
-         }
-      }
-   }
-};
-
-export default class HLSPlayer extends HTMLPlayer {
-   constructor(options, state) {
-      super(options, state);
-      this.logger.debug('hls:player:created');
-   }
-
-   load({ src }) {
-      src = isArray(src) ? head(src) : src;
-      src = isObject(src) ? src.src : src;
-      this.logger.debug('hls:player:loading', src);
-
-      if (existy(window.Hls)) {
-         this._attachMedia(src);
-      } else {
-         this._loadLibraryAndAttachMedia(src);
-      }
-   }
-
-   _loadLibraryAndAttachMedia(src) {
-      // use requiresjs if we can
-      if (typeof window.define === 'function' && window.define.amd) {
-         window.require.config({
-            paths: {
-               hlsjs: this.options.hlsjsURL
-            }
-         });
-
-         window.require(['hlsjs'], hls => {
-            window.Hls = hls;
-            this._attachMedia(src);
-         });
-      } else {
-         const script = createElement('script', { src: this.options.hlsjsURL });
-         const firstScriptTag = first(document.getElementsByTagName('script'));
-         script.onload = script.onreadystatechange = () => this._attachMedia(src);
-
-         if (!firstScriptTag.parentNode) return;
-
-         firstScriptTag.parentNode.insertBefore(script, firstScriptTag);
-      }
-   }
-
-   _attachMedia(src) {
-      const Hls = window.Hls;
-      if (Hls.isSupported()) {
-         this.hls = new Hls(extend(HLS_OPTIONS, this.options.hls));
-
-         // if (this.options.showC2PA) {
-         //    this.c2pa = new C2PA((status, data) => {
-         //       switch (status) {
-         //       case ValidationResult.Complete:
-         //          this.bus.emit('c2painit', { status, data });
-         //          break;
-         //       case ValidationResult.NoData:
-         //          this.bus.emit('c2painit', { status, data });
-         //          break;
-         //       case ValidationResult.Failed:
-         //          this.bus.emit('c2painit', { status, data });
-         //          if (!(data instanceof C2PAValidationError)) {
-         //             this.bus.emit('c2paexception');
-         //          }
-         //          break;
-         //       default:
-         //          console.debug(`[HLS] Unrecognized status ${status}`);
-         //       }
-         //    });
-
-         //    // The video init segment is parsing
-         //    this.hls.on(Hls.Events.FRAG_PARSING_INIT_SEGMENT, (name, data) => {
-         //       console.debug(`[HLS] Executed ${name} handler, data: ${data}`);
-
-         //       this.c2pa.initSegment(data);
-         //    });
-
-         //    // The video segment is appending to buffer
-         //    this.hls.on(Hls.Events.BUFFER_APPENDING, (name, data) => {
-         //       console.debug(`[HLS] Executed ${name} handler, data: ${data}`);
-
-         //       // Check whether buffered segment is init segment
-         //       if (isEqualBuffer(data.data, data.frag.initSegment.data)) {
-         //          return;
-         //       }
-
-         //       // TODO: c2pa.validateSegment should define own data model, not just accept hls event data
-         //       data.data1 = data.data;
-         //       this.c2pa.validateSegment(data, validationResult => {
-         //          this.bus.emit('c2pafragment', validationResult);
-         //       });
-         //    });
-         // }
-
-         this.hls.loadSource(src);
-         this.hls.attachMedia(this.$el);
-
-         this.hls.on(Hls.Events.ERROR, (a, data) => {
-            this.bus.emit('error', data);
-            this.logger.error(data);
-         });
-
-         this.hls.on(Hls.Events.AUDIO_TRACK_SWITCHED, () => {
-            this.bus.emit('audiotrackswitched');
-         });
-
-         this.hls.on(Hls.Events.MANIFEST_PARSED, (a, data) => {
-            if (!this.options.showSubtitles) {
-               this.hls.subtitleDisplay = false;
-            }
-
-            if (this.options.qualityLevel) {
-               const h = parseInt(this.options.qualityLevel, 10);
-               if (h) {
-                  const level = find(data.levels, l => l.height === h);
-                  if (level) {
-                     this.setLevel(level);
-                  }
-               }
-            }
-
-            if (this.options.maxQualityLevel) {
-               this.limitLevel(this.options.maxQualityLevel);
-            }
-
-            if (this.options.startLevel) {
-               const h = parseInt(this.options.startLevel, 10);
-               if (h) {
-                  const idx = findIndex(data.levels, l => l.height === h);
-                  this.hls.startLevel = idx;
-               }
-            }
-         });
-
-         this.hls.on(Hls.Events.BUFFER_CREATED, () => {
-            if (this.options.isLive) {
-               this.goToLive();
-            }
-         });
-
-         // Encryption. Token should be passed as an option or as a query parameter
-         if (this.options.aesToken) {
-            let descriptionUrl;
-
-            this.hls.config.xhrSetup = (xhr, url) => {
-               xhr.addEventListener('load', () => {
-                  if (typeof xhr.response === 'string' && xhr.response.indexOf('#EXTM3U') >= 0) {
-                     const lines = xhr.response.split('\n');
-                     const keyLine = lines.find(line => line.indexOf('#EXT-X-KEY') === 0);
-                     const keyUrl = keyLine?.split('URI="')[1].split('"')[0];
-                     const urlBase = 'https://' + url.split('/')[2];
-                     const finalUrl = urlBase + keyUrl;
-
-                     if (keyUrl) {
-                        descriptionUrl = finalUrl;
-                     }
-                  }
-               });
-
-               if (url === descriptionUrl) {
-                  xhr.setRequestHeader('Authorization', 'Bearer ' + this.options.aesToken);
-               }
-            };
-         } else {
-            // append all query parameters to the subsequent requests
-            const query = src.split('?')[1];
-
-            if (query) {
-               this.hls.config.xhrSetup = (xhr, url) => {
-                  xhr.open('GET', url + `?${query}`, true);
-               };
-            }
-         }
-      } else {
-         this.logger.error('HLS is not supported for this browser');
-      }
-   }
-
-   goToLive() {
-      if (!this.hls.media) {
-         return;
-      }
-
-      this.logger.debug('hls:player:live');
-      this.hls.media.currentTime = this.hls.liveSyncPosition || this.hls.media.duration - 10;
-   }
-
-   isLive() {
-      if (this.hls?.liveSyncPosition) {
-         return this.hls?.media.currentTime >= (this.hls?.liveSyncPosition - 10);
-      }
-
-      return this.hls?.media.currentTime >= (this.hls?.media.duration - 10); // Default to 10s from duration
-   }
-
-   getLevels() {
-      return [AUTO_LEVEL].concat(this.hls.levels);
-   }
-
-   setLevel(level) {
-      const idx = findIndex(this.hls.levels, level);
-      this.hls.currentLevel = idx;
-   }
-
-   limitLevel(level) {
-      const h = parseInt(level, 10);
-      if (h) {
-         const idx = findIndex(this.hls.levels, l => l.height === h);
-         this.hls.autoLevelCapping = idx;
-      }
-   }
-
-   getLevel() {
-      return this.hls.levels[this.hls.manualLevel] || AUTO_LEVEL;
-   }
-
-   isMultiQuality() {
-      // eslint-disable-next-line no-magic-numbers
-      return this.hls.levels.length > 1;
-   }
-
-   getAudioTracks() {
-      return this.hls.audioTracks;
-   }
-
-   getAudioTrack() {
-      return this.hls.audioTrack;
-   }
-
-   getTextTracks() {
-      return this.$el.textTracks || [];
-   }
-
-   setAudioTrack(idx) {
-      this.hls.audioTrack = idx;
-   }
-
-   destroy() {
-      this.hls.destroy();
-      super.destroy();
-   }
-}