Alice und die Teeparty: Mit Twine und Harlowe ins Wunderland (Teil 2)
Nach meinem letzten Ausflug mit Twine und Harlowe ins Wunderland, möchte ich die Reise heute fortsetzen und weitere Features des Storyformats erkunden. Dafür habe ich Alice wieder an die Teetafel des verrückten Hutmachers geschickt.
Die Geschichte, die ich dieses Mal erzählen möchte, besteht aus acht Passagen und ich habe sie »Alice und die Teeparty« genannt. Die Startpassage bietet nicht viel Neues und sieht so aus:
Lediglich die erste Zeile bietet eine Überraschung: Die Auszeichungssprache von Harlowe besitzt viel Ähnlichkeit mit dem Markup von Markdown und daher bringen die drei Hashs (###) in Überschrift dritten Grades und werden nach <h3> übersetzt1.
Die zweite Passage heißt »Tisch« und besteht aus diesem Inhalt:
Sie ist eine Übergangspassage nur zur nächsten Passage »Hutmacher« führen soll, in der zum ersten Mal etwas wirklich Neues passiert:
Hier fallen zuerst drei neue Dinge auf: Makros, Variablen und Hooks: Makros sind Anweisungen, die in runden Klammern stehen und deren Name mit einem Doppelpunkt abgeschlossen wird. Das häufigste Makro ist (set: irgendetwas), mit dem unter anderen die Inhalte von Variablen gesetzt werden, zum Beispiel wird mit
die Variable $name mit dem Wert (dem String) "Alice" belegt. Variable erkennt man in Harlowe daran, daß ihnen ein Dollarzeichen ($) vorangestellt wird, wie in meinem Beispiel bei $name.
Hooks sind Textteile, die in irgendeiner Weise speziell behandelt werden sollen. In einfachster Form wird die Anweisung (ein Makro) in runden Klammern vorangestellt und der Text, für den der Hook bestimmt ist, folgt in eckigen Klammern2, zum Beispiel so:
Sollen jedoch – wie in obigem Fall, mehrere Hooks auf einen Textabschnitt wirken, müssen sie geschachtelt werden und man verliert leicht die Übersicht. Daher kann man auch Hooks mithilfe des set:-Makros einer Variablen zuweisen und diese dann schachteln. Nach der entsprechenden Initialisierung wird dann das große, rote und rumpelnde Wort »groß« durch folgende Anweisung in Twine erstellt:
Das sieht doch übersichtlicher aus als:
Diese Anweisung funktioniert natürlich auch und in beiden Fällen müßt Ihr darauf achten, daß die offenen wie auch geschlossenen eckigen Klammern paarweise und an den richtigen Stellen auftreten.
Die geschweiften Klammern in obiger Passage sorgen dafür, daß die mehrzeiligen Makro-Anweisungen als eine einzige Zeile behandelt werden. Würdet Ihr sie nämlich weglassen, hättet Ihr eine große, leere, schwarze Fläche im Kopf Eurer Seite.
Die Anweisung =><= zentriert alle folgenden Textzeilen und die Anweisung <== schreibt alles, was folgt wieder linksbündig (das ist der Default). Mit ==> könnt Ihr Euren Text rechtsbündig setzen und mit <==> erzwingt Ihr einen Blocksatz3.
Nach diesen Erläuterungen sollten Euch die Anweisungen in der nächsten Passage (»Haselmaus«) verständlich sein:
Farben können natürlich nicht nur mit CSS-Namen definiert werden, sondern zum Beispiel auch mit ihren Hex-Werten (hier zum Beispiel #7fff00 für ein leuchtendes Grün).
Die vier letzten Passagen (»Kaninchen«, »Flamingo«, »Raupe« und »Grinsekatze«) bringen nichts Neues und sind hier nur der Vollständigkeit halber aufgeführt. Erst die Passage »Kaninchen«,
dann die Passage »Flamingo«, in der die einzige Verzweigung in dieser Geschichte vorkommt,
<img src="images/flamingo.jpg" alt="Flamingo" />
Alice dachte, daß ihr dies zu dumm sei. Außerdem wusste sie nicht, wieso sie auf
einmal einen Flamingo im Arm hatte. Sie überlegte, ob sie ihren
[[geheimnisvollen, blauen Freund->Raupe]] besuchen oder mit der
[[Grinsekatze->Grinsekatze]] plaudern solle.nämlich der Abstecher zur »Raupe«,
um sich schließlich bei der »Grinsekatze« wieder zusammenzufinden:
Diese kleine Geschichte ist natürlich kein literarisches Meisterwerk, sondern soll nur zeigen, wie man mit wenigen Zeilen seine Twine-Geschichten aufpeppen kann. Ihr habt natürlich ein Recht darauf, dieses Geschichtchen in seiner vollen Schönheit auch auf diesen Seiten durchspielen zu können:
Die Bilder für diese Geschichte habe ich wieder von einer gekünstelten Intelligezia (OpenArt) mit Hilfe von NanoBanana 2 zusammenbasteln lassen.
Ich habe das kleine Tutorial sowohl als HTML-Datei wie auch als Twee-Datei mit allen Assets auf meinem GitHub-Account hochgeladen. Habt Spaß damit!
Außerdem habe ich diese Twine-Seiten auch auf meinen Neocities-Account veröffentlicht, denn sie gehören selbstverständlich auch zu den »Webseiten ohne Sinn und Verstand« und daher sollten sie auch dort zu finden sein.
Was bisher geschah
Meine Twine-Harlowe-Reihe besteht bisher aus diesen fünf Beiträgen:
- Der Wunderland-Debattierclub: Klickbare Imagemaps in Twine
- Zurück ins Wunderland (schon wieder) und dieses Mal mit Harlowe
- Alles auf Anfang: Mit Twine und Harlowe ins Wunderland
- Aus meiner Webwerkstatt: Twine-Stories in die eigenen Seiten einbinden
- Alice und die Teeparty: Mit Twine und Harlowe ins Wunderland (Teil 2)
Fortsetzung folgt …
Fußnoten
Harlowe besitzt auch noch einen eigenen, aus der Historie der Sprache entstandenen Markup-Code, zum Beispiel
//text//für italic (<i>) und''text''für bold (<b>). Und so übersetzt folgerichtig auch*text*nach emphasis (<em>) und**text**nach strong emphasis (<strong>). Aber die Auswirkungen sind in der Regel identisch.↩︎Es gibt in Harlowe aber auch benannte Hooks (named hooks), bei denen Makros und Hooks an getrennten Stellen im Text auftauchen. Doch darüber mehr in einem späteren Tutorial.↩︎
Diese Pfeile sind noch mächtiger, mit ihnen kann man auch die Breite der Ränder festlegen. So erzwingt zum Beispiel ein
===><=daß der linke Rand \(3/4\) der Randbreite einnimmt und der rechte Rand nur \(1/4\).↩︎