One of the additions to the HTML5 spec is the new <audio> and <video> tags which allows you to play sounds (or videos) and control them programatically via JavaScript.
Audio tag information via HTML5Doctor.com
I thought this would be a great addition to the game for the question screen, where the idea was that when the countdown timer got to 10 seconds left an audio file of a ticking clock sound getting progressively louder would play, and then when the time reached zero, a bell sound would go off.
The code worked great on a desktop, but there are some restrictions in the iOS WebKit which prevents it from being used in the game, so I removed it. Specifically:
- iOS blocks a web page from automatically playing a sound via the autoplay attribute in order to save bandwidth (fair enough)
- In order to play the sound, a user action is required to trigger the sound
- In previous versions of iOS, javascript could be used to simulate a click on the page which would trigger the sound – this hack stopped working with iOS 4.2
So much for that idea… So rather than an audio cue when the timer ran out, the app uses JavaScript to flash the background color of the timer to let the player know time’s up.