Download ZIP Download TAR

What is This?

This is the BPS (Bill Paxton Soundboard), my entry into the UI Developers Guild Coding Challenge for February 2024 at the company I work for.

If you want to know a bit more about how (and why) it was made, be sure to check out the blog post I wrote about it when it was released on 2024-02-10.

The Rules

This particular challenge had 3 simple rules (copied verbatim below):

1. Play some kind of music / sound
2. Be viewable
3. Don't work over 4hrs!!!!

The BPS satisfies all 3 of the rules: it's an HTML5 / CSS / JS application that creates a series of virtual audio tags, and then loads a WAV or MP3 into each one before inserting them into the document. It then renders a series of clickable image-buttons (each one being an img tag, surrounded by a figure tag, and augmented by the text of a figcaption tag) and attaches a play() function to the click handlers for those figures. Plus, I wrote it all in under 4 hours:

• One hour thinking through the concept and writing the rough draft player.js and main.js modules;
• One hour to turn draft into an MVP, addressing layout and audio issues;
• One hour to add images and expand the audio selection; and
• One final hour to add mobile support and some light documentation.

How to Install Locally

1. Download either the ZIP'd or TAR-balled version.
2. Decompress it:
   • For the ZIP: unzip bps.zip
   • For the TAR-ball: tar -xvzf bps.tar.gz
3. Change to the new directory: cd bps
4. Start an HTTP server: npx http-server
5. Point your web browser to http://127.0.0.1:8080/.

Copyright

• True Lies is copyright 1994 20th Century Fox.
• Aliens is copyright 1986 Twentieth Century Fox.
• Weird Science is copyright 1985 Universal Pictures (I think).

The images and sound clips used for the Bill Paxton Soundboard are copyright their respective owners, and used under the fair use provision of the Constitution of the United States of America.

All other content on this page (including scripts and text content) is released under a Creative Commons CC0 1.0 Universal license.

Share and enjoy!

More of Eric's Web Stuff