New Feature: Inline Audio for MP3, AAC, WAV, FLAC, M4A, WAVE

navindra

This is a bit of an academic feature but it was requested by @WieWaldi and there have been recent posts here linking to MP3 files.

Now, if you post a link for an audio file that ends with MP3, M4A, AAC, FLAC, WAV, or WAVE, it renders like this:

11. navindra Navindra Umanee - Bluebird.mp3:

Basically it's taking the filename from the URL + embedding an inline audio player below. It's scary what Claude can do, but here we are.

You can see the pull request here if you're curious.

Note: I need to reprocess older posts so that they can be re-rendered with this new audio player. I'm going to keep that for a weekend project, because I need to be extra cautious about backend changes.

danno858

navindra So forgive me if this is a dumb question, but would we upload an actual file or just point to a file that we host ourselves someplace else?

WieWaldi

Amazing 😍
Thank you Navindra. I didn't expect this feature to come in so early.

navindra Note: I need to reprocess older posts so that they can be re-rendered with this new audio player. I'm going to keep that for a weekend project, because I need to be extra cautious about backend changes.

I would be very cautious with that. There are too many ways the mp3 could have been shared:

https://mysite/mysong.mp3
[my display text](https://mysite/mysong.mp3)
[[img]funny.gif[/img]](https://mysite/mysong.mp3)
[funnytext [img]funny.gif[/img]](https://mysite/mysong.mp3)

Especially the 2nd variant with a link text is often embedded in a normal English sentence. If this is replaced by the widget, the entire post could look dismantled. Using this new feature, it would make maybe more sense, to shape the entire post differently. Like putting the audio widget at the end of the paragraph and maybe even writing some different text.

In other places you could have only the plain mp3 link without text, but the link itself contains enough text to let you know what it is about.

What about leaving all old posts exactly as they are? Just offering the widget for upcoming posts is more than we can ask for.

Thank you again.

navindra

navindra Note: I need to reprocess older posts so that they can be re-rendered with this new audio player. I'm going to keep that for a weekend project, because I need to be extra cautious about backend changes.

This is done now. As a bonus, this chore command fixed up all those broken Amazon links in the process.

I've got a backup of the before/after, so I can always spot fix anything if needed.

navindra

danno858 Uploads are not supported currently, so this is only a nicety if you have a direct download file that's hosted somewhere.

Anyone interested in support for uploading audio files to PianoTell? If so, I can look into that.

WieWaldi I would be very cautious with that.

Clever thought process! Are you a software engineer by any chance?

Note that the reparsing is not different from what would happen for a new post, so fortunately we can verify your test cases directly to see what would happen. The parsing logic seems to be clever enough to handle these cases as expected.

What about leaving all old posts exactly as they are? Just offering the widget for upcoming posts is more than we can ask for.

Something in me won't stand for that. 😃

Note that the original content of the post is preserved. The reparsing only generates an XML representation of the post that tags the links and allows the renderer to display it in this way.

You will always see the original content when you edit the post.

WieWaldi

navindra Are you a software engineer by any chance?

Yes, I am.🤓
And I am fan of KISS. 😚

navindra What about leaving all old posts exactly as they are? Just offering the widget for upcoming posts is more than we can ask for.

Something in me won't stand for that. 😃

Then let me give you two nice usecases:

This is a nice looking post in the 40-pieces challenge. Some of the links direct to youtube, some to soundcloud and some to a mp3 file inside my dropbox account. If your parser does automatic replacing an every case, then the post would be torn apart. If you replace the three .mp3 links with the widgets, the tiltes (Susanna, Bagun, This Old Man) would vanish. Or if you just add the widget behind the link, then the post would look weird because some lines have a player, some not.

Or what about a post like the following one, when everything is embedded inside an English sentence:
(If I had know how to use the audio-player widget, I would have used it, but I'd written the entire paragraph differently)

Today morning I made another Leon on Me practice recording. Had some issues with with the keeping the rythm. Was running ahead of the metronome. And now I did a practice recording of the outro. It is still at a very low speed, but I think the metronome alignment got better.

What about dropbox links, https://www.dropbox.com/scl/fi/jzd4g55xzhbcytld4np04/2026-03-04-Lean-On-Me-playthrough.mp3?rlkey=4l2qd8ygnzglccv1fz2hguz4i&st=pq7adsev&dl=0 with the cryptic addon key for a public available link. Will this be recognized by the parser?
I am sure, there are another sites beside dropbox, but using a different form of sharing a public link. In this case you would have to do a lot of research how different sites format those links.

I still think, just adding a bb-code like [aud][/aud] should be sufficient and the poster can decide how to format the post to make it look nice.

About the fully automated adding of the widget: It could be ok, if the mp3-link stands alone in free text, being not part of a forum-link. In this case, the author most likely didn't care how the posts looks like, anyway.

navindra

WieWaldi I think we are on the same page in a sense.

This implementation is as KISS as it gets. As you can see, none of your examples are negatively impacted in any way.

This feature has been enabled for a long time on this forum. I only extended it to handle audio now.

As you say, only unadorned links are impacted. Unadorned links are a pretty ugly thing to paste on a forum, so this is a net improvement over that. Instead of requiring markup around it, it is automatically detected... but if you don't want the rendering, you can easily suppress it with markdown and make it an explicit link.

This is unadorned:

10. navindra Navindra Umanee - Canon in D.mp3:

This is as a link:

https://recitals.pianoworld.com/recital_files/Recital_73/10.%20navindra%20Navindra%20Umanee%20-%20Canon%20in%20D.mp3

So you lose nothing.

Dropbox is a very different situation. That Dropbox link you provided is not a direct link to an mp3 at all. It's a link to a website. There's no way to render that as an HTML5 audio player.

However, if Dropbox supports embedding in any way, I can add support for that to the MediaEmbed plugin which is also part of TextFormatter. This is what I did recently to support SproutVideo.