@eluvio/elv-player-js 1.0.79 → 1.0.82

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eluvio/elv-player-js",
-  "version": "1.0.79",
+  "version": "1.0.82",
   "description": "![Eluvio Logo](src/static/images/Logo.png \"Eluvio Logo\")",
   "main": "src/index.js",
   "license": "MIT",

package/src/PlayerControls.js

@@ -305,16 +305,6 @@ class PlayerControls {
       return;
     }
 
-    this.video.addEventListener("click", () => {
-      if(window.matchMedia("(hover: none)").matches) {
-        // Touch screen - don't start/stop on video click
-        return;
-      }
-
-      clearTimeout(this.timeouts.playPause);
-      this.timeouts.playPause = setTimeout(() => this.video.paused ? this.video.play() : this.video.pause(), 200);
-    });
-
     if(this.playerOptions.controls === EluvioPlayerParameters.controls.OFF) {
       // Controls hidden but need to show volume controls
 
@@ -362,6 +352,16 @@ class PlayerControls {
       return;
     }
 
+    this.video.addEventListener("click", () => {
+      if(window.matchMedia("(hover: none)").matches) {
+        // Touch screen - don't start/stop on video click
+        return;
+      }
+
+      clearTimeout(this.timeouts.playPause);
+      this.timeouts.playPause = setTimeout(() => this.video.paused ? this.video.play() : this.video.pause(), 200);
+    });
+
     // Big play icon
     this.bigPlayButton = CreateImageButton({
       parent: this.target,

package/src/index.js

@@ -481,7 +481,7 @@ export class EluvioPlayer {
         parent: this.target,
         type: "video",
         options: {
-          muted: [EluvioPlayerParameters.muted.OFF, EluvioPlayerParameters.muted.WHEN_NOT_VISIBLE].includes(this.playerOptions.muted),
+          muted: [EluvioPlayerParameters.muted.ON, EluvioPlayerParameters.muted.WHEN_NOT_VISIBLE].includes(this.playerOptions.muted),
           controls: this.playerOptions.controls === EluvioPlayerParameters.controls.DEFAULT,
           loop: this.playerOptions.loop === EluvioPlayerParameters.loop.ON
         },

package/src/static/stylesheets/player.scss

@@ -142,6 +142,7 @@ $button-height: 35px;
     object-fit: contain;
     object-position: center;
     width: 100%;
+    z-index: 1;
   }
 
   &__watermark {
@@ -162,6 +163,7 @@ $button-height: 35px;
     position: absolute;
     transition: opacity 0.25s linear;
     width: max-content;
+    z-index: 10;
 
     button {
       background: $controls-color;