Audio blobURL broken in v3

[boyofgreen]

Hello Friends,

  I recently upgraded to the RC version of BJS 3 and am now seeing an error that isn't present in v2.  I am creating an audio file and setting the src to a blob URL that I have just created with getUserMedia (it's a wave):

 

var newUrl = (window.URL || window.webkitURL).createObjectURL(blob);
var audioEl = new Audio();
audioEl.controls = true;
audioEl.src = newUrl;
document.getElementById('curTrackContainer').appendChild(audioEl);

 audioObj[i].sound.dispose();
audioObj[i].sound = new BABYLON.Sound(newName+i, newUrl, scene, null, { loop: false, autoplay: false });

The audio file plays okay from the audio element, but when I try to have babylon play it, I get this error:

BJS - [21:52:42]: Error while trying to play audio: Sampled15010375539220, TypeMismatchError

babylon.customRC.js (6025,13)

 

This method works fine in version 2.5 but breaks in 3.0.  Any help would be appreciated, if we know what has changed in that space.

Thanks,

Jeff

[davrous]

Hello Jeff,

I don't remember supporting playing blob directly, I'm surprised it was working in the past. It supports:

- an ArrayBuffer or url to the sound to be played
- an array of urls to be played (to provide for instance .ogg and .mp3 and let the browser choose the format supported to be played)

For instance, this sample: http://playground.babylonjs.com/#E9CKPE is using an ArrayBuffer as an input. 

I can add support for blob: url but it should work by either passing an ArrayBuffer (you can easily transform your blob into an ArrayBuffer).

David

 

[davrous]

By the way, what would you like to do exactly? Maybe I should better expose the audio context of Web Audio to let you connect the microphone directly to it if needed.

[davrous]

Well, you're right, it was working before.  It's because I've added some logic testing the file extension. I need to consider the blob: prefix to avoid that. I'm going to update my code and push the new version asap. 

[davrous]

Done. This sample now works: http://playground.babylonjs.com/debug.html#50DV4A#3 , so should your code also. 

[boyofgreen]

I'll try it out.  so remember the app I previewed to you about a year ago, well I am still working on it and getting close.  The scenario is that when you are recording a story, you can also record an audio track for each page of your story.  The architectureI have in place right now isn't really great.  Basically I do this:

1. record voice track with get user media
2. pull the wave immediately out and set it to a "preview" audio element and pass the wav into a Babylonjs audio object
3. concert the wav to an mp3 in a separate thread
4. save the mp3 into an indexedDB (for later use) and then update the Babylonjs audio object with the mp3 file.

It's a bit of a mess right now, I convert it to mp3 so that it doesn't take up as much space, but it takes quite a while to convert it (several minutes sometimes).  I'm going to let you know how the sample works.

 

[boyofgreen]

That seems to have fixed it!  I'll do some heavy testing tonight, but I'm sure it is fine.  You are awesome as always!   Next time I see you I'll go into more depth as to what I am doing, of course I would love for Babylon to do more of my work for me

 

[GameMonetize]

We are here to serve!