From ba09bc32d3bcd8002abe1ae4f629fc11ff55a7fc Mon Sep 17 00:00:00 2001 From: Sam Potts Date: Sun, 20 Dec 2020 20:11:41 +1100 Subject: [PATCH] fix: use bound arrow functions in classes --- src/js/fullscreen.js | 30 ++++----- src/js/listeners.js | 32 +++++----- src/js/plugins/ads.js | 76 +++++++++++------------ src/js/plugins/preview-thumbnails.js | 92 ++++++++++++++-------------- src/js/plyr.js | 64 ++++++++++--------- 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 7bb22391..76acbd06 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; } @@ -262,10 +264,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; } @@ -282,16 +284,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 6c507893..b37893bc 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;