mirror of https://github.com/captbaritone/webamp.git synced 2026-07-25 11:04:00 +00:00

No description

html5 javascript port reimplementation webaudio-api winamp

Find a file

Fathony Luthfillah 8ae08dce40 Show ColorTheme Form, Movable window/layer (#1161 ) * Toggle container (action) it works but the container is currently empty. * Wasabi:Frame:Xxx : parse,load,init this patch has no error, but not visible due relatW/relatH not available * implement relatW/relatH This patch shows the bigColorTheme window * movable,resizable Tested with MMD3 only * bugfix: unexpected gotoTarget result * allow unregister eventListener, etc. minor. * make the group movable * trial to move MMD3 main window * Prettier. * bugfix invalid clip-path value * speedup devtool: simplify tag,style * bugfix clip-path. Issue: the bigColorTheme didn't rendered properly * mute console * avoid lowercasing the color-theme-name * avoid double negative historically, it was easy to understand : 100% - 12px due I think there shall never be 100% + 12px. BUT they did! there is something 100% + 99px ! Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * unregisterable self-event-listener Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * improve readability Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * improve readability Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * relat() -> relative() * del "../winamp modern" (specific skin only) * prettier * avoid exposing private on other class. * del dead code, +comments * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * typo Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * +comment, prettier * remove bind() for better unregister event listener * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * del dead code Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * add note of what going on. Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com> * warn for premateur bitmap that has no id. * del dead code * warn for unknown/unlisted guid * remove seekerGhost transparency hack, prettier. * typo * guarding move vs resize to be not overlapped * bugfix invalid css caused by empty array * del dead var * del premateur logic (no use case with MMD3) * add comment: clarify that getToken is 0 based. * bugfix typo of ambiguous var name. @captbaritone: having w and W in the same namespace is too confusing. * del confusing code Co-authored-by: Fathony <fathony@smart-leaders.net> Co-authored-by: Jordan Eldredge <jordan@jordaneldredge.com>		2022-03-20 00:47:13 -07:00
.github/workflows	Try to fix tests	2022-03-10 00:06:27 -08:00
.yarn/releases	Try locking Yarn version (#1066 )	2021-02-13 19:50:09 -08:00
config	Test server, including GraphQL endpoint	2022-03-09 21:40:01 -08:00
examples	Enable top-level lint	2022-03-06 23:05:11 -08:00
packages	Show ColorTheme Form, Movable window/layer (#1161 )	2022-03-20 00:47:13 -07:00
.editorconfig	Format css according to prettier default config	2018-10-20 10:12:19 -07:00
.eslintignore	Enable top-level lint	2022-03-06 23:05:11 -08:00
.eslintrc	Enforce Prettier at the root	2022-03-06 23:08:43 -08:00
.gitattributes	Move skin stuff to their own packages	2020-05-17 22:24:35 -07:00
.gitignore	Add extend handlers for openUrl, load/save list (#991 )	2020-05-24 08:33:58 -07:00
.prettierignore	Add format command	2022-03-18 00:16:50 -07:00
.yarnrc	Try locking Yarn version (#1066 )	2021-02-13 19:50:09 -08:00
babel.config.js	Unify tests into the top level workspace	2022-03-06 22:41:18 -08:00
deploy.sh	Make ./deploy.sh executable (#1117 )	2021-07-22 08:57:10 -07:00
LICENSE.txt	Fix links in root README	2020-07-03 22:02:09 -07:00
netlify.toml	Add bot url alias	2021-04-21 21:14:33 -07:00
package.json	Add format command	2022-03-18 00:16:50 -07:00
README.md	Fixes #1132	2021-11-11 20:03:23 -08:00
yarn.lock	Enforce Prettier at the root	2022-03-06 23:08:43 -08:00

README.md

Webamp

A reimplementation of Winamp 2.9 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.

Add Webamp to Your Site

Here is the most minimal example of adding Webamp to a page:

<div id="app"></div>
<script src="https://unpkg.com/webamp"></script>
<script>
    const app = document.getElementById("app")
    const webamp = new Webamp();
    webamp.renderWhenReady(app);
</script>

For more examples, including how to add audio files, check out examples/ directory and the API documentation.

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/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/archive-org-webamp-integration-tests: An integration that confirms that archive.org's Webamp integration is working as expected
packages/webamp-modern: A prototype exploring rendering "modern" Winamp skins in the browser
packages/webamp-modern-2: A second attempt at 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

Thanks

Butterchurn, the amazing Mikdrop 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.