Simple Round Player.js
A simple script that finds audio tags and wraps them with a graphical round player interface.
Requirements
- jQuery
Installation
Install with Bower or checkout this repository.
bower install simple-round-player --save
How to use
To use, include the javascript file on your page and add a data-srp
attribute to any audio
tags. Afterwards, launch the script using SimpleRoundPlayer.init();
<audio data-srp="true" src="./media/The Ameoba - Showtime (Intro).mp3"></audio>
Customize the colors of the player using basic CSS. For the progress bar, which is rendered in a canvas
, you can pass variables as an optional configuration hash :
SimpleRoundPlayer.init({
containerColor : "#ff0000",
ringColor : "#00ff00",
ringProgressColor : "#0000ff",
strokeWidth : 6,
});