Circleplayer
A CSS3 HTML5 audio player with a circular seekable progress bar and complete fallback
Install / Use
/learn @maboa/CircleplayerREADME
CirclePlayer is a demo intended to showcase the jQuery HTML5 Media Library jPlayer https://github.com/happyworm/jPlayer
Uses HTML5 Audio, CSS3 Transforms (transform:rotate) hooks provided by : https://github.com/lrbabe/jquery.rotate.js
A full browser fallback is planned, jPlayer provides the Flash HTML5 Audio fallback and the idea is to use a sprite map to display progress in non CSS3 compliant browsers. http://modernizr.github.com/Modernizr/ could be used to check CSS3 transform:rotate compliance.
Possibilities exist to enhance the demo with https://wiki.mozilla.org/Audio_Data_API for supporting browsers.
Note the progress bar will not function correctly in Opera 11 due to a JIT compiler bug in the Opera browser : http://twitter.com/dstorey/status/28108260418523137
The demo's current look is heavily inspired by http://forrst.com/posts/Untitled-CJz
Thanks to Jussi Kalliokoski for contributing.
CirclePlayer is dual-licensed under the GPL and MIT licenses
