Erweiterung:TimedMediaHandler/VideoJS Player

Bildschirmfoto des neuen Players während der Nutzung

Der VideoJS Player ist der Videoplayer für MediaWiki, der bei den Wikimedia-Projekten verwendet wird.

Der Player nutzt VideoJS und verfügt über eine moderne sowie schnelle Benutzeroberfläche, die auch mit mobilen Endgeräten und HTML5 kompatibel ist.

Verwendung

Beispielvideo im neuen Player

Beispielaudio im neuen Player

Example audio player with subtitles

Es gibt sowohl einen Audio- als auch einen Videoplayer. Beispiele für beide Player findest du auf dieser Seite. Nach dem Start siehst du eine Kontrollleiste, wenn du mit dem Video interagierst.

Die Bedienelemente sind in der Reihenfolge von links nach rechts:

•  Wiedergabe/Pause
•  Lautstärke
• Abspielposition
• Verbleibende Wiedergabedauer
•  Untertitel-Sprachauswahl und Untertitel-kontrollen
•  Auswahl der Auflösung
•  Optionale Bild-im-Bild-Steuerung
•  Steuerung im Vollbildmodus
•  Info-Schaltfläche, um die Seite mit der Dateibeschreibung aufzurufen

Maus- und Tastatursteuerung

• Klicke auf das Wiedergabesymbol über der Miniaturansicht, um die Wiedergabe der Mediendatei zu starten.
• Klicke mit der rechten Maustaste oder mit der mittleren Maustaste auf die Miniaturansicht, um die Seite mit der Dateibeschreibung zu öffnen.
• Wiedergabe/Pause des Players mit einem einzigen Mausklick innerhalb des Player-Fensters
• Doppelklicke auf das Player-Fenster, um den Vollbildmodus aufzurufen oder zu verlassen.
• Die folgenden Tastatursteuerungen sind verfügbar:

  k / Space

  Wiedergabe/Pause der Medienwiedergabe

  f

  Vollbild aufrufen/verlassen

  m

  Stummschalten des Tons

  c / s

  Toggle subtitles on / off

  < / >

  Decrease and increase playback speed

  ← / →

  Skip 5 seconds back / forward

  j / l

  Skip 10 seconds back / forward

  Home / End

  Skip to start / end of video

  , / .

  When paused, skip 1 frame back or forward

• Der Player ist über die Tabulator-, Eingabe- und Leertaste vollständig über die Tastatur zugänglich.

Bekannte Probleme

Der Video Player ist im Entwicklungsstadium. Falls Dir Probleme auffallen, melde sie bitte auf der Diskussionsseite (in englischer Sprache) oder erstelle eine Meldung im Phabricator (ebenfalls in englischer Sprache).

Developers

Developers working on features that use the Video.js player will need to initialize and configure it appropriately. Below is an example of typical usage.

Basic Configuration Example

This is outdated and should be reworked to make use of our player wrappers, which apply consistent options and settings for videojs playback.

// The first argument can be a string ID or a <video> element
var player = videojs( 'my-player-id', {
    controls: true,
    autoplay: false,
    poster: "https://path/to/poster/image"
    sources: [ /* array of source files in various sizes and formats */ ]
} );

The sources can also be provided in the HTML ‎<video> element instead of in JS:

<video class="video-js">
  <source src="//vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
  <source src="//vjs.zencdn.net/v/oceans.webm" type="video/webm">
</video>