Merge branch 'develop' into css-variables

# Conflicts:
#	.eslintrc
#	demo/dist/demo.css
#	demo/dist/demo.js
#	demo/dist/demo.min.js
#	demo/dist/demo.min.js.map
#	dist/plyr.css
#	dist/plyr.js
#	dist/plyr.min.js
#	dist/plyr.min.js.map
#	dist/plyr.min.mjs
#	dist/plyr.min.mjs.map
#	dist/plyr.mjs
#	dist/plyr.polyfilled.js
#	dist/plyr.polyfilled.min.js
#	dist/plyr.polyfilled.min.js.map
#	dist/plyr.polyfilled.min.mjs
#	dist/plyr.polyfilled.min.mjs.map
#	dist/plyr.polyfilled.mjs
#	gulpfile.js
#	package.json

1 files changed, 27 insertions, 15 deletions

diff --git a/src/js/ui.js b/src/js/ui.js
index 8e50bb83..df52eb64 100644
--- a/src/js/ui.js
+++ b/src/js/ui.js
@@ -67,15 +67,15 @@ const ui = {
         // Reset mute state
         this.muted = null;
 
-        // Reset speed
-        this.speed = null;
-
         // Reset loop state
         this.loop = null;
 
         // Reset quality setting
         this.quality = null;
 
+        // Reset speed
+        this.speed = null;
+
         // Reset volume display
         controls.updateVolume.call(this);
 
@@ -213,7 +213,7 @@ const ui = {
 
         // Set state
         Array.from(this.elements.buttons.play || []).forEach(target => {
-            target.pressed = this.playing;
+            Object.assign(target, { pressed: this.playing });
         });
 
         // Only update controls on non timeupdate events
@@ -233,25 +233,37 @@ const ui = {
         clearTimeout(this.timers.loading);
 
         // Timer to prevent flicker when seeking
-        this.timers.loading = setTimeout(() => {
-            // Update progress bar loading class state
-            toggleClass(this.elements.container, this.config.classNames.loading, this.loading);
-
-            // Update controls visibility
-            ui.toggleControls.call(this);
-        }, this.loading ? 250 : 0);
+        this.timers.loading = setTimeout(
+            () => {
+                // Update progress bar loading class state
+                toggleClass(this.elements.container, this.config.classNames.loading, this.loading);
+
+                // Update controls visibility
+                ui.toggleControls.call(this);
+            },
+            this.loading ? 250 : 0,
+        );
     },
 
     // Toggle controls based on state and `force` argument
     toggleControls(force) {
-        const { controls } = this.elements;
+        const { controls: controlsElement } = this.elements;
 
-        if (controls && this.config.hideControls) {
+        if (controlsElement && this.config.hideControls) {
             // Don't hide controls if a touch-device user recently seeked. (Must be limited to touch devices, or it occasionally prevents desktop controls from hiding.)
-            const recentTouchSeek = (this.touch && this.lastSeekTime + 2000 > Date.now());
+            const recentTouchSeek = this.touch && this.lastSeekTime + 2000 > Date.now();
 
             // Show controls if force, loading, paused, button interaction, or recent seek, otherwise hide
-            this.toggleControls(Boolean(force || this.loading || this.paused || controls.pressed || controls.hover || recentTouchSeek));
+            this.toggleControls(
+                Boolean(
+                    force ||
+                        this.loading ||
+                        this.paused ||
+                        controlsElement.pressed ||
+                        controlsElement.hover ||
+                        recentTouchSeek,
+                ),
+            );
         }
     },
 };