src getter fix, local storage fix

src/js/captions.js

@@ -5,6 +5,7 @@
 import support from './support';
 import utils from './utils';
 import controls from './controls';
+import storage from './storage';
 
 const captions = {
     // Setup captions
@@ -15,16 +16,16 @@ const captions = {
         }
 
         // Set default language if not set
-        if (!utils.is.empty(this.storage.language)) {
+        if (!utils.is.empty(storage.get.call(this).language)) {
-            this.captions.language = this.storage.language;
+            this.captions.language = storage.get.call(this).language;
         } else if (utils.is.empty(this.captions.language)) {
             this.captions.language = this.config.captions.language.toLowerCase();
         }
 
         // Set captions enabled state if not set
         if (!utils.is.boolean(this.captions.enabled)) {
-            if (!utils.is.empty(this.storage.language)) {
+            if (!utils.is.empty(storage.get.call(this).language)) {
-                this.captions.enabled = this.storage.captions;
+                this.captions.enabled = storage.get.call(this).captions;
             } else {
                 this.captions.enabled = this.config.captions.active;
             }
@@ -193,7 +194,7 @@ const captions = {
         }
 
         // Try to load the value from storage
-        let active = this.storage.captions;
+        let active = storage.get.call(this).captions;
 
         // Otherwise fall back to the default config
         if (!utils.is.boolean(active)) {

src/js/controls.js

@@ -229,6 +229,9 @@ const controls = {
 
         this.elements.inputs[type] = input;
 
+        // Set the fill for webkit now
+        controls.updateRangeFill.call(this, input);
+
         return {
             label,
             input,

src/js/listeners.js

@@ -91,9 +91,7 @@ const listeners = {
             controls.updateSetting.call(this, 'speed');
 
             // Save speed to localStorage
-            storage.set.call(this, {
+            storage.set.call(this, { speed: this.speed });
-                speed: this.speed,
-            });
         });
 
         // Quality change
@@ -102,17 +100,19 @@ const listeners = {
             controls.updateSetting.call(this, 'quality');
 
             // Save speed to localStorage
-            storage.set.call(this, {
+            storage.set.call(this, { quality: this.quality });
-                quality: this.quality,
-            });
         });
 
         // Caption language change
         utils.on(this.media, 'captionchange', () => {
             // Save speed to localStorage
-            storage.set.call(this, {
+            storage.set.call(this, { language: this.language });
-                language: this.captions.language,
         });
+
+        // Volume change
+        utils.on(this.media, 'volumechange', () => {
+            // Save speed to localStorage
+            storage.set.call(this, { volume: this.volume });
         });
 
         // Captions toggle
@@ -121,9 +121,7 @@ const listeners = {
             controls.updateSetting.call(this, 'captions');
 
             // Save speed to localStorage
-            storage.set.call(this, {
+            storage.set.call(this, { captions: this.captions.enabled });
-                captions: this.captions.enabled,
-            });
         });
 
         // Proxy events to container

src/js/plugins/vimeo.js

@@ -126,6 +126,19 @@ const vimeo = {
             },
         });
 
+        // Source
+        let currentSrc;
+
+        player.embed.getVideoUrl.then(value => {
+            currentSrc = value;
+        });
+
+        Object.defineProperty(player.media, 'currentSrc', {
+            get() {
+                return currentSrc;
+            },
+        });
+
         // Rebuild UI
         window.setTimeout(() => ui.build.call(player), 0);
 

src/js/plugins/youtube.js

@@ -155,6 +155,13 @@ const youtube = {
                         },
                     });
 
+                    // Source
+                    Object.defineProperty(player.media, 'currentSrc', {
+                        get() {
+                            return instance.getVideoUrl();
+                        },
+                    });
+
                     // Get available speeds
                     if (player.config.controls.includes('settings') && player.config.settings.includes('speed')) {
                         controls.setSpeedMenu.call(player, instance.getAvailablePlaybackRates());

src/js/plyr.js

@@ -196,7 +196,7 @@ class Plyr {
         this.browser = utils.getBrowser();
 
         // Load saved settings from localStorage
-        this.storage = storage.setup.call(this);
+        storage.setup.call(this);
 
         // Check for support again but with type
         this.supported = support.check(this.type, this.config.inline);
@@ -350,12 +350,12 @@ class Plyr {
         const isSet = !utils.is.undefined(volume);
 
         if (utils.is.string(volume)) {
-            volume = parseFloat(volume);
+            volume = Number(volume);
         }
 
         // Load volume from storage if no value specified
         if (!utils.is.number(volume)) {
-            ({ volume } = this.storage);
+            ({ volume } = storage.get.call(this));
         }
 
         // Use config if all else fails
@@ -446,7 +446,7 @@ class Plyr {
         // Load speed from storage or default value
         let speed = utils.is.number(input)
             ? input
-            : parseFloat(this.storage.speed || this.speed.selected || this.config.speed.default);
+            : parseFloat(storage.get.call(this).speed || this.speed.selected || this.config.speed.default);
 
         // Set min/max
         if (speed < 0.1) {
@@ -474,7 +474,7 @@ class Plyr {
         // Load speed from storage or default value
         const quality = utils.is.string(input)
             ? input
-            : parseFloat(this.storage.quality || this.config.quality.selected);
+            : parseFloat(storage.get.call(this).quality || this.config.quality.selected);
 
         if (!this.config.quality.options.includes(quality)) {
             this.warn(`Unsupported quality option (${quality})`);
@@ -567,25 +567,7 @@ class Plyr {
     }
 
     get src() {
-        let url;
+        return this.media.currentSrc;
-
-        switch (this.type) {
-            case 'youtube':
-                url = this.embed.getVideoUrl();
-                break;
-
-            case 'vimeo':
-                this.embed.getVideoUrl.then(value => {
-                    url = value;
-                });
-                break;
-
-            default:
-                url = this.media.currentSrc;
-                break;
-        }
-
-        return url;
     }
 
     // Poster image
@@ -668,7 +650,7 @@ class Plyr {
         utils.dispatchEvent.call(this, this.media, 'captionchange');
 
         // Clear caption
-        captions.setCaption.call(this);
+        captions.set.call(this);
 
         // Re-run setup
         captions.setup.call(this);

src/js/storage.js

@@ -5,18 +5,37 @@
 import support from './support';
 import utils from './utils';
 
+// Get contents of local storage
+function get() {
+    const store = window.localStorage.getItem(this.config.storage.key);
+
+    if (utils.is.empty(store)) {
+        return {};
+    }
+
+    return JSON.parse(store);
+}
+
 // Save a value back to local storage
-function set(value) {
+function set(object) {
     // Bail if we don't have localStorage support or it's disabled
     if (!support.storage || !this.config.storage.enabled) {
         return;
     }
 
+    // Can only store objectst
+    if (!utils.is.object(object)) {
+        return;
+    }
+
+    // Get current storage
+    const storage = get.call(this);
+
     // Update the working copy of the values
-    utils.extend(this.storage, value);
+    utils.extend(storage, object);
 
     // Update storage
-    window.localStorage.setItem(this.config.storage.key, JSON.stringify(this.storage));
+    window.localStorage.setItem(this.config.storage.key, JSON.stringify(storage));
 }
 
 // Setup localStorage
@@ -53,4 +72,4 @@ function setup() {
     return storage;
 }
 
-export default { setup, set };
+export default { setup, set, get };

src/js/ui.js

@@ -176,11 +176,6 @@ const ui = {
             }
         }
 
-        // Update the volume in storage
-        storage.set.call(this, {
-            volume: this.media.volume,
-        });
-
         // Toggle class if muted
         utils.toggleClass(this.elements.container, this.config.classNames.muted, this.media.muted);