Due to limitations with existing web players (jPlayer, SM2 360, etc) the first step was creating pushtape-player.js, a minimal page player designed to integrate closely with Pushtape.

Features:

Global player controls that can be customized in radically different ways (see demos)

Page player convention builds playlist by searching for links found on the current page (or DOM container)

Global control elements can be manually integrated piece by piece, or the script can be dropped into an existing page and bootstrap itself

Autoscan feature automatically monitors DOM changes through a mutation observer, meaning the player always reflects the current playlist of links found in the DOM container even if modified after page load. This makes it very easy to integrate the player in an AJAX site or SPA (single-page-application).

A portable discography format is important because it makes music data portable. Since a discography is really just a collection of releases, we can represent each release with a few key elements: title, URL for artwork, URL for liner notes, and URL for JSPF playlist. The first three elements makes it easy to quickly outline a list of releases, while the JSPF playlist allows for a metadata rich definition of the release, including a detailed tracklist with links to audio files. This also keeps the size of cassette.json quite small, which is important for initial application load time. An example cassette.json can be found in the Pushtape Cassette repository.

For the Drupal 1.0 release, the included pushtape_services module now includes a cassette.json endpoint located at /pushtape/services/cassette. It will build your cassette.json based on album, track, and static page nodes in the main-menu. Note: This endpoint requires the "access jspf" permission in order to view it.

A Decoupled Future

While developing cassette.json, I needed a real-world application where it could be consumed in a useful way. I ended up building Pushtape Cassette, a decoupled frontend framework for building static music apps. Pushtape Cassette is a major development as it does several things at once:

Shows how cassette.json can be used to quickly build a standalone, static music web application

Demonstrates that a single-page-application structure allows for superior music playback experience using the autoscan feature in pushtape-player.js

Demonstrates how a decoupled frontend can be connected to any backend via cassette.json (Build scripts, Drupal, Wordpress, Cash Music, etc)

I'll be writing more about Pushtape Cassette in the near future - stay tuned!