In einem anderen Artikel wurde gezeigt wie man das TYPO3 Medien Element auf HTML5 Audio ädern kann. Als Ergäzung werden nun der Audio Datei mittels JavaScript die ID3 Daten ausgelesen und angezeigt.

Damit die ID3 Daten ausgelesen werden können, benötigt man binaryajax.js und id3.js. Beide Dateien findet man im src Ordner des JavaScript-ID3-Reader Projekts.

In diesem Beispiel werden jedoch die Dateien aus der ZIP Datei vom Blog Beitrag verwendet. Weil einige Browser den <audio> Tag nicht verstehen wird ebenfalls der AudioJs Player eingesetzt.

Mit jQuery werden zuerst alle <audio> Tags der Seite eingelesen. Danach wird der ID3 Lib der Pfad der Datei übergeben und unterhalb dem <audio> Tag ein DIV Element erstellt, in welchem die ID3 Daten angezeigt werden.

Nachtrag: Leider klappt es im Firefox (3.6.x) nur beim ersten laden. Sobald die Datei im Cache ist, werden die Daten nicht mehr angezeigt.

• Wikipedia ID3-Tag
• Demo Seite des Erstellers der JS Libs