CODEWITHSUNDEEP
ipadhtml5-audiophaser-framework
xxnull
xxnull

Reputation: 69

Phaser 3 audio distorted after playing a html5 video on IPAD

I'm working in an interactive e-learning game and I have several scenes, most of them with audio, video or both. The issue happens when I'm on IPAD and I'm in a scene that contains HTML5 video and I click back to a previous scene that contains audio, the audio will be distorted.

import chime from '../../audios/chime.mp3'
this.callerObj.audio('chime', chime)
this.callerObj.chime.play()

The video is like this:

<div tabindex="0" class="plyr plyr--full-ui plyr--video plyr--html5 plyr--pip-supported plyr--fullscreen-enabled plyr--captions-active plyr--paused">
  <div class="plyr__video-wrapper">
    <video id="lesson1p1" preload="auto">
      <source src="whiteboard_background.mp4" type="video/mp4">
     <source src="whiteboard_background.webm">
    </video>
    <div class="plyr__poster"></div>
  </div>
<div class="plyr__captions"></div>

What can be corrupting the audio? Is there any way to avoid this?

Upvotes: 1

Views: 228

Answers (1)

xxnull
xxnull

Reputation: 69

Well after checking some comments I tested this and it worked.

The issue is related to the audio manager and how it gets handled by the Html5 video. 

this.item = document.getElementById('videoItem')
    if(!!this.item){
      this.item.src = ''
      this.item.load()
    }

After this I was able to play the clean audio

Upvotes: 1

Related Questions