simple-round-player

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

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 the init() command.

    <audio data-srp="true" src="./The Ameoba - Showtime (Intro).mp3"></audio>

    $(function(){
        SimpleRoundPlayer.init();
    });

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 :

    $(function(){
        SimpleRoundPlayer.init({
            containerColor : "#ff0000",
            ringColor : "#00ff00",
            ringProgressColor : "#0000ff",
            strokeWidth : 6
        });
    });

More details and a live example can be found on the plugin's website.