I needed html5 audio on ios 5 (ipad exactly) for a client. Since the audio support on MobileSafari and UIWebView is somewhat sketchy, it was impossible to certify a sound playing on touch without lag (or sometime no sound at all).
Here's the limitation for the audio tag on iOS5 (and previous) : you can't initiate (preload or play) a sound without a user interaction first. Even after that, you can't be sure when the audio file is going to be loaded or streamed, and you don't know when it's going to stop. Furthermore, no possibility to play several sounds mixed together.
I then remembered of the concept of "audio sprites". You load a sprite consisting of all your SFX pasted in a unique file, and then you move the head along the file when you need to play a specific sound.
I found two implementations for Javascript (https://github.com/koggdal/AudioSprite & remysharp.com/2010/12/23/audio-sprites/), and chose the first one.
Here's the demo http://dl.dropbox.com/u/1412774/AudioSpriteExample/index.html (you're not going to hear any sound if you are not using an ipad or an iphone to access it...). I tested it against iOS 4.X & iOS 5.
Since I don't have access to the core C2 script (and injecting something inside the prettyfied minified JS is not something I can handle without breaking things), I added the JS file inside the HTML page exported by Construct.
So you need to :
1) put http://dl.dropbox.com/u/1412774/AudioSpriteExample/audiosprite2.js inside your exported game folder, next to your index.html
2) concatenate all you audio SFX inside a single audio file. Put blank audio part between your sounds, and make a quick note of the starting and ending timing for each one of them (in milliseconds. You can use something like Audacity).
3) put a file like http://dl.dropbox.com/u/1412774/AudioSpriteExample/audiomodif.js at the root, and modify it to reflect you audio structure.
In the create function, you need to add the number of samples, and their timing.
function create(){
sprite = new AudioSprite("audiosprite.mp3", [ { start: 50, length: 450 }, { start: 800, length: 900 }, { start: 1601, length: 2200 } ])
sound1 = new Sound(sprite, 0);
sound2 = new Sound(sprite, 1);
sound3 = new Sound(sprite, 2);
}
Don't forget to add a var and a function to play each of those sounds !
var sound4;
function play4(){
sound4.play();
}
4) By using the wonderful CallJS plugin (http://www.scirra.com/forum/plugin-call-javascript_topic45866.html), you can bind the create() and play() functions of your external JS to actions inside your C2 game.
4.1) Since it's a limitation of iOS, you need to start the sound loading by initiating a user action. I "force" him to click on something on screen, and bind that action the the create() function with CallJS (you can see the example here http://dl.dropbox.com/u/1412774/AudioSpriteExample/AudioSpriteExample.capx).
4.2) I attach the various "playX()" calls to the various objects inside my C2 scene.
And.... DONE !
Some caveats, though : you can only play one sound at a time with JS on iOS (it steams from the fact that javascript can only send one sound buffer at a time to the decoder, and can't premix those buffers). So you're not going to be able to play a background music and sound SFX on top of that.
Before yelling that is doesn't work, check the file format you are using oin the platform for your concatenated sound (.mp3/.m4a and not .ogg for iOS), and double check that the embedded url inside your JS file reflect that.