Information Technology Reference
In-Depth Information
ment. Damit haben wir Zugriff auf das HTMLMediaElement -Interface und können
mit der Implementierung unseres ersten Features beginnen - dem Abspielen
und Stoppen.
4.7.2
Das Starten und Stoppen des Videos
Zum Starten und Stoppen benötigen wir zuerst einmal einen Button im HTML-
Dokument, der auf Benutzer-Klicks reagieren kann:
<input type=button
value="&#x25B6;"
onclick="playPause(this);">
id="playButton"
Hinter &#x25B6; verbirgt sich eine Zeichenreferenz zum Unicode-Symbol BLACK
RIGHT-POINTING TRIANGLE , das wir bequem für den Abspielknopf verwenden
können. Die Funktionalität des Startens und Stoppens selbst steht in playPau-
se() , einer Callback-Funktion, die bei jedem Klick aufgerufen wird und im Ar-
gument this das button -Objekt gleich mit übergeben bekommt:
var playPause = function(ctrl) {
if (video.paused) {
video.play();
ctrl.value = String.fromCharCode('0x25AE','0x25AE');
}
else {
video.pause();
ctrl.value = String.fromCharCode('0x25B6');
}
};
Ob der Film gerade läuft oder nicht, sagt uns das Attribut video.paused . Es
liefert true , wenn der Film angehalten ist, und false , wenn er abgespielt wird.
Das Starten und Stoppen ist damit leicht - video.start() und video.pause()
lauten die passenden Methoden, die ihrerseits video.paused auf false bezie-
hungsweise true setzen.
Das im Argument ctrl übergebene button -Objekt wird dazu benutzt, je nach
Status über ctrl.value die Schaltfläche in einen Pause- oder Abspielknopf
zu verwandeln. Direktes Zuweisen von &#x25B6; hätte nicht das gewünschte
Ergebnis, sondern würde die Zeichenkette &#x25B6; wörtlich als Beschriftung
anzeigen. Der richtige Weg, um Unicode-Zeichen in JavaScript zu erzeugen,
Search WWH ::




Custom Search