webamp README

The project's README from github.com/captbaritone/webamp. As one markdown file: README.md.

Webamp

A reimplementation of Winamp in HTML5 and JavaScript with full skin support. As seen on TechCrunch, Motherboard, Gizmodo, Hacker News (1, 2, 3, 4), and elsewhere.

Check out this Twitter thread for an illustrated list of features. Works in modern versions of Edge, Firefox, Safari and Chrome. IE is not supported.

Read the docs

The Webamp Documentation site contains detailed instructions showing how to add Webamp to your site and customize it to meet your needs.

About This Repository

Webamp uses a monorepo approach, so in addition to the Webamp NPM module, this repository contains code for a few closely related projects and some pieces of Webamp which are published as standalone modules:

packages/webamp: The Webamp NPM module
packages/webamp-demo: The demo site which lives at webamp.org
packages/webamp-docs: The documentation site for Webamp the NPM library which lives at docs.webamp.org
packages/ani-cursor: An NPM module for rendering animiated .ani cursors as CSS animations
packages/skin-database: The server component of https://skins.webamp.org which also runs our Twitter bot, and a Discord bot for our community chat
packages/winamp-eqf: An NPM module for parsing and constructing Winamp equalizer preset files (.eqf)
packages/webamp-modern: A prototype exploring rendering "modern" Winamp skins in the browser
examples: A few examples showing how to use the NPM module

Community

Join our community chat on Discord: https://discord.gg/fBTDMqR

Related communites:

Winamp Community Update Pack - "New plug-ins to add additional features to Winamp as well as replacement plug-ins to provide better implementations of some of the plug-ins natively included with Winamp". (Forum / Discord server)

In the Wild

An incomplete list of websites using Webamp:

Internet Archive - The Internet Archive lets you preview winamp skins and listen to audio tracks using Webamp
Winampify.io - An online Spotify client using Webamp
Webamp Desktop - An Electron app version of Webamp
98.js.org - A Windows 98 clone in JavaScript (GitHub)
winxp.now.sh - A Windows XP clone in JavaScript with React (GitHub)
Try Andy's Desk - A quirky Windows themed desktop experience.
www.dkdomino.zone - Someone's personal music player
Bamp - A web app for a tool that converts winamp skins to/from a format that streamlines skin design. (GitHub)

Thanks

Butterchurn, the amazing Milkdrop 2 WebGL implementation. Built and integrated into Webamp by: jberg
Research and feature prototyping: @PAEz
Beta feedback, catching many small UI inconsistencies: LuigiHann
Beta feedback and insider answers to obscure Winamp questions: Darren Owen
Donating the webamp NPM module name: Dave Eddy

Thank you to Justin Frankel and everyone at Nullsoft for Winamp which inspired so many of us.

License

While the Winamp name, interface, and, sample audio file are surely property of Nullsoft, the code within this project is released under the MIT License. That being said, if you do anything interesting with this code, please let me know. I'd love to see it.

Development

This repository uses Turborepo for efficient monorepo management. Turborepo provides intelligent caching and parallel execution of tasks across all packages.

Quick Start

# Install dependencies
pnpm install

# Build all packages (automatically handles dependencies)
npx turbo build

# Build library bundles for packages that need them
npx turbo build-library

# Run all tests
npx turbo test

# Lint and type-check all packages
npx turbo lint type-check

# Work on a specific package and its dependencies
npx turbo dev --filter="webamp"

Package Dependencies

The monorepo dependency graph is automatically managed by Turborepo:

ani-cursor and winamp-eqf are standalone packages built with TypeScript
webamp depends on both ani-cursor and winamp-eqf for workspace linking
All packages are built in the correct topological order
Builds are cached and only rebuild what has changed

Available Tasks

build - Main build output (Vite for demos, TypeScript compilation for libraries)
build-library - Library bundles for NPM publishing (only applies to webamp)
test - Run unit tests with Jest
type-check - TypeScript type checking without emitting files
lint - ESLint code quality checks
dev - Development server (for packages that support it)

For more details on individual packages, see their respective README files.

Searching Database…

11.3K ·GitHub

What is this?

Webamp is a reimplementation of the classic Winamp 2 music player built entirely in HTML5 and JavaScript, with full support for original Winamp skins.

Is this a ready-made app or a library I embed myself?

It's primarily a JavaScript/TypeScript library (the webamp NPM module) that you embed and customize in your own website; the repo is a monorepo that also contains a demo site, a docs site, and a few standalone helper packages.

How do I add Webamp to my site?

Install the webamp package and follow the step-by-step integration and customization guide on the Webamp Documentation site (docs.webamp.org).

Does it work in every browser?

It works in modern versions of Edge, Firefox, Safari and Chrome, but Internet Explorer is not supported.

What's the deal with the Winamp branding and the license?

The code itself is released under the MIT License, but the Winamp name, interface look, and sample audio file remain property of Nullsoft — only the code is open source.

What is Butterchurn and how does it relate to Webamp?

Butterchurn is a WebGL implementation of the Milkdrop 2 visualizer that has been built and integrated into Webamp, bringing the classic Winamp music visualizations to the browser.

What other packages live in this monorepo?

Besides the core webamp library, it includes winamp-eqf for parsing Winamp .eqf equalizer preset files, ani-cursor for rendering animated .ani cursors as CSS animations, a demo site, a docs site, and an experimental webamp-modern renderer for newer Winamp skin formats.

Where can I see Webamp used in the wild?

Sites built on Webamp include the Internet Archive's skin and audio previewer, the Spotify client Winampify.io, a standalone Webamp Desktop Electron app, and OS-themed web experiences like 98.js.org and winxp.now.sh.

What are similar projects?

formatjs, nx, typescript-eslint, qiankun, howler.js, discord.js, js-stack-from-scratch, Libraries.dev

Which topics is it in?

turbo, discord-bot, jest, twitter, eslint, music-player, html5, webgl, monorepo, vite, audio, npm

Creator: captbaritone
Size: 152.7 MB
Stars: 11.3K
Updated: CommitOct 17
Age: 11y
Commits · 90 Days