diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/js/plyr.js | 86 | ||||
-rw-r--r-- | src/scss/variables.scss | 2 |
2 files changed, 70 insertions, 18 deletions
diff --git a/src/js/plyr.js b/src/js/plyr.js index 71f98af5..fc49a123 100644 --- a/src/js/plyr.js +++ b/src/js/plyr.js @@ -1173,7 +1173,15 @@ _toggleClass(plyr.container, config.classes.captions.enabled, true); - if (config.captions.defaultActive) { + // Try to load the value from storage + var active = plyr.storage.captionsEnabled; + + // Otherwise fall back to the default config + if (!_is.boolean(active)) { + active = config.captions.defaultActive; + } + + if (active) { _toggleClass(plyr.container, config.classes.captions.active, true); _toggleState(plyr.buttons.captions, true); } @@ -1398,6 +1406,53 @@ } } + // Setup localStorage + function _setupStorage() { + var value = null; + plyr.storage = {}; + + // Bail if we don't have localStorage support or it's disabled + if (!_storage().supported || !config.storage.enabled) { + return; + } + + // Clean up old volume + // https://github.com/Selz/plyr/issues/171 + window.localStorage.removeItem('plyr-volume'); + + // load value from the current key + value = window.localStorage.getItem(config.storage.key); + + if (!value) { + // Key wasn't set (or had been cleared), move along + return; + } + else if (/^\d+(\.\d+)?$/.test(value)) { + // If value is a number, it's probably volume from an older + // version of plyr. See: https://github.com/Selz/plyr/pull/313 + // Update the key to be JSON + _updateStorage({volume: parseFloat(value)}); + } + else { + // Assume it's JSON from this or a later version of plyr + plyr.storage = JSON.parse(value); + } + } + + // Save a value back to local storage + function _updateStorage(value) { + // Bail if we don't have localStorage support or it's disabled + if (!_storage().supported || !config.storage.enabled) { + return; + } + + // Update the working copy of the values + _extend(plyr.storage, value); + + window.localStorage.setItem( + config.storage.key, JSON.stringify(plyr.storage)); + } + // Setup media function _setupMedia() { // If there's no media, bail @@ -1707,7 +1762,8 @@ // Vimeo ready function _vimeoReady(mediaId, container) { - // Setup player + // Setup instance + // https://github.com/vimeo/player.js plyr.embed = new window.Vimeo.Player(container.id, { id: mediaId, loop: config.loop, @@ -1758,7 +1814,7 @@ // Fix keyboard focus issues // https://github.com/Selz/plyr/issues/317 plyr.embed.on('loaded', function() { - if(_is.htmlElement(plyr.embed.element)) { + if(_is.htmlElement(plyr.embed.element) && plyr.supported.full) { plyr.embed.element.setAttribute('tabindex', '-1'); } }); @@ -2153,17 +2209,9 @@ var max = config.volumeMax, min = config.volumeMin; - // Use default if no value specified + // Load volume from storage if no value specified if (_is.undefined(volume)) { - volume = config.volume; - - if (config.storage.enabled && _storage().supported) { - volume = window.localStorage.getItem(config.storage.key); - - // Clean up old volume - // https://github.com/Selz/plyr/issues/171 - window.localStorage.removeItem('plyr-volume'); - } + volume = plyr.storage.volume; } // Use config if all else fails @@ -2240,10 +2288,8 @@ } } - // Store the volume in storage - if (config.storage.enabled && _storage().supported && !isNaN(volume)) { - window.localStorage.setItem(config.storage.key, volume); - } + // Update the volume in storage + _updateStorage({volume: volume}); // Toggle class if muted _toggleClass(plyr.container, config.classes.muted, (volume === 0)); @@ -2277,6 +2323,9 @@ // Trigger an event _triggerEvent(plyr.container, plyr.captionsEnabled ? 'captionsenabled' : 'captionsdisabled', true); + + // Save captions state to localStorage + _updateStorage({captionsEnabled: plyr.captionsEnabled}); } // Check if media is loading @@ -3128,6 +3177,9 @@ return; } + // Load saved settings from localStorage + _setupStorage(); + // Get original classname plyr.originalClassName = plyr.container.className; diff --git a/src/scss/variables.scss b/src/scss/variables.scss index 81a87d88..7606c8d9 100644 --- a/src/scss/variables.scss +++ b/src/scss/variables.scss @@ -13,7 +13,7 @@ $plyr-sr-only-important: true !default; $plyr-color-main: #3498db !default; // Font sizes -$plyr-font-family: 'San Francisco', -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', Avenir, 'Avenir Next', 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif; +$plyr-font-family: 'San Francisco', -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', Avenir, 'Avenir Next', 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif !default; $plyr-font-size-small: 14px !default; $plyr-font-size-base: 16px !default; |