CEO @ Dropin
An HTML5 Web & Mobile App
A Collaborative Music Tool for Musicians
From Newbie to Pro !
A Cloud Music service for Listeners
Thanks to HTML5 Dropin allows Musicians from all over the world to collaborate in real time in the composition and production process.
They just need to open the browser of their devices, be it Desktop or Mobile, to access an international network of artists.
Users can access Dropin to listen, in streaming, to their favorite tracks, discover new Music,
save their songs in playlists, follow the bands and artists they like, and meet like-minded people.
The tracks produced on Dropin, or those which had been previously produced, and then uploaded, can be classified by using Tags & Moods.
Every time a user listen to, share or purchase and audio content, Dropin refines his profile, identifying his most prominent interests in order to then suggest new content to listen, friendships, musical projects or events, which are strictly in line with his preferences.
Not every Web Browser supports the same audio format.
An HTML5 Web App, must provide the audio contents in different formats, to guarantee accessibility.
|Desktop Browser||Version||Codec Support|
|Internet Explorer||9.0+||MP3, AAC|
|Chrome||6.0+||Ogg Vorbis, MP3, WAV†|
|Firefox||3.6+||Ogg Vorbis, WAV|
|Safari||5.0+||MP3, AAC, WAV|
|Opera||10.0+||Ogg Vorbis, WAV|
Wav is native audio format, it needs a large amount of space.
Ogg Vorbis is a free and open audio encoding format.
MP3 is a proprietary media encoding format.
The HTML5 DOM has methods, properties, and events for the <audio> elements.
We can easily use Modernizr or canPlayType() method
to detect what audio codec is supported by the browser, and declare an audio element.
You don't need to bother with <audio> elements.
HTML 5 lets you access audio API directly:
var audio1 = new Audio(); var audio1 = new Audio(); audio1.src = Modernizr.audio.ogg ? 'audio/demo-audio.ogg' : 'audio/demo-audio.mp3'; audio1.play();
W3C - Audio provides all the details.
Here is some basic methods, properties and events.
|canPlayType()||Checks if the browser can play the specified audio/video type|
|load()||Re-loads the audio element|
|play()||Starts playing the audio/video|
|pause()||Pauses the currently playing audio/video|
|autoplay||Sets or returns if the audio/video should start playing as soon as it is loaded|
|currentTime||Sets or returns the current playback position in the audio/video (in seconds)|
|duration||Returns the length of the current audio/video (in seconds)|
|paused||Sets or returns if the audio/video is paused or not|
|src||Sets or returns the current source of the audio/video element|
|volume||Sets or returns the volume of the audio/video|
|abort||Fires when the loading of an audio/video is aborted|
|ended||Fires when the current playlist is ended|
|error||Fires when an error occurred during the loading of an audio/video|
|pause||Fires when the audio/video has been paused|
|play||Fires when the audio/video has been started or is no longer paused|
|volumechange||Fires when the volume has been changed|