I've written up some javascript that successfully pulls and plays audio files on the desktop. However, I just can not get this figured out on a mobile device -- which really is my intent.
Right now for the desktop, I can push and play audio with this javascript:
var audioElement = document.createElement('audio');
audioElement.setAttribute('src', url);
audioElement.setAttribute('autoplay', 'autoplay');
$.get();
audioElement.addEventListener("load", function() {
audioElement.play();
}, true);
(where url is a location on my web server)
I've read that audio on mobile requires an initial user action to activate, so I then tried making:
var audioElement = document.createElement('audio');
A global element, and then in the document.ready section, I activated the audio when the user presses a 'tool' button:
$(document).ready(function() {
$("#toolButton").click( function () {
// Need a 'click' event to turn on sound for mobile devices
if (audio_init === undefined) {
audioElement.play();
}
audio_init = 1;
However, this was not successful.
I then tried web audio, again, this code allows me to play on a desktop browser, but nothing on mobile:
var webaudio_play = function(url) {
ctx = new webkitAudioContext();
var req = new XMLHttpRequest();
req.open("GET",url,true);
req.responseType = "arraybuffer";
req.onload = function() {
ctx.decodeAudioData(req.response, function(buffer) {
var src = ctx.createBufferSource();
src.buffer = buffer;
src.connect(ctx.destination);
//src.start();
src.noteOn(0);
});
};
req.send();
}
I really have no idea where to go next. Has anyone succeeded in pushing and playing an audio file to a mobile device?
