Since i sporadically make electronic compositions and master them to „tracks“ in MP3 format, over the years a bunch of such files have accumulated. Until recently i was using a software i had named MyPlayer, based on mediaelement.js („mejs“) with a 3rd-party playlist plugin and some extension for parsing an M3U playlist. As it goes, mejs published a new version containing breaking changes and an integrated playlist … For a while i tried to port my existing code to that new version, encountered many bugs and tried to fix them, but i realized that, since web development is not my main job anymore, i found insufficient time for the depth and complexity of such work, and my attempts lead nowhere.

In my new, latest iteration of the Music Archive i have changed the technology stack and implemented a more conventional backend/frontend architecture.

• An offline process reads every MP3 found locally on the server and generates an M3U.
• A PHP backend reads the M3U, generates list and single item views and provides JSON for dynamic functions of the frontend (lists of items and item details).
• The single item view implements a customized audio player; the native media element of the browser is hidden.

Try It

• List view
• Example for single item view

Thanks

Idorenyin Udoh’s article Let’s Create a Custom Audio Player was very helpful when implementing the customized audio player.