Beim letzten Mal haben wir ein kleines Textadventure namens „DORFLEBEN“ entwickelt, erinnert ihr euch noch?
Ich selbst zocke das Spiel natürlich standesgemäß auf einem Retro-Computer…
…allerdings gibt es wohl kaum noch Leute, die so ein Ding zu Hause stehen haben. Selbst PCs mit 32-Bit-Windows-Betriebssystemen, auf denen DORFLEBEN noch nativ laufen würde, sind mittlerweile Mangelware und es gibt viele Leute, die mit Emulatoren wie z.B. der DOSBox nicht viel anfangen können.
Entsprechend habe ich von ein paar Testern Feedback bekommen, dass man das Spiel irgendwie anders zugänglich machen müsste. Schön wäre z.B. eine Art „Online-Version“, die im Browser lauffähig ist. Eine coole Idee, nur wie zur Hölle soll man ein für MS-DOS entwickelt und kompiliertes C-Programm – also eine EXE-Datei in einem Browser laufen lassen?
So verrückt das Vorhaben klingt – es gibt tatsächlich einige Möglichkeiten, wie man so etwas umsetzen könnte. Die wohl populärste Methode ist „js-dos“, eine auf JavaScript basierende Online-DOSBox mit vielen Konfigurationsmöglichkeiten.
In der Theorie funktioniert das sogar recht einfach. Im Endeffekt brauchen wir dafür nur eine Webseite, welche den js-dos-Code (CSS-Stylesheet und JavaScript-Bibliothek) einbindet…
…sowie ein sog. „js-bundle“, welches die Spieldaten (EXE-Datei) sowie eine DOSBox-Konfigurationsdatei (dosbox.conf) enthält. Optional können auch Einstellungen außerhalb der DOSBox-Settings über eine JSON-Datei mit in das Bundle gepackt werden.
Fun Fact: Mit dem „Game Studio“ gibt es sogar einen Onlinedienst, mit welchem sich diese Bundles automatisch erzeugen und mit einer grafischen Oberfläche konfigurieren lassen. Praktisch! 🙂
Testen lässt sich die js-dos-Webseite dann auf einem Webserver. Entweder direkt produktiv auf einer Homepage, oder alternativ mit einem lokalen Webserver, wie z.B. „TinyWeb“. Auf der Webseite selbst kann man noch Emulationseinstellungen, wie z.B. die Mausgeschwindigkeit, die Lautstärke, die Auflösung oder auch das verwendete Framework (DOSBox oder DOSBox-X) verändern.
Klingt doch super und scheint auch gut zu funktionieren. Also genau das, was wir suchen?
Vermutlich ist js-dos für einen Großteil der Anwendungsfälle prima, doch leider bin ich beim Testen über ein paar Dinge gestolpert, die gegen eine Nutzung sprechen. Einerseits gibt es Probleme mit internationalen Codepages. So lässt sich z.B. die deutsche Tastenbelegung weder über das Web-Frontend, noch über die DOSBox-Konfigurationsdatei setzen. Konkret heißt das, dass wir keine, in der deutschen Sprache recht gängigen, Umlaute eingeben können. So ein Mist! 🙁
Not so fun Fact: Ich bin mir nicht sicher, ob es sich dabei um einen Bug der Emulationssoftware oder von js-dos selbst handelt. Fakt ist – in einer „normalen“ Offline-DOSBox lässt sich das deutsche Tastaturlayout korrekt setzen, bei der Onlinevariante via js-dos leider nicht.
Ebenso gibt es in dem Spiel ja die Funktion, den Spielstand in eine Datei (SAVE.BIN) zu sichern und wieder zu laden. Lokal auf einem PC klappt das gut, aber wie soll das in einem Browser funktionieren? Vermutlich müsste der Spielstand entweder in einem Cookie gespeichert werden, oder alternativ als Datei aus der DOSBox exportiert, heruntergeladen und irgendwie auch wieder in den Emulator importiert werden. Klingt ganz schön kompliziert! 🙁
Ich sehe schon, wir müssen nach einer anderen Lösung Ausschau halten. Vielleicht wäre es eine Option, ein bereits vorkonfiguriertes PC-System, z.B. virtuelle Maschinen von der Webseite „PCjs“, zu verwenden. Auf einem virtuellen IBM AT mit monochromem Display…
… scheint das Spiel (nach Einbindung einer Disketten-Image-Datei, auf welcher sich die Spieldaten befinden) an und für sich zu laufen:
Doch leider werden auch hier keine Umlaute bei der Eingabe unterstützt. Ebenso lässt dich die Emulation nur sehr schlecht parametrisieren. Wir können also nicht steuern, dass bei jedem Aufruf automatisch das Spiel gestartet wird. Zumindest lassen sich aber über diesen Weg virtuelle Festplattenimages exportieren und herunterladen. Vermutlich könnte man so einen Spielstand sichern und auch wieder laden. Ich könnte mir vorstellen, dass man das alles mit etwas Gebastel hinbekommen könnte, aber wenn ich ehrlich bin gefällt mir die Idee, dass wir auf einen externen Dienst angewiesen sind, nicht wirklich.
Auf der Suche nach einer ähnlichen Variante, die wir selbst hosten könnten, bin ich über „v86“ gestolpert. Dabei handelt es sich um einen x86-Emulator, der per JavaScript im Browser läuft.
Der Quellcode dafür ist Open Source und so können wir uns die entsprechenden Bibliotheken herunterladen und kompilieren:
Fun Fact: Ich nutze für so Bastelprojekte (gerade wenn es um das Kompilieren von irgendwelchen Codeschnipseln geht) gerne virtuelle Linux-Maschinen. So lässt sich ein Projekt prima in einer Art „Container“ zusammenfassen und man macht nichts auf seinem Host-Betriebssystem kaputt! 🙂
So die Theorie, denn in der Praxis folgten an dieser Stelle mal wieder einige Stunden, die ich damit verbracht habe, irgendwelche korrekten Versionen von Rust, Node.js, Clang und WebAssembly-Bibliotheken herunterzuladen und zu installieren. Dabei gab es natürlich etliche Fehler und Probleme zu lösen, aber die kann ich euch jetzt gar nicht alle zeigen, bzw. erklären. Wisst ihr, was mich ärgert? Eigentlich würde ich diese Schritte gerne im Rahmen des Beitrags transparent auflisten, aber das ist leider unmöglich. Es gibt einfach zu viele Abhängigkeiten und mögliche Fehlerquellen! 🙁
Not so fun Fact: So wusste ich z.B. nicht, dass sich Dateien auf einem mit dem Gastbetriebssystem geteilten Verzeichnis nicht direkt von der Linux-VM aus modifizieren lassen, weil irgendwelche Sharing-Prozesse die Files blockieren. Ein richtig fieser Fehler. Wenn man das nicht weiß, sucht man unter Umständen eine Ewigkeit an einer völlig falschen Stelle.
Aber egal – irgendwann war der Befehl „make all“ dann auch erfolgreich und wir haben uns selbst einen v86-Emulator für den Browser kompiliert:
Der Emulator besteht letztendlich aus den beiden Dateien “libv86.js” sowie “v86.wasm”. Zum Betrieb werden zusätzlich die BIOS-Dateien “seabios.bin” und “vgabios.bin” benötigt.
v86 kann in jedem beliebigen HTML-Dokument geladen werden. So können wir z.B. eine Seite namens „dorf.html“ erstellen und dort den Emulator einbinden:
Jetzt müssen wir der v86-Software eigentlich nur noch sagen, was sie abspielen soll. Da DORFLEBEN letztendlich auf so ziemlich jedem textbasierten Betriebssystem laufen soll, habe ich mich für die „Floppy Edition“ von FreeDOS entschieden. In einem nur 720 Kilobyte kleinen Image (freedos.img) sind dabei alle für den Start eines DOS-Systems benötigten Dateien vorhanden.
Um noch etwas Platz zu sparen, können wir alle nicht benötigten DOS-Programme aus dem Image entfernen und stattdessen die Spieldateien (also eigentlich nur das File DORF.EXE) inkludieren:
In der AUTOEXEC.BAT befinden sich Startanweisungen, welche der Emulator nach dem Hochfahren des Systems ausführen soll. So wird z.B. neben dem eigentlich Spielstart auch das deutsche Tastaturlayout geladen. Dadurch lassen sich dann auch Umlaute eingeben.
Schon zaubert uns der v86-Emulator unser Spiel auf eine Webseite. Ich weiß – für die meisten von euch ist es nur eine schwarze Box mit etwas Text, aber ich bin restlos begeistert, dass hier tatsächlich ein DOS-Programm (dank etwas JavaScript) auf einer HTML-Seite in einem Browser läuft!
Doch das war noch nicht alles, v86 bietet nämlich auch die Möglichkeit, den aktuellen Status des Programms zu sichern und diesen – wenn gewünscht – als Binärdatei herunterzuladen. Über diesen Weg können wir somit tatsächlich eine Art Online-Speicherfunktion für das Spiel einbauen:
Wie funktioniert das? Per Knopfdruck können wir das Spiel speichern (Save state) und anschließend wieder laden (der Button ändert sich dann in „Restore state“). Alternativ lässt sich der virtuelle Snapshot auch herunterladen und per Dateiupload wieder in den Emulator einbinden. So muss man das Spiel nicht in einer Online-Session durchspielen, sondern kann mal Pause machen, wenn man nicht weiterkommt. Dank dieser Funktion könnte man den Spielstand sogar auf einem anderen Gerät mitnehmen und von dort aus in einem Browser weiterspielen. Ist das nicht cool? 🙂
Als letzten Schritt müssen wir die ganzen Dateien nur noch per FTP von dem lokalen Webserver auf die Online-Webseite schieben. Per iframe auf dem retrololo-Blog eingebunden sieht das dann so aus:
Mega abgefahren, aber ich bin froh, dass es funktioniert. Wer also keinen geeigneten Rechner besitzt oder keine Lust hat, irgendwas herunterzuladen, kann auf die Online-Version des Spiels zurückgreifen. Somit gibt es eigentlich keine Ausrede mehr, warum ihr DORFLEBEN nicht spielt. 😛
In diesem Sinne – bis die Tage, ciao!