Web
-
Download: Um den Player in eine Webseite zu integrieren, laden Sie zunächst den edML-Player unter download herunter. Entpacken Sie anschließend die Datei an ihrem Zielort (im Folgenden als playerpath bezeichnet).
-
Einbinden: In Ihrer HTML-Datei fügen Sie z. B. im Header folgende Zeilen Code ein:
Damit werden die für den edML-Player notwendigen Dateien auf Ihrer Webseite eingebunden. -
edML-Datei: Speichern Sie die edML-Kursdatei und alle weiteren vom Kurs benötigten Dateien wie z. B. Bilder in ein passendes Verzeichnis auf dem Webserver. Sie können die Kursdateien (edML-Datei + weitere benötigten Verzeichnisse/Dateien) auch in Form einer einzelnen zip-Datei bündeln. Das Verzeichnis der edML-Datei bzw. deren zip-Datei wird im Folgenden als edmlpath bezeichnet. Hilfe: Minimale edML-Datei zum Download
-
Positionierung: Erstellen Sie im body der Webseite an der Stelle, an der der edML-Player den Kurs abspielen soll, folgenden Code:
Für eine Darstellung über den gesamten Bildschirm empfiehlt es sich außerdem folgenden css-Code zu verwenden: -
Abspielen: Um den Kurs abzuspielen, müssen Sie zunächst ein edML-Player-Objekt der Klasse edML_Player erstellen und anschließend die Methode play aufrufen. Im Konstruktor wird dabei der abzuspielende Kurs angegeben. Weitere Möglichkeiten der Einbindung des Kurses und des Konstruktoraufrufs finden Sie unter Konfiguration. Für einen Kurs, der in der edML-Datei course.edml unter edmlpath gespeichert ist, wäre der Aufruf wie folgt:
Zwischen dem Erzeugen des edML_Player-Objektes und der play-Anweisung können ggf. noch Konfigurationsbefehle erfolgen.
Zusammenfassung
Alle Schritte in einer minimalen HTML-Datei zusammengefasst ergeben:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<link rel="stylesheet" href="playerpath/edmlplayer.compress.css">
<script src="playerpath/edmlplayer.compress.js"></script>
<style>
body,html{
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
}
#edml{
height: 100%;
max-height: 100%;
}
</style>
</head>
<body>
<div id="edml"></div>
</body>
<script>
var edmlplayer = new edML_Player("edmlpath/course.edml");
edmlplayer.play();
</script>