Tiny HTML5 Mp3 Player

Trying to keep it simple and under 10KB with no dependencies, you just need a modern HTML5 compatible browser. The waveforms were generated with SoX and gnuplot, both available for free on Linux, Windows and OSX.

Bash script to generate waveforms of all mp3 in the current folder:


#!/bin/bash
# Generates waveforms of all mp3 in current folder
# PNG resolution: 980 x 60
# Dependencies: sox and gnuplot

FILES="./*.mp3"

for f in $FILES
do
	sox $f -G -r 4000 -c 1 test.dat && tail -n+3 test.dat > test.datclean

	gnuplot -p -e "set terminal png transparent size 980,60 enhanced; set yr [-1:1]; unset key; unset tics; unset border; set lmargin 0; set rmargin 0; set tmargin 0; set bmargin 0; set output '$f.png'; plot 'test.datclean' using 1:2 every 50 with lines lc rgbcolor '#000000'"
done

rm test.dat
rm test.datclean
		

Import both tinyplayer.css and tinyplayer.js and add this script to your page.
Usage:


TrackList = 
	[
		{
			url:'http://www.mrt-prodz.com/public/mp3/whwd.mp3',
			title:'What Have We Done',
			year:'2007'
		},
		{
			url:'http://www.mrt-prodz.com/public/mp3/right-of-stupidity.mp3',
			title:'Right of Stupidity',
			year:'2004'
		}
	];
//player([tracklist], [show waveform?], [show help?])
tinyplayer(TrackList, true, true);