Webamp NPM Module

Development

I do most development by starting the demo site in dev mode and iterating that way. The following commands will install all dependencies, run an initial development build and then start a local server. Every time you save a file, it will rebuild the bundle and automatically refresh the page.

# First clone the repo, then...
cd webamp
# Change into the NPM module's sub directory
cd packages/webamp
# __Note:__ Please use yarn over npm, since yarn will respect our `yarn.lock` file
yarn install
yarn start

http://localhost:8080/ should automatically open in your browser.

# Run tests and lint checks
yarn test

Building

The NPM module is built separately from the demo site. To build it run:

yarn run build-library

This will write files to ./built.

Testing

yarn test

This will run the tests the linter and the type checker.

To update snapshots run

yarn test -u

Reference

• skinspecs.pdf
• Skinner's Atlas 1.5 by Jellby
• Winamp Skinning Tutorial
• Sacrat Skinning tutorial parts 1, 2, 3, 4, and 5,
• Winamp Wiki

Predecessors

• Webamp2x An impressive implementation from 2002(!).
• JsAmp An implementation from 2005 by @twm (via Hacker News).
• LlamaCloud Comp From 2011 by Lee Martin (via Twitter)
• Winamp em HTML5 e Javascript In 2010 a developer named Danilo posted one of his HTML5 experiments: "an audio player simulating good old Winamp". You will have to download the zip file.
• JuicyDrop An HTML5 implementation with less emphasis on being true to the skin, but fully featured visualizations. @cggaurav is keeping it alive on GitHub
• Spotiamp The folks at Spotify reimplemented Winamp as a frontend for Spotify. Not in a browser, and only runs on Windows. It has since been discontinued.