webamp/index.html
Jordan Eldredge 21f4712b0f Progress on work indicator
This should be the right Javascript/CSS but it doesn't look right for Chrome or FF users yet because of the glitch rendering these four pixels from the BMP file in those browsers. The feature now works in Safari.
2014-11-08 20:35:52 -08:00

75 lines
3.2 KiB
HTML
Executable File

<!DOCTYPE html>
<html>
<head>
<title>Winamp2-js</title>
<link rel='stylesheet' type='text/css' href='winamp.css' />
</head>
<body>
<div id='winamp'>
<audio id='player'></audio>
<div id='title-bar' class='selected'>
<div id='option'></div>
<div id='shade-time'>
<div id='shade-minus-sign'></div>
<div id='shade-minute-first-digit' class='character'></div>
<div id='shade-minute-second-digit' class='character'></div>
<div id='shade-second-first-digit' class='character'></div>
<div id='shade-second-second-digit' class='character'></div>
</div>
<div id='minimize'></div>
<div id='shade'></div>
<div id='close'></div>
</div>
<div class='status'>
<div id='clutter-bar' class='disabled'></div>
<div id='play-pause' class='stop'>
<div id='work-indicator'></div>
</div>
<div id='time'>
<div id='minus-sign'></div>
<div id='minute-first-digit'></div>
<div id='minute-second-digit'></div>
<div id='second-first-digit'></div>
<div id='second-second-digit'></div>
</div>
<div id='visualization'></div>
</div>
<div class='media-info'>
<div id='song-title' class='text'></div>
<div id='volume-message' class='text'></div>
<div id='balance-message' class='text'></div>
<div id='kbps'></div>
<div id='khz'></div>
<div class='mono-stereo'>
<div id='mono' class=''></div>
<div id='stereo' class='selected'></div>
</div>
</div>
<input id='volume' type='range' min='0' max='100' step='1' value='50' />
<input id='balance' type='range' min='-100' max='100' step='2' value='0' />
<div class='windows'>
<div id='equalizer'></div>
<div id='playlist'></div>
</div>
<input id='position' type='range' min='0' max='100' step='1' value='0' />
<div class='actions'>
<div id='previous'></div>
<div id='play'></div>
<div id='pause'></div>
<div id='stop'></div>
<div id='next'></div>
</div>
<div id='eject'>
<input id="file-input" type="file" />
</div>
<div class='shuffle-repeat'>
<div id="shuffle"></div>
<div id="repeat"></div>
</div>
<a id='about' target='_blank' href='https://github.com/captbaritone/winamp2-js'></a>
</div>
<p style="position: absolute; bottom: 0;">by <a href='https://twitter.com/captbaritone'>@captbaritone</a> - <a href='https://github.com/captbaritone/winamp2-js'>GitHub</a></p>
<script src="winamp.js"></script>
</body>
</html>