diff options
| -rw-r--r-- | src/js/fullscreen.js | 30 | ||||
| -rw-r--r-- | src/js/listeners.js | 32 | ||||
| -rw-r--r-- | src/js/plugins/ads.js | 76 | ||||
| -rw-r--r-- | src/js/plugins/preview-thumbnails.js | 92 | ||||
| -rw-r--r-- | src/js/plyr.js | 64 | ||||
| -rw-r--r-- | src/js/storage.js | 8 | 
6 files changed, 151 insertions, 151 deletions
| diff --git a/src/js/fullscreen.js b/src/js/fullscreen.js index 90301f29..20e958fc 100644 --- a/src/js/fullscreen.js +++ b/src/js/fullscreen.js @@ -57,6 +57,8 @@ class Fullscreen {      // Update the UI      this.update(); + +    // this.toggle = this.toggle.bind(this);    }    // Determine if native supported @@ -134,7 +136,7 @@ class Fullscreen {        : this.player.elements.fullscreen || this.player.elements.container;    } -  onChange() { +  onChange = () => {      if (!this.enabled) {        return;      } @@ -149,9 +151,9 @@ class Fullscreen {      const target = this.target === this.player.media ? this.target : this.player.elements.container;      // Trigger an event      triggerEvent.call(this.player, target, this.active ? 'enterfullscreen' : 'exitfullscreen', true); -  } +  }; -  toggleFallback(toggle = false) { +  toggleFallback = (toggle = false) => {      // Store or restore scroll position      if (toggle) {        this.scrollPosition = { @@ -198,10 +200,10 @@ class Fullscreen {      // Toggle button and fire events      this.onChange(); -  } +  };    // Trap focus inside container -  trapFocus(event) { +  trapFocus = (event) => {      // Bail if iOS, not active, not the tab key      if (browser.isIos || !this.active || event.key !== 'Tab' || event.keyCode !== 9) {        return; @@ -222,10 +224,10 @@ class Fullscreen {        last.focus();        event.preventDefault();      } -  } +  };    // Update UI -  update() { +  update = () => {      if (this.enabled) {        let mode; @@ -244,10 +246,10 @@ class Fullscreen {      // Add styling hook to show button      toggleClass(this.player.elements.container, this.player.config.classNames.fullscreen.enabled, this.enabled); -  } +  };    // Make an element fullscreen -  enter() { +  enter = () => {      if (!this.enabled) {        return;      } @@ -266,10 +268,10 @@ class Fullscreen {      } else if (!is.empty(this.prefix)) {        this.target[`${this.prefix}Request${this.property}`]();      } -  } +  };    // Bail from fullscreen -  exit() { +  exit = () => {      if (!this.enabled) {        return;      } @@ -286,16 +288,16 @@ class Fullscreen {        const action = this.prefix === 'moz' ? 'Cancel' : 'Exit';        document[`${this.prefix}${action}${this.property}`]();      } -  } +  };    // Toggle state -  toggle() { +  toggle = () => {      if (!this.active) {        this.enter();      } else {        this.exit();      } -  } +  };  }  export default Fullscreen; diff --git a/src/js/listeners.js b/src/js/listeners.js index 48734bcf..3d1f8ef0 100644 --- a/src/js/listeners.js +++ b/src/js/listeners.js @@ -183,7 +183,7 @@ class Listeners {    }    // Device is touch enabled -  firstTouch() { +  firstTouch = () => {      const { player } = this;      const { elements } = player; @@ -191,9 +191,9 @@ class Listeners {      // Add touch class      toggleClass(elements.container, player.config.classNames.isTouch, true); -  } +  }; -  setTabFocus(event) { +  setTabFocus = (event) => {      const { player } = this;      const { elements } = player; @@ -241,10 +241,10 @@ class Listeners {          toggleClass(document.activeElement, player.config.classNames.tabFocus, true);        }, 10);      } -  } +  };    // Global window & document listeners -  global(toggle = true) { +  global = (toggle = true) => {      const { player } = this;      // Keyboard shortcuts @@ -260,10 +260,10 @@ class Listeners {      // Tab focus detection      toggleListener.call(player, document.body, 'keydown focus blur focusout', this.setTabFocus, toggle, false, true); -  } +  };    // Container listeners -  container() { +  container = () => {      const { player } = this;      const { config, elements, timers } = player; @@ -370,10 +370,10 @@ class Listeners {          }        }      }); -  } +  };    // Listen for media events -  media() { +  media = () => {      const { player } = this;      const { elements } = player; @@ -514,10 +514,10 @@ class Listeners {        triggerEvent.call(player, elements.container, event.type, true, detail);      }); -  } +  };    // Run default and custom handlers -  proxy(event, defaultHandler, customHandlerKey) { +  proxy = (event, defaultHandler, customHandlerKey) => {      const { player } = this;      const customHandler = player.config.listeners[customHandlerKey];      const hasCustomHandler = is.function(customHandler); @@ -532,10 +532,10 @@ class Listeners {      if (returned !== false && is.function(defaultHandler)) {        defaultHandler.call(player, event);      } -  } +  };    // Trigger custom and default handlers -  bind(element, type, defaultHandler, customHandlerKey, passive = true) { +  bind = (element, type, defaultHandler, customHandlerKey, passive = true) => {      const { player } = this;      const customHandler = player.config.listeners[customHandlerKey];      const hasCustomHandler = is.function(customHandler); @@ -547,10 +547,10 @@ class Listeners {        (event) => this.proxy(event, defaultHandler, customHandlerKey),        passive && !hasCustomHandler,      ); -  } +  };    // Listen for control events -  controls() { +  controls = () => {      const { player } = this;      const { elements } = player;      // IE doesn't support input event, so we fallback to change @@ -905,7 +905,7 @@ class Listeners {        'volume',        false,      ); -  } +  };  }  export default Listeners; diff --git a/src/js/plugins/ads.js b/src/js/plugins/ads.js index 12b5cc31..5d9406d1 100644 --- a/src/js/plugins/ads.js +++ b/src/js/plugins/ads.js @@ -77,7 +77,7 @@ class Ads {    /**     * Load the IMA SDK     */ -  load() { +  load = () => {      if (!this.enabled) {        return;      } @@ -95,12 +95,12 @@ class Ads {      } else {        this.ready();      } -  } +  };    /**     * Get the ads instance ready     */ -  ready() { +  ready = () => {      // Double check we're enabled      if (!this.enabled) {        destroy(this); @@ -120,7 +120,7 @@ class Ads {      // Setup the IMA SDK      this.setupIMA(); -  } +  };    // Build the tag URL    get tagUrl() { @@ -153,7 +153,7 @@ class Ads {     * properly place mid-rolls. After we create the ad display container, we initialize it. On     * mobile devices, this initialization is done as the result of a user action.     */ -  setupIMA() { +  setupIMA = () => {      // Create the container for our advertisements      this.elements.container = createElement('div', {        class: this.player.config.classNames.ads, @@ -186,12 +186,12 @@ class Ads {      // Request video ads to be pre-loaded      this.requestAds(); -  } +  };    /**     * Request advertisements     */ -  requestAds() { +  requestAds = () => {      const { container } = this.player.elements;      try { @@ -216,13 +216,13 @@ class Ads {      } catch (e) {        this.onAdError(e);      } -  } +  };    /**     * Update the ad countdown     * @param {Boolean} start     */ -  pollCountdown(start = false) { +  pollCountdown = (start = false) => {      if (!start) {        clearInterval(this.countdownTimer);        this.elements.container.removeAttribute('data-badge-text'); @@ -236,13 +236,13 @@ class Ads {      };      this.countdownTimer = setInterval(update, 100); -  } +  };    /**     * This method is called whenever the ads are ready inside the AdDisplayContainer     * @param {Event} adsManagerLoadedEvent     */ -  onAdsManagerLoaded(event) { +  onAdsManagerLoaded = (event) => {      // Load could occur after a source change (race condition)      if (!this.enabled) {        return; @@ -273,9 +273,9 @@ class Ads {      // Resolve our adsManager      this.trigger('loaded'); -  } +  }; -  addCuePoints() { +  addCuePoints = () => {      // Add advertisement cue's within the time line if available      if (!is.empty(this.cuePoints)) {        this.cuePoints.forEach((cuePoint) => { @@ -294,7 +294,7 @@ class Ads {          }        });      } -  } +  };    /**     * This is where all the event handling takes place. Retrieve the ad from the event. Some @@ -302,7 +302,7 @@ class Ads {     * https://developers.google.com/interactive-media-ads/docs/sdks/html5/v3/apis#ima.AdEvent.Type     * @param {Event} event     */ -  onAdEvent(event) { +  onAdEvent = (event) => {      const { container } = this.player.elements;      // Retrieve the ad from the event. Some events (e.g. ALL_ADS_COMPLETED)      // don't have ad object associated @@ -410,23 +410,23 @@ class Ads {        default:          break;      } -  } +  };    /**     * Any ad error handling comes through here     * @param {Event} event     */ -  onAdError(event) { +  onAdError = (event) => {      this.cancel();      this.player.debug.warn('Ads error', event); -  } +  };    /**     * Setup hooks for Plyr and window events. This ensures     * the mid- and post-roll launch at the correct time. And     * resize the advertisement when the player resizes     */ -  listeners() { +  listeners = () => {      const { container } = this.player.elements;      let time; @@ -464,12 +464,12 @@ class Ads {          this.manager.resize(container.offsetWidth, container.offsetHeight, google.ima.ViewMode.NORMAL);        }      }); -  } +  };    /**     * Initialize the adsManager and start playing advertisements     */ -  play() { +  play = () => {      const { container } = this.player.elements;      if (!this.managerPromise) { @@ -503,12 +503,12 @@ class Ads {          }        })        .catch(() => {}); -  } +  };    /**     * Resume our video     */ -  resumeContent() { +  resumeContent = () => {      // Hide the advertisement container      this.elements.container.style.zIndex = ''; @@ -517,12 +517,12 @@ class Ads {      // Play video      silencePromise(this.player.media.play()); -  } +  };    /**     * Pause our video     */ -  pauseContent() { +  pauseContent = () => {      // Show the advertisement container      this.elements.container.style.zIndex = 3; @@ -531,7 +531,7 @@ class Ads {      // Pause our video.      this.player.media.pause(); -  } +  };    /**     * Destroy the adsManager so we can grab new ads after this. If we don't then we're not @@ -539,7 +539,7 @@ class Ads {     * video requests. https://developers.google.com/interactive-     * media-ads/docs/sdks/android/faq#8     */ -  cancel() { +  cancel = () => {      // Pause our video      if (this.initialized) {        this.resumeContent(); @@ -550,12 +550,12 @@ class Ads {      // Re-create our adsManager      this.loadAds(); -  } +  };    /**     * Re-create our adsManager     */ -  loadAds() { +  loadAds = () => {      // Tell our adsManager to go bye bye      this.managerPromise        .then(() => { @@ -576,13 +576,13 @@ class Ads {          this.requestAds();        })        .catch(() => {}); -  } +  };    /**     * Handles callbacks after an ad event was invoked     * @param {String} event - Event type     */ -  trigger(event, ...args) { +  trigger = (event, ...args) => {      const handlers = this.events[event];      if (is.array(handlers)) { @@ -592,7 +592,7 @@ class Ads {          }        });      } -  } +  };    /**     * Add event listeners @@ -600,7 +600,7 @@ class Ads {     * @param {Function} callback - Callback for when event occurs     * @return {Ads}     */ -  on(event, callback) { +  on = (event, callback) => {      if (!is.array(this.events[event])) {        this.events[event] = [];      } @@ -608,7 +608,7 @@ class Ads {      this.events[event].push(callback);      return this; -  } +  };    /**     * Setup a safety timer for when the ad network doesn't respond for whatever reason. @@ -618,27 +618,27 @@ class Ads {     * @param {Number} time     * @param {String} from     */ -  startSafetyTimer(time, from) { +  startSafetyTimer = (time, from) => {      this.player.debug.log(`Safety timer invoked from: ${from}`);      this.safetyTimer = setTimeout(() => {        this.cancel();        this.clearSafetyTimer('startSafetyTimer()');      }, time); -  } +  };    /**     * Clear our safety timer(s)     * @param {String} from     */ -  clearSafetyTimer(from) { +  clearSafetyTimer = (from) => {      if (!is.nullOrUndefined(this.safetyTimer)) {        this.player.debug.log(`Safety timer cleared from: ${from}`);        clearTimeout(this.safetyTimer);        this.safetyTimer = null;      } -  } +  };  }  export default Ads; diff --git a/src/js/plugins/preview-thumbnails.js b/src/js/plugins/preview-thumbnails.js index 16167247..80e8cd4a 100644 --- a/src/js/plugins/preview-thumbnails.js +++ b/src/js/plugins/preview-thumbnails.js @@ -103,7 +103,7 @@ class PreviewThumbnails {      return this.player.isHTML5 && this.player.isVideo && this.player.config.previewThumbnails.enabled;    } -  load() { +  load = () => {      // Toggle the regular seek tooltip      if (this.player.elements.display.seekTooltip) {        this.player.elements.display.seekTooltip.hidden = this.enabled; @@ -126,10 +126,10 @@ class PreviewThumbnails {        this.loaded = true;      }); -  } +  };    // Download VTT files and parse them -  getThumbnails() { +  getThumbnails = () => {      return new Promise((resolve) => {        const { src } = this.player.config.previewThumbnails; @@ -164,10 +164,10 @@ class PreviewThumbnails {          Promise.all(promises).then(sortAndResolve);        }      }); -  } +  };    // Process individual VTT file -  getThumbnail(url) { +  getThumbnail = (url) => {      return new Promise((resolve) => {        fetch(url).then((response) => {          const thumbnail = { @@ -202,9 +202,9 @@ class PreviewThumbnails {          tempImage.src = thumbnail.urlPrefix + thumbnail.frames[0].text;        });      }); -  } +  }; -  startMove(event) { +  startMove = (event) => {      if (!this.loaded) {        return;      } @@ -245,13 +245,13 @@ class PreviewThumbnails {      // Download and show image      this.showImageAtCurrentTime(); -  } +  }; -  endMove() { +  endMove = () => {      this.toggleThumbContainer(false, true); -  } +  }; -  startScrubbing(event) { +  startScrubbing = (event) => {      // Only act on left mouse button (0), or touch device (event.button does not exist or is false)      if (is.nullOrUndefined(event.button) || event.button === false || event.button === 0) {        this.mouseDown = true; @@ -265,9 +265,9 @@ class PreviewThumbnails {          this.showImageAtCurrentTime();        }      } -  } +  }; -  endScrubbing() { +  endScrubbing = () => {      this.mouseDown = false;      // Hide scrubbing preview. But wait until the video has successfully seeked before hiding the scrubbing preview @@ -283,12 +283,12 @@ class PreviewThumbnails {          }        });      } -  } +  };    /**     * Setup hooks for Plyr and window events     */ -  listeners() { +  listeners = () => {      // Hide thumbnail preview - on mouse click, mouse leave (in listeners.js for now), and video play/seek. All four are required, e.g., for buffering      this.player.on('play', () => {        this.toggleThumbContainer(false, true); @@ -301,12 +301,12 @@ class PreviewThumbnails {      this.player.on('timeupdate', () => {        this.lastTime = this.player.media.currentTime;      }); -  } +  };    /**     * Create HTML elements for image containers     */ -  render() { +  render = () => {      // Create HTML element: plyr__preview-thumbnail-container      this.elements.thumb.container = createElement('div', {        class: this.player.config.classNames.previewThumbnails.thumbContainer, @@ -339,18 +339,18 @@ class PreviewThumbnails {      });      this.player.elements.wrapper.appendChild(this.elements.scrubbing.container); -  } +  }; -  destroy() { +  destroy = () => {      if (this.elements.thumb.container) {        this.elements.thumb.container.remove();      }      if (this.elements.scrubbing.container) {        this.elements.scrubbing.container.remove();      } -  } +  }; -  showImageAtCurrentTime() { +  showImageAtCurrentTime = () => {      if (this.mouseDown) {        this.setScrubbingContainerSize();      } else { @@ -387,10 +387,10 @@ class PreviewThumbnails {        this.showingThumb = thumbNum;        this.loadImage(qualityIndex);      } -  } +  };    // Show the image that's currently specified in this.showingThumb -  loadImage(qualityIndex = 0) { +  loadImage = (qualityIndex = 0) => {      const thumbNum = this.showingThumb;      const thumbnail = this.thumbnails[qualityIndex];      const { urlPrefix } = thumbnail; @@ -426,9 +426,9 @@ class PreviewThumbnails {        this.currentImageElement.dataset.index = thumbNum;        this.removeOldImages(this.currentImageElement);      } -  } +  }; -  showImage(previewImage, frame, qualityIndex, thumbNum, thumbFilename, newImage = true) { +  showImage = (previewImage, frame, qualityIndex, thumbNum, thumbFilename, newImage = true) => {      this.player.debug.log(        `Showing thumb: ${thumbFilename}. num: ${thumbNum}. qual: ${qualityIndex}. newimg: ${newImage}`,      ); @@ -449,10 +449,10 @@ class PreviewThumbnails {      this.preloadNearby(thumbNum, true)        .then(this.preloadNearby(thumbNum, false))        .then(this.getHigherQuality(qualityIndex, previewImage, frame, thumbFilename)); -  } +  };    // Remove all preview images that aren't the designated current image -  removeOldImages(currentImage) { +  removeOldImages = (currentImage) => {      // Get a list of all images, convert it from a DOM list to an array      Array.from(this.currentImageContainer.children).forEach((image) => {        if (image.tagName.toLowerCase() !== 'img') { @@ -476,11 +476,11 @@ class PreviewThumbnails {          }, removeDelay);        }      }); -  } +  };    // Preload images before and after the current one. Only if the user is still hovering/seeking the same frame    // This will only preload the lowest quality -  preloadNearby(thumbNum, forward = true) { +  preloadNearby = (thumbNum, forward = true) => {      return new Promise((resolve) => {        setTimeout(() => {          const oldThumbFilename = this.thumbnails[0].frames[thumbNum].text; @@ -527,10 +527,10 @@ class PreviewThumbnails {          }        }, 300);      }); -  } +  };    // If user has been hovering current image for half a second, look for a higher quality one -  getHigherQuality(currentQualityIndex, previewImage, frame, thumbFilename) { +  getHigherQuality = (currentQualityIndex, previewImage, frame, thumbFilename) => {      if (currentQualityIndex < this.thumbnails.length - 1) {        // Only use the higher quality version if it's going to look any better - if the current thumb is of a lower pixel density than the thumbnail container        let previewImageHeight = previewImage.naturalHeight; @@ -550,7 +550,7 @@ class PreviewThumbnails {          }, 300);        }      } -  } +  };    get currentImageContainer() {      if (this.mouseDown) { @@ -605,7 +605,7 @@ class PreviewThumbnails {      }    } -  toggleThumbContainer(toggle = false, clearShowing = false) { +  toggleThumbContainer = (toggle = false, clearShowing = false) => {      const className = this.player.config.classNames.previewThumbnails.thumbContainerShown;      this.elements.thumb.container.classList.toggle(className, toggle); @@ -613,9 +613,9 @@ class PreviewThumbnails {        this.showingThumb = null;        this.showingThumbFilename = null;      } -  } +  }; -  toggleScrubbingContainer(toggle = false) { +  toggleScrubbingContainer = (toggle = false) => {      const className = this.player.config.classNames.previewThumbnails.scrubbingContainerShown;      this.elements.scrubbing.container.classList.toggle(className, toggle); @@ -623,17 +623,17 @@ class PreviewThumbnails {        this.showingThumb = null;        this.showingThumbFilename = null;      } -  } +  }; -  determineContainerAutoSizing() { +  determineContainerAutoSizing = () => {      if (this.elements.thumb.imageContainer.clientHeight > 20 || this.elements.thumb.imageContainer.clientWidth > 20) {        // This will prevent auto sizing in this.setThumbContainerSizeAndPos()        this.sizeSpecifiedInCSS = true;      } -  } +  };    // Set the size to be about a quarter of the size of video. Unless option dynamicSize === false, in which case it needs to be set in CSS -  setThumbContainerSizeAndPos() { +  setThumbContainerSizeAndPos = () => {      if (!this.sizeSpecifiedInCSS) {        const thumbWidth = Math.floor(this.thumbContainerHeight * this.thumbAspectRatio);        this.elements.thumb.imageContainer.style.height = `${this.thumbContainerHeight}px`; @@ -653,9 +653,9 @@ class PreviewThumbnails {      }      this.setThumbContainerPos(); -  } +  }; -  setThumbContainerPos() { +  setThumbContainerPos = () => {      const seekbarRect = this.player.elements.progress.getBoundingClientRect();      const plyrRect = this.player.elements.container.getBoundingClientRect();      const { container } = this.elements.thumb; @@ -674,20 +674,20 @@ class PreviewThumbnails {      }      container.style.left = `${previewPos}px`; -  } +  };    // Can't use 100% width, in case the video is a different aspect ratio to the video container -  setScrubbingContainerSize() { +  setScrubbingContainerSize = () => {      const { width, height } = fitRatio(this.thumbAspectRatio, {        width: this.player.media.clientWidth,        height: this.player.media.clientHeight,      });      this.elements.scrubbing.container.style.width = `${width}px`;      this.elements.scrubbing.container.style.height = `${height}px`; -  } +  };    // Sprites need to be offset to the correct location -  setImageSizeAndOffset(previewImage, frame) { +  setImageSizeAndOffset = (previewImage, frame) => {      if (!this.usingSprites) {        return;      } @@ -703,7 +703,7 @@ class PreviewThumbnails {      previewImage.style.left = `-${frame.x * multiplier}px`;      // eslint-disable-next-line no-param-reassign      previewImage.style.top = `-${frame.y * multiplier}px`; -  } +  };  }  export default PreviewThumbnails; diff --git a/src/js/plyr.js b/src/js/plyr.js index 71f8e9cf..e67e29d4 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -355,7 +355,7 @@ class Plyr {    /**     * Play the media, or play the advertisement (if they are not blocked)     */ -  play() { +  play = () => {      if (!is.function(this.media.play)) {        return null;      } @@ -367,18 +367,18 @@ class Plyr {      // Return the promise (for HTML5)      return this.media.play(); -  } +  };    /**     * Pause the media     */ -  pause() { +  pause = () => {      if (!this.playing || !is.function(this.media.pause)) {        return null;      }      return this.media.pause(); -  } +  };    /**     * Get playing state @@ -412,7 +412,7 @@ class Plyr {     * Toggle playback based on current status     * @param {Boolean} input     */ -  togglePlay(input) { +  togglePlay = (input) => {      // Toggle based on current state if nothing passed      const toggle = is.boolean(input) ? input : !this.playing; @@ -421,42 +421,42 @@ class Plyr {      }      return this.pause(); -  } +  };    /**     * Stop playback     */ -  stop() { +  stop = () => {      if (this.isHTML5) {        this.pause();        this.restart();      } else if (is.function(this.media.stop)) {        this.media.stop();      } -  } +  };    /**     * Restart playback     */ -  restart() { +  restart = () => {      this.currentTime = 0; -  } +  };    /**     * Rewind     * @param {Number} seekTime - how far to rewind in seconds. Defaults to the config.seekTime     */ -  rewind(seekTime) { +  rewind = (seekTime) => {      this.currentTime -= is.number(seekTime) ? seekTime : this.config.seekTime; -  } +  };    /**     * Fast forward     * @param {Number} seekTime - how far to fast forward in seconds. Defaults to the config.seekTime     */ -  forward(seekTime) { +  forward = (seekTime) => {      this.currentTime += is.number(seekTime) ? seekTime : this.config.seekTime; -  } +  };    /**     * Seek to a time @@ -582,18 +582,18 @@ class Plyr {     * Increase volume     * @param {Boolean} step - How much to decrease by (between 0 and 1)     */ -  increaseVolume(step) { +  increaseVolume = (step) => {      const volume = this.media.muted ? 0 : this.volume;      this.volume = volume + (is.number(step) ? step : 0); -  } +  };    /**     * Decrease volume     * @param {Boolean} step - How much to decrease by (between 0 and 1)     */ -  decreaseVolume(step) { +  decreaseVolume = (step) => {      this.increaseVolume(-step); -  } +  };    /**     * Set muted state @@ -1033,18 +1033,18 @@ class Plyr {     * Trigger the airplay dialog     * TODO: update player with state, support, enabled     */ -  airplay() { +  airplay = () => {      // Show dialog if supported      if (support.airplay) {        this.media.webkitShowPlaybackTargetPicker();      } -  } +  };    /**     * Toggle the player controls     * @param {Boolean} [toggle] - Whether to show the controls     */ -  toggleControls(toggle) { +  toggleControls = (toggle) => {      // Don't toggle if missing UI support or if it's audio      if (this.supported.ui && !this.isAudio) {        // Get state before change @@ -1074,34 +1074,34 @@ class Plyr {      }      return false; -  } +  };    /**     * Add event listeners     * @param {String} event - Event type     * @param {Function} callback - Callback for when event occurs     */ -  on(event, callback) { +  on = (event, callback) => {      on.call(this, this.elements.container, event, callback); -  } +  };    /**     * Add event listeners once     * @param {String} event - Event type     * @param {Function} callback - Callback for when event occurs     */ -  once(event, callback) { +  once = (event, callback) => {      once.call(this, this.elements.container, event, callback); -  } +  };    /**     * Remove event listeners     * @param {String} event - Event type     * @param {Function} callback - Callback for when event occurs     */ -  off(event, callback) { +  off = (event, callback) => {      off(this.elements.container, event, callback); -  } +  };    /**     * Destroy an instance @@ -1110,7 +1110,7 @@ class Plyr {     * @param {Function} callback - Callback for when destroy is complete     * @param {Boolean} soft - Whether it's a soft destroy (for source changes etc)     */ -  destroy(callback, soft = false) { +  destroy = (callback, soft = false) => {      if (!this.ready) {        return;      } @@ -1208,15 +1208,13 @@ class Plyr {        // Vimeo does not always return        setTimeout(done, 200);      } -  } +  };    /**     * Check for support for a mime type (HTML5 only)     * @param {String} type - Mime type     */ -  supports(type) { -    return support.mime.call(this, type); -  } +  supports = (type) => support.mime.call(this, type);    /**     * Check for support diff --git a/src/js/storage.js b/src/js/storage.js index 85b5e2b5..323a6d25 100644 --- a/src/js/storage.js +++ b/src/js/storage.js @@ -31,7 +31,7 @@ class Storage {      }    } -  get(key) { +  get = (key) => {      if (!Storage.supported || !this.enabled) {        return null;      } @@ -45,9 +45,9 @@ class Storage {      const json = JSON.parse(store);      return is.string(key) && key.length ? json[key] : json; -  } +  }; -  set(object) { +  set = (object) => {      // Bail if we don't have localStorage support or it's disabled      if (!Storage.supported || !this.enabled) {        return; @@ -71,7 +71,7 @@ class Storage {      // Update storage      window.localStorage.setItem(this.key, JSON.stringify(storage)); -  } +  };  }  export default Storage; | 
