HTML5-Player in Contao 3

[andreas.schempp]

Wie ihr der Ankündigung zum Teamtreffen entnehmen könnt, soll in Contao 3 ein HTML5-Videoplayer eingebaut werden. Nun stellt sich die Frage, welchen wir da verwenden wollen? Ich denke wir sind uns einig dass es keinen Sinn macht, selber etwas zu erfinden.

Folgende Anforderungen/Wünsche sind mir bekannt:

• HTML5-Player für die bekannten Formate (H264/OGG/WebM)
• Fallback für alte Browser über Flash (und ggf. Silverlight)
• Möglichkeit, Untertitel einzubinden (gemäss HTML5-Standard)
• Natives Javascript oder Unterstützung für jQuery UND MooTools bevorzugt

Klar ist auch, dass die Lizenzrechte keine kommerzielle Nutzung einschränken dürfen. Beispielsweise der JW Player scheidet nach meinem Wissen damit bereits aus. FlowPlayer könnte noch knapp gehen, da dort einfach ein Watermark genutzt wird.

Nun meine Umfrage an euch, welche Player kennt ihr und würdet ihr empfehlen? Bitte (noch) keine Diskussionen zu den einzelnen Ideen, nur eine Möglichkeiten-Sammlung.

[andreasisaak]

Ich sag nur mediaelement.js

[Nina]

Ich fände es wichtig, dass der Player inline eingebunden wird (also wie ein Inhaltselement; nicht nur via Popup-Link wie derzeit in der Mediabox).

Außerdem muss es unbedingt möglich sein, dass man mehrere Videos auf einer Seite einbinden kann.

[ben2010]

Ebenfalls ein guter und Library unabhängiger Player ist http://videojs.com/.

[lionel]

Auch für http://videojs.com/

[CeeKay]

Hier mal eine Übersicht: http://praegnanz.de/html5video/

[Nina]

Der Player sollte auch unbedingt tastaturbedienbar sein (gilt besonders für die Flash-Variante davon).

[Nina]

Naja, dass man halt die üblichen Bedienflächen per Tastatur bedienen kann (Start, Stop, Play, Pause, etc.).

Bei HTML5 müssen wir uns da imho nicht so viel Gedanken machen, da es von sich aus schon eingen Support anbietet. Die Browser die da noch spinnen, werden es wohl in absehbarer Zeit hoffentlich richtig machen. Dazu auch diesen Artikel über HTML5-Medien und Tastaturbedienbarkeit.

Bei Flash hingegen müssen wir halt darauf achten, dass der Player das von sich aus schon unterstützt oder herausfinden wie wir die Unterstützung reinbringen können.

[Nina]

So kannst du denken, aber nicht die Kunden bzw. klassische Agenturen die sich damit XX Prozent der Besucher vom Content aussperren würden.

Daher brauchen wir imho ganz klar noch den Flash-Fallback.

[Toflar]

Man sollte zwar die Vorschläge diskutieren, aber einen Kommentar kann ich mir nicht verkneifen
Vorschlagen würde ich auch MediaElement.js oder videojs.com.

videojs.com habe ich mal verwendet und damals war die API leider noch nicht für HTML5 sowie Flash identisch und das endete in einem riesigen Gebastel.
Die daraus abgeleitete Anforderung meinerseits (und ich hoffe, die Entwickler sind mit mir) wäre eine einheitliche API.
Also ich will, dass

player.play();

für HTML5 sowie Flash-Fallback funktioniert

[andreasisaak]

The state of HTML5 Video

[andreas.schempp]

Danke für eure Inputs. Wenn ich alles vergleiche (insbesondere mit dem Vergleichs-Link von Gecko) bleibt eigentlich nur eine Variante: mediaelement.js

Vorteile:

• "Unified API" für HTML5 und Flash/Silverlight
• Keyboard Controls
• Aktive Weiterentwicklung
• Wird auf der Vergleichsseite als "Our personal favourite" angepriesen

Nachteile:

• Benötigt (standardmässig) jQuery
• Kann keine Playlists

Probleme anderer Player:

• VideoJS hat keine Tastaturbedienung und kann kein Audio
• LeanBack Player sagt "Supports your Flash- and HTML-Fallback" (= kein natives Fallback/Unified API)
• Alle anderen haben schon die grundlegenden Kriterien (z.B. Fallback) nicht unterstützt

Hat noch jemand eine Anmerkung/Anregung dazu? Sonst würde ich diesen Player für Contao 3 vorschlagen. Für das MooTools-"Problem" gibt es bereits eine Lösung ;-)

[Nina]

Für das MooTools-"Problem" gibt es bereits eine Lösung ;-)

Wie funktioniert die Lösung für MooTools? Aus den paar Brocken Text auf der Git-Seite wurde ich jetzt nicht schlau

[andreas.schempp]

Es gibt auch noch keine Beschreibung, dafür war ich gestern (heute) um 2 Uhr zu müde ;-)
Aktuell gibt es einen MooTools-Compatibility-Layer. Dieser bietet die benötigten jQuery-Funktionen über MooTools an. Das hat den Vorteil dass Updates von mediaelement.js nahezu 1:1 übernommen werden können, denn an den Originaldateien ändert sich nichts.

[Nina]

Danke, klingt gut