Bauwerks- und Geometriegeneratoren für Minecraft

Auf der Suche nach einem Generator, für einfache geometrische Formen in Minecraft, bin ich auf die Webseite plotz.co.uk gestoßen. Dort gibt es Generatoren für Spheren, Elipsioiden, Tori und Bauwerke wie Observatorien, Leuchttürme oder Schneemänner.

Der Generator für den Wizard Tower

Je nach verwendetem Generator können unterschiedliche Parameter wie Größe, Stockwerke und ähnliches eingestellt werden. Anschließend kann man die erzeugten Geometrien nachbauen, indem man sie sich Schicht für Schicht anzeigen lässt. Dies ist vor allem bei Formen wie Kugeln oder elliptischen Körpern sehr angenehm, da die Fehlerquote dank der detaillierten Bauanleitung stark abnimmt. Geschrieben sind die Generatoren mit den Mitteln von HTML5 und JavaScript.

Schach im Browser genießen

Vor knapp zwei Jahren stelle ich eine freie Implementierung des Schachspiels für den Browser vor. Neben dieser 2D-Variante existieren auch wunderschöne 3D-Varianten. Eine Implementation dieser Varianten hört auf den Namen Chess3D. Die Darstellung der 3D-Szene erfolgt dort per WebGL. Neben einigen hilfreichen Funktionen wie einer Undo-Funktionalität können Spiele im PGN-Format gespeichert und wieder geladen werden.

Chess3D im Browser

Mit Chess3D können Schachspiele gegen den Computer bestritten werden. Für den Gegner wird auf Garbochess-JS von Gary Linscott zurückgegriffen. Der Quelltext von Chess3D ist auf GitHub zu finden. Er ist unter der GPL3 lizenziert und damit freie Software.

Markdown-Editor für Integration in eigene Webprojekte

Für ein kleines Webprojekt war ich auf der Suche nach einem Markdown-Editor. Fündig geworden bin ich bei SimpleMDE. Technisch gesehen setzt SimpleMDE auf dem bestehenden Editor CodeMirror auf und erweitert diesen um Markdown-Funktionalitäten, Geschrieben ist der Editor in JavaScript und bietet eine Reihe von Features. Dies fängt an bei der Unterstützung der gewöhnlichen Formatierungen (z.B. Fett und Kursiv) an und geht weiter über Listen und Bildunterstützung. Daneben beherrscht SimpleMDE Autosaving, so das Änderungen auf Wunsch automatisch gesichert werden.

SimpleMDE in Aktion

Leider scheint die Entwicklung in den letzten Monaten etwas eingeschlafen sein. So sind derzeit 17 Pull Request offen, welche auf ihren Merge warten. Der letzte Commit, im development-Branch des Projektes, ist vom Mai 2017. Der Quelltext der Editors ist auf GitHub zu finden. Lizenziert ist der Quelltext unter der MIT-Lizenz und damit freie Software. Die offizielle Projektseite ist simplemde.com.

Freies HTML5 Soundboard

Für einen Pen & Paper-Abend war ich auf der Suche nach einem freien und technisch simplem Soundboard. Idealerweise sollte dieses auf HTML5-Techniken basieren. Ein Soundboard welches diese Kriterien erfüllte, wollte sich allerdings nichts finden lassen, sodass ich selber tätig wurde. Herausgekommen ist ein simples und einfach zu konfigurierendes Soundboard.

Das Soundboard in Aktion

Zur Nutzung des Soundboard müssen die Soundclips in den assets-Ordner kopiert werden und dazu eine passende boards.json-Datei geschrieben werden. Ein Beispiel dieser Datei befindet sich im Repository. Anschließend kann das Soundboard im Browser genutzt werden. Soundclips können einzeln oder in einer Schleife abgespielt werden. Für jeden Clip lässt sich daneben die Lautstärke einzeln regeln. Auch das Abspielen von mehreren Clips parallel ist kein Problem. Zu finden ist das Soundboard auf GitHub. Lizenziert ist es unter der AGPL in der Version 3 und somit freie Software.

Unterschiedliche Views in einer Single Page Application

Für ein kleineres Projekt habe ich vor einiger Zeit eine HTML5-Single-Page-Application entwickelt und stand dann vor dem Problem wie ich unterschiedliche Views innerhalb dieser Seite realisiere. Da ich möglichst ohne schwerfälliges Framework auskommen wollte, habe ich mich für eine Lösung mittels jQuery entschieden. Im HTML habe ich dazu mehrere Views definiert:

<div id="options" class="widget" style="display: none">
</div>

<div id="game" class="widget">
</div>

Der Inhalt des div-Elements mit der Id options ist dabei standardmäßig ausgeblendet. Nun kann die Ansicht der beiden Views mittels der Funktion switchView gewechselt werden:

switchView() {
	  
    if(this.activeView==this.Views.Game) {
        $("#game").css({"display": "none"});
        $("#options").css({"display": "block"});
        this.activeView = this.Views.Options;
    }
    else if (this.activeView==this.Views.Options) {
        $("#options").css({"display": "none"});
        $("#game").css({"display": "block"});
        this.activeView = this.Views.Game;
    }
}

In der Funktion wird das CSS der jeweiligen div-Elemente manipuliert. Dadurch wird die Sichtbarkeit der Blöcke gewechselt und man hat eine einfache View Umschaltung realisiert.