nathanupchurch.com/content/blog/new-audio-component-ballin.md

18 lines
1.4 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
title: "A New Audio Web Component; Ballin"
description: "I've gone and built a not-so-fancy audio component for my blog."
date: 2024-10-23
tags:
- Music
- Site Updates
synopsis: "I've gone and built a not-so-fancy audio component for my blog."
imageURL: /audio/covers/ballin.webp
imageAlt: An uncapped fountain pen on top of a pretty, gold-foiled pad of paper beside some envelopes with stamps featuring coffee drinks on them.
mastodon_id: "113360498256457079"
---
Fresh from [my text editor](https://kate-editor.org/) comes a neat little web component that packages the native HTML `<audio>` tag inside a `<figure>` with a song name, title, and a graphic — an album cover perhaps. Here's what it looks like, featuring a very catchy drum and bass tune, "Ballin'," by Vibe Chemistry:
{% audio "Ballin", "Vibe Chemistry", "/audio/ballin.mp3", "/audio/covers/ballin.webp" %}
It's pretty basic for now; it doesn't even truncate an over-long title, but it'll do the job for the moment. My hope is to use this to play short song snippets so that I can talk about and review them. I think this falls pretty squarely under "fair use" in the United States, and there's no admin for litigious record companies to complain to but myself anyway; coincidentally, direct all copyright complaints to [me](/me/) to have any decent snippets of your IP replaced with samples of significantly lower quality.