WebAudioApi, frequency sound animation, android chrome v37

Question

I have trouble with frequency animation of sounds through web audio api on android chrome v.37 I can hear music but animation doesn't present.

A lot of experiments lead me in final to two separate ways for loading sounds and animate it. In first way i load sound via aduio html 5 element. Then create MediaElementSource with audio element as parameter. Connect MediaElementSource to Analyser(AudioContext.createAnalyser element). Analyse i connect to GainNode, and finaly connect GainNode to AudioContext.destination.

Code:

var acontext = new AudioContext();
var analyser = acontext.createAnalyser();
var gainNode = acontext.createGain();
var audio = new Audio(path_to_file);
var source = acontext.createMediaElementSource(temp_audio);
source.connect(analyser);
analyser.connect(gainNode);
gainNode.connect(acontext.destination);

This schema work on PC-Chrome and newest mobile safari. Also in FireFox.

Second way which i found have few differences. Sounds here readed to buffer, and then connect to analyser.

code:

var acontext = new AudioContext();
var analyser = acontext.createAnalyser();
var gainNode = acontext.createGain();
var source = acontext.createBufferSource(); 

var request = new XMLHttpRequest();
request.open('GET', path, true);
request.responseType = 'arraybuffer';
request.addEventListener('load', function(){ source.buffer = acontext.createBuffer(request.response, false); }, false);
request.send();

source.connect(analyser);
analyser.connect(gainNode);
gainNode.connect(acontext.destination);

For draw animation i use canvas, data for draw:

analyser.fftSize = 1024;
analyser.smoothingTimeConstant = 0.92;
var dataArray = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteFrequencyData(dataArray); //fill dataArray from analyser

for (var i = 0; i < analyser.frequencyBinCount; i++) {
    barHeight = dataArray[i];
    // and other logic here.
}

Second way work on old chromes, mobile browsers, safari.

But in android chrome v37 both way doesn't work. As i said before first way doesn't show animation, the second one just break with error - acontext.createBuffer() request 3 parameters instead of 2. As i understand in new Web Audio Api version this method was rewritten for newest call type, with different parameters, so i don't use it.

Any advices how to force Android Chrome v.37 work here?

Answer 1

I found crossbrowser solution.

acontext.decodeAudioData(request.response, function (buffer) {
    source.buffer = buffer
}

This way work right on all browsers. But i decline the audio tags and load sounds over XmlHTTPRequest. If you know way to get buffer from audio element for decode it in decodeAudioData - please comment how.