CODEWITHSUNDEEP
htmlaudiohtml5-audio
Gaël Barbin
Gaël Barbin

Reputation: 3929

Working with AudioContext with a source from audio tag

I'm building a music player and I'd like to add a pulsation effect depending on the track currently played.

Here some examples of what I'd want:

http://www.htmlfivewow.com/demos/hal/index.html

http://www.schillmania.com/projects/soundmanager2/demo/360-player/canvas-visualization.html

My problem is that in the first example, sound is loaded via xhr, and in the second it uses flash.

I'd want to be able to get the sound that I want to analyze from the audio tag.

I'm afraid it could not be possible, it would cause a big lack of security because we could load web pages instead of sound and then analyse it. Is there a solution anyway?

Upvotes: 9

Views: 9410

Answers (2)

David Shim
David Shim

Reputation: 710

You can use createMediaElementSource method in AudioContext.

<audio id="audio" src="test.mp3"></audio>
<script type="text/javascript">
    var context = new webkitAudioContext;
    var el = document.getElementById('audio');
    var source = context.createMediaElementSource(el);
    source.connect(context.destination);
    el.play();
</script>

Upvotes: 27

Mikko Ohtamaa
Mikko Ohtamaa

Reputation: 83666

Looks like here is one implementation doing over Web Audio API:

https://github.com/richtaur/audia/blob/master/audia.js

and background:

http://www.lostdecadegames.com/audia-is-a-library-for-simplifying-the-web-audio-api/

Upvotes: 0

Related Questions