Enabling the audio

Note: Important information regarding the autoplay / playOverlay props. Some years ago, browsers changed their policies to not allow autoplay on videos with sound (Chrome’s example for reference). This means that a video that is not set as muted but is set to autoplay, will be reverted to paused by the browser until the user interacts with the video. Arcware Cloud streams Unreal Engine projects by creating video and audio as separate objects, this is why you can observe the video running but the audio can be muted (paused). The muted audio is only happening when the playOverlay prop is set to false. If it’s set to true, the user needs to click the overlayed play button first to play the video, which simultaneously plays the audio too. In order to make audio work with playOverlay: false, it’s necessary to implement a button to enable/disable the audio. Please use the following function (see below) to add the audio button...

• Method 1: Playing only sound, via 'Ambient Sound' Actor or other sound cues inside Unreal Engine. Then we are going to interact with the video element.

<script>
  function handleMute() {
    if (document.getElementById("streamingVideoContainer").muted === true) {
      document.getElementById("streamingVideoContainer").muted = false;
    } else {
     document.getElementById("streamingVideoContainer").muted = true;
    }
  }
</script>

<button class="button" onclick="handleMute();">
  Mute/Unmute
</button>

• Method 2: Playing a movie with sound, via the MediaPlate Actor or MediaPlayer inside Unreal Engine. Then we are going to interact with the audio element.

<script>
  function handleMute() {
    if (document.getElementById('audioRef').paused === true) {
      document.getElementById('audioRef').play();
    }
    else if (document.getElementById('audioRef').paused === false) {
      document.getElementById('audioRef').pause();
    }
  }
</script>

<button class="button" onclick="handleMute();">
  Mute/Unmute
</button> 
<audio id="audioRef"></audio>