Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

On mobile devices that support HTML5 - IOS specifically, an <audio> tag element must exist to actually play a song loaded from a server to prevent "Failed to execute 'play' on 'HTMLMediaElement': API can only be initiated by a user gesture." #149

Open
wants to merge 9 commits into
base: master
Choose a base branch
from
Open

On mobile devices that support HTML5 - IOS specifically, an <audio> tag element must exist to actually play a song loaded from a server to prevent "Failed to execute 'play' on 'HTMLMediaElement': API can only be initiated by a user gesture." #149

Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
4dfd47a
Add the ability to append <audio> tag in the DOM so a song can be pla…
mhdSid Jan 26, 2017
778a3ee
refactor
mhdSid Jan 26, 2017
345bb87
add nested append functions
mhdSid Jan 26, 2017
7224698
add audio src
mhdSid Jan 27, 2017
a71bd9d
use sm2 instead of this
mhdSid Jan 27, 2017
74b46dd
get already existing tag from the DOM
mhdSid Jan 27, 2017
418086f
add condition
mhdSid Jan 27, 2017
916ef06
reuse the create audio element function
mhdSid Jan 28, 2017
e0fad36
remove the element creation from the test function
mhdSid Jan 28, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 24 additions & 3 deletions script/soundmanager2.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -646,6 +646,26 @@ function SoundManager(smURL, smID) {

};

/**
* Create the <audio> element in the DOM
*
* @return {HTMLAudioElement} The audio element created in the dom
*/
this.createAudioElement = function (src) {

try {
var d = doc.createElement('div'),
a = doc.createElement('audio');
d.id = 'sm2-html5Audio-wrapper';
a.id = 'sm2-html5Audio';
a.src = (src) ? src : '';
doc.body.appendChild(d).appendChild(a);
} catch (e) {} finally {
return a;
}

};

/**
* Calls the unload() method of a SMSound object by ID.
*
Expand Down Expand Up @@ -2141,7 +2161,7 @@ function SoundManager(smURL, smID) {

sm2._wD(s.id + ': Cloning Audio() for instance #' + s.instanceCount + '...');

audioClone = new Audio(s._iO.url);
audioClone = (mobileHTML5) ? sm2.createAudioElement(s._iO.url) : new Audio(s._iO.url);

onended = function() {
event.remove(audioClone, 'ended', onended);
Expand Down Expand Up @@ -3096,13 +3116,14 @@ function SoundManager(smURL, smID) {

if (instanceOptions.autoLoad || instanceOptions.autoPlay) {

s._a = new Audio(instanceOptions.url);
s._a = (mobileHTML5) ? sm2.createAudioElement(instanceOptions.url) : new Audio(instanceOptions.url);

s._a.load();

} else {

// null for stupid Opera 9.64 case
s._a = (isOpera && opera.version() < 10 ? new Audio(null) : new Audio());
s._a = (mobileHTML5) ? sm2.createAudioElement() : (isOpera && opera.version() < 10 ? new Audio(null) : new Audio());

}

Expand Down