Ich mache eine sehr einfache visuelle neuartige Art von Spiel in JavaScript. Ich bin ein Anfänger, also mache ich das nur zum Spaß und zum Lernen, und aufgrund der schlechten Planung bin ich auf ein kleines Problem gestoßen, wenn Sie zu einer Zweigstelle im Dialog kommen.
Derzeit halte ich das Skript für das Spiel in einer Zeichenfolgenvariablen und teile jede Szene mit einem Tag wie "# ~" in kleinere Arrays auf, sodass das Spieleskript folgendermaßen aussieht:
var script = "Hello World!#~How are you today?"
var gameText = script.split("#~");
//gameText[0]= Hello World!
Dies funktioniert gut für lineare Inhalte, aber wie soll ich mit einem Zweig im Dialogbaum umgehen? Diese Methode scheint sehr kompliziert zu sein, da ich genau wissen müsste, wie lang jeder Pfad ist, und wenn ich dann jemals etwas ändern müsste, würde es Kopfschmerzen bereiten.
Wie kann ich das einfacher machen? Ich versuche, mich an Vanille-JavaScript zu halten, da ich möchte, dass das Spiel mit Web Run Time funktioniert.
quelle
Antworten:
Philipps Antwort zeigt bereits die richtige Richtung. Ich denke nur, dass die Datenstruktur unnötig ausführlich ist. Kürzere Texte wären leichter zu schreiben und zu lesen.
Selbst wenn kürzere Texte den Algorithmus etwas komplexer machen würden, lohnt es sich, dies zu tun, da Sie den Algorithmus nur einmal schreiben, aber die meiste Zeit damit verbringen, die Geschichte zu schreiben und zu pflegen. Optimieren Sie daher, um den Teil zu vereinfachen, für den Sie die meiste Zeit aufwenden.
Einige Erklärungen für dieses Design:
Die ganze Geschichte ist in einem Array geschrieben. Sie müssen keine Zahlen angeben, diese werden automatisch von der Array-Syntax bereitgestellt: Das erste Element hat den Index 0, das nächste den Index 1 usw.
In den meisten Fällen ist es nicht erforderlich, die Nummer des folgenden Schritts zu schreiben. Ich gehe davon aus, dass die meisten Textzeilen keine Zweige sind. Machen wir "Der nächste Schritt ist das folgende Element" zu einer Standardannahme und machen wir uns nur Notizen, wenn dies nicht der Fall ist.
Verwenden Sie für Sprünge Beschriftungen , keine Zahlen. Wenn Sie später einige Zeilen hinzufügen oder entfernen, bleibt die Logik der Geschichte erhalten, und Sie müssen die Zahlen nicht anpassen.
Finden Sie einen vernünftigen Kompromiss zwischen Klarheit und Kürze. Zum Beispiel schlage ich vor, "m" anstelle von "message" zu schreiben, da dies der am häufigsten verwendete Befehl aller Zeiten ist. Wenn Sie ihn also kurz machen, wird der Text besser lesbar. Die verbleibenden Schlüsselwörter müssen jedoch nicht gekürzt werden. (Tun Sie jedoch, was Sie möchten. Wichtig ist, dass es für Sie am besten lesbar ist . Alternativ können Sie sowohl "m" als auch "message" als gültige Schlüsselwörter unterstützen.)
Der Algorithmus für das Spiel sollte ungefähr so aussehen:
Diese Ideen wurden übrigens von Ren'Py inspiriert , was nicht genau das ist, was Sie wollen (nicht JavaScript, nicht Web), aber Ihnen trotzdem einige coole Ideen geben könnte.
quelle
({ label: "like_yes"; m: "I am happy you like my game!"; next: "like_end" },)
ein ',' kein ';' stehen sollte. Und wie heißt das Ding in den geschweiften Klammern genau? Ist das ein Objekt innerhalb des Arrays? Wenn ich weitere Informationen zur Verwendung dieser Informationen wünschen würde, wonach würde ich suchen?{...}
ist ein Objekt. In JavaScript ist object ein assoziatives Schlüsselwert-Array (mit einigen zusätzlichen Funktionen, die in diesem Beispiel nicht verwendet werden), ähnlich dem Array in PHP oder Map in Java. Weitere Informationen finden Sie in den Wikipedia-Artikeln zu JavaScript und ECMAScript sowie in der von dort verlinkten Dokumentation, insbesondere in der offiziellen ECMAScript-Dokumentation.Ich würde Ihnen empfehlen, eine Reihe von Dialogereignissen zu erstellen. Jedes Ereignis ist ein Objekt, das den vom NPC angegebenen Text und eine Reihe möglicher Spielerantworten enthält, die wiederum Objekte mit einem Antworttext und dem Index des Ereignisses sind, das auf diese Antwort folgt.
quelle
Sie sollten einen anderen Ansatz verwenden. JavaScript unterstützt Arrays und Objekte. Warum also nicht eines pro Eintrag verwenden, um die Aufteilung zu sparen und den eigentlichen Text einfacher zu bearbeiten / lesen?
Wenn Sie möchten, können Sie sich einen Prototyp ansehen, den ich in ein paar Stunden für # 1gam hergestellt habe . Die Quelle kann kostenlos unter GPLv3 verwendet werden (ich bin vollkommen in Ordnung, wenn Sie sich nicht an die GPL halten, wenn Sie sie nur als Inspiration verwenden. Aber lassen Sie es mich wissen, sobald Ihr Spiel fertig ist.). Erwarten Sie einfach kein großartiges Schreiben oder ähnliches. ;)
Um eine kurze Erklärung zu geben, wie der Code funktioniert, ignorieren Sie die CSS-Animationssachen und ähnliches:
var data
enthält im Wesentlichen die ganze Geschichte mit allen möglichen Entscheidungen usw.start
, die zweitecwait
usw.[target location:display text]
.navigate()
: Diese Funktion macht die Markup-Links klickend. Es ist etwas länger, weil ich dort auch statischen Text für Sackgassen verarbeite. Der wichtige Teil sind die ersten beiden Anrufe anreplace()
.Anstatt diese Farben zu definieren, können Sie auch Links hinzufügen, die auf andere Orte verweisen (beachten Sie, dass dies nicht von meinem Code behandelt wird; es ist nur eine Idee, dies zu demonstrieren):
'start': ['Waking up', 'You wake...', 'cwait:yell for help', 'cwait: wait a bit', 'clook: look around']
quelle