HTML5-Audio-Player mit XSPF-Unterstützung
Aufgrund eines -erm- Vorschlages, habe ich mich mal hingesetzt und einen HTML5-Audio-Player geschrieben. Natürlich habe ich vorher nicht gesucht, ob es schon fertige Player gibt. :P Hätte ich das getan, hätte ich wahrscheinlich den jPlayer eingebunden. Allerdings kann der keine XSPF-Playlisten lesen und hat nicht so eine hübsche Laufschrift für zulange Titel. ;) (Ja, die sollte dort auch recht einfach einzubauen sein...)
Testet das gut Stück doch mal bitte auch Herz und Nieren und teilt mit, ob er was taugt.
Vielleicht veröffentliche ich dann auch mal den Sourcecode und wie mal den Player einbindet (höhö).
[Update:
Wenn die PC-Welt schon hierher verlinkt, dann lüfte ich doch auch mal das Geheimnis um die Einbindung des Players. Nicht, dass es sonderlich versteckt wäre. ;)
<script src="/files/xspf_parser.js"></script>
<script src="/files/jquery-latest.min.js"></script>
<script src="/files/test.js"></script>
<link rel="stylesheet" type="text/css" href="/files/style.css">
<div id="player_1">
</div>
<script>
loadPlayer("/files/fmc10/Freeloaded-Sinn-ogg.xspf", "player_1");
"player_2");
</script>
Ist also alles recht überschaubar. Die id des divs wird dem JavaScript übergeben, das den Player lädt. Dazu dann noch die URL der Playlist und gut ist.
Optisch lässt sich das ganze noch beliebig aufpeppen. Mit ein wenig Aufwand kann man aber sicher auch die XSPF-Unterstütung auch in den jplayer einbinden, der von Haus aus ganz andere Konfigurationsmöglichkeiten bietet. Mit denen man sich dann aber halt auch auseinandersetzen. Mir gefällt die Einfachheit von meinem Player trotzdem besser. Sollte ihn jemand irgendwo einsetzen, würde ich mich über eine Rückmeldung freuen. Aufgrund von mangelnder Erfindungshöhe maße ich mir nicht an, irgendwelche Rechte am Code geltend zu machen.]
Trackback URL for this post:
Bewerte dies

Klicke hier (oder direkt auf den Play-Button), um den Jamendo- Player zu starten.
Achtung: Das Widget lädt Daten von Servern, die eventuell andere Datenschutz- richtlinien haben als wir.





Kommentare
Hallo Herr Hufgard
Ich bin schon seit einiger Zeit auf der Suche nach einem HTML5 Player der XSPF kann. Nun bin ich endlich fündig geworden, doch irgendwie hapert es noch bei der einbindung.
Hier der Code in der dashboard.php
loadPlayer("js/Freeloaded-Sinn-ogg.xspf", "player_1");
Wenn ich den Code übernehme und die Pfade für die Dateien anpasse, bekomme ich den folgenden Fehler:
dashboard.php:607Uncaught ReferenceError: loadPlayer is not defined
(anonymous function)
Informationen die ich bieten kann:
Browser: Chrome 11.0.696.65
OS: Windows 7 Ultimate x64
Ressources Tab (Chrome):
test.js
xspf_parser.js
style.css
dashboard.php (1) <<<< Hier scheint das Problem zu liegen.
Ich gebe zu dass ich nicht gerade fit in JS bin, deshalb wäre ich froh, wenn sie mir hier weiterhlefen könnten.
Grüsse und ein schönes Wochenende, PB
PB (nicht überprüft) - Fr, 05/13/2011 - 12:29.
Hallo,
also in Chrome selber funktioniert der Player. Wäre also spannend zu sehen, was in der dashboard.php alles steht. Ein Link zur Seite wäre alternativ auch ok. :)
musikpirat - So, 05/15/2011 - 09:34.
Muss das leider bestätigen - werde das Teil auch mal (würg, vielleicht nicht grad direkt nach dem Essen....) mit dem IE testen. Sieht ansonsten gut aus. Würde mich interessieren, wie man das Teil in eine Joomla-Seite reinbekommt...
Oh shit: im IE wird das Teil bei mir nur als weißer Rahmen ohne Inhalt angezeigt.
Nathan Nörgel (nicht überprüft) - So, 09/19/2010 - 16:37.
Wundert mich nicht wirklich. Der IE hat's nicht so mit HTML5. Für solche Steinzeit-Browser könnte (tm) man ein Fallback auf einen Flash-Player einbinden. Der bräuchte dann aber wiederum MP3s in der Playliste.
Kann man in joomla HTML direkt in einem Beitrag einbinden? Dann wären das nur ein paar weniger Zeilen. Aber ich denke, bis man den wirklich produktiv einsetzt, sollte noch ein wenig daran geschraubt werden. :)
musikpirat - So, 09/19/2010 - 16:44.
Moin Moin
Die Lautstärkeregelung funktioniert hier mit Firefox 3.6.10 nicht.
Mouse_over bringt Lautstärkeregelung zum Vorschein, wird dann aber wenn man versucht mit der Maus die Lautstärke zu regeln wieder ausgeblendet sodas eine Lautstärkeänderung nicht möglich ist.
Micxs (nicht überprüft) - So, 09/19/2010 - 16:15.
Interessanter Effekt. Ich würde da erst mal dem FF die Schuld für geben, denn ich fummel an dem Audio-Element nicht rum. *nachschau*
musikpirat - So, 09/19/2010 - 16:19.
Kommentar hinzufügen