Spielbetrieb: Action-Spiel mit Highscore

Sie kennen das: Sie haben im Internet ein Online-Spiel gespielt, haben die höchste aller Punktzahlen erreicht, aber niemand weiß davon. Wie schön wäre jetzt eine Highscore-Liste, die auf dem Server gespeichert wird. Jeder Spieler kann sich dort eintragen und alle können die höchsten Punktestände sehen. Dieser Workshop zeigt Ihnen, wie Sie das mit wenig Aufwand in Flash und PHP realisieren.
(Dieser Artikel erschien in der Zeitschrift Internet Professionell. Hier lesen Sie die ungekürzte und unredigierte Fassung.)

Sie finden alle Dateien zum Download am Ende des Artikels.

Das Spiel

Es wird wieder Frühling und die ersten Blumen sprießen aus dem Boden durch den Schnee. Doch Sie mögen keinen Frühling, Sie wollen, dass es Winter bleibt. Also sagen Sie dem Frühling den Kampf an! Bewaffnet mit Schneebällen werfen Sie auf alle Blumen, die sich durch den Schnee wagen. Aber beeilen Sie sich: Wenn eine Blume ausgewachsen ist, ist sie zu groß und Sie können sie nicht mehr abwerfen.

Das Spiel dauert genau eine Minute. Für jeden Treffer gibt es Punkte und zwar mehr Punkte, je eher Sie eine Blume getroffen haben. Danach können Sie sich in die Highscore-Liste eintragen und mit etwas Glück landen Sie unter den besten fünf Einträgen.
Das fertige Spiel finden Sie in der Datei “fruehling.fla”. Wenn Sie diesen Workshop Schritt für Schritt mitmachen möchten, benötigen Sie die Datei “fruehling_start.fla”. Öffnen Sie die Datei und öffnen Sie die Bibliothek. Die Bühne ist 550 x 400 Pixel groß und der Film spielt mit 20 Frames pro Sekunde. Sie sehen, dass bereits einige Grafiken vorhanden sind und zwar für die Blumen und die Hand.

Die Hand

Erzeugen Sie einen leeren Movieclip (F8) und nennen Sie ihn “Spieler”. In den ersten Frame kommt die Grafik der Hand, die den Schneeball hält. Fügen Sie außerdem noch einen Stop-Befehl ein, damit Flash immer nur diese Hand zeigt und nicht weiter spielt.
In den zweiten Frame kommt die Hand, wie sie den Schneeball wirft. Diese ist für fünf Frames zu sehen, danach springt der Movieclip wieder in den ersten Frame. Schreiben Sie also in den letzten Keyframe (Frame 6):

gotoAndStop (1);

Dazu spielen Sie im zweiten Frame noch den Sound “Wurf.aif” ab, damit der Spieler auch etwas von der Hand hört.

Die Blumen

Erzeugen Sie einen weiteren Movieclip und nenne Sie ihn “Blume”. Das wird die Blume, die der Spieler später abwerfen muss. In diesem Movieclip brauchen Sie insgesamt vier Ebenen: Eine für die wachsende Blume, eine für die getroffene Blume, eine für den Button und eine für die Scripts.
Legen Sie die Grafik der Blume in den ersten Keyframe und erzeugen Sie eine Animation über den ersten 25 Frames. Die Blume soll von ganz klein auf ihre normale Größe wachsen; also im ersten Keyframe klein sein und im letzten Keyframe (Frame 25) normal groß. In den letzten Frame kommt auch ein Stop-Befehl, damit die Blume stehen bleibt, wenn sie ausgewachsen ist.

In die Ebene über der Blume kommt ein Button. Dieser Button ist dafür verantwortlich, dass man die Blumen anklicken (also abwerfen) kann. Zeichnen Sie ein Rechteck ohne Rahmen, etwa so groß wie die Blume, und wandeln Sie dieses Rechteck um in einen Button (F8). Öffnen Sie diesen anschließen und verschieben Sie das Rechteck in den letzten Frame “Aktiv”. So lässt sich der Button anklicken, ist aber selbst durchsichtig.
Zurück zur Blume. Der Button soll wie die Blume von klein nach groß wachsen. Damit das Spiel etwas leichter ist, können Sie den Button am Anfang ein wenig größer als die Blume machen. Achten Sie darauf, dass der Button bereits in Frame 24 endet. Wenn die Blume ausgewachsen ist, soll man sie nicht mehr anklicken können.
Auf den Button kommt folgendes Script:

on (press) 
{
  _root.spieler.gotoAndPlay (2);
  _root.punkte += 25 - this._currentframe;
  gotoAndPlay ("getroffen");
}

Wenn der Button gedrückt wird, springt die Hand an den zweiten Frame, damit die Grafik der Wurfhand gezeigt wird. Die Punkte werden erhöht und zwar um so viel Punkte, wie Frames übrig sind, bis die Blume ausgewachsen wäre. Wenn der Spieler die Blume also sofort abwirft, bekommt er 25 Punkte, wenn die Blume fast ausgewachsen ist, gibt es nur noch einen Punkt. Zuletzt springt der Movieclip an den Frame “getroffen”, dort wird die zermatschte Blume angezeigt.
Legen Sie nach der wachsenden Blume noch einen Keyframe an und geben Sie ihm den Namen “getroffen”. Hier legen Sie die Grafik der zermatschten Blume rein. Lassen Sie diese langsam ausblenden und spielen Sie währenddessen den Sound “Treffer.aif”. Am Ende kommt wieder ein Stop-Befehl, damit die Blume nicht wieder von vorne wächst.

Die Blume legen Sie auf die Hauptzeitleiste der Datei, außerhalb der sichtbaren Bühne. Geben Sie ihr den Instanz-Namen “blume”.

Die Steuerung

Gesteuert wird das Spiel mit der Maus. Damit der Spieler im Eifer des Gefechts immer den Maus-Cursor findet, geben Sie ihm einen zweiten Cursor, der deutlich größer ist. Ziehen Sie die Grafik “Cursor” auf die Hauptebene der Flash-Datei und geben Sie ihr den Instanz-Namen “cursor_”. Ziehen Sie auch den Movieclip “Spieler” auf die Bühne und geben Sie ihm den Instanz-Namen “spieler_”. Schieben Sie diese beiden Movieclips so weit nach oben, dass sie nicht mehr in der Bühne zu sehen sind.
Der Unterstricht im Namen bedeutet, dass dies noch nicht die Movieclips sind, die Sie später ansteuern. Stattdessen werden die Blumen später mit dem Befehl “duplicateMovieClip” erzeugt. Dabei müssen Sie für jede Blume eine höhere Ebene angeben, die Blumen werden also immer über allen anderen Objekten liegen. Damit die Hand und der Cursor aber trotzdem über den Blumen liegen, kopieren Sie diese ebenfalls zu Beginn des Spieles auf eine sehr hohe Ebene. Fügen Sie also im ersten Frame der Hauptzeitleiste folgendes Script ein:

duplicateMovieClip (_root.cursor_, "cursor", 300);
duplicateMovieClip (_root.spieler_, "spieler", 301);
punkte = 0;

Der Cursor wird auf die Ebene 300 kopiert und erhält den Instanz-Namen “cursor”. Die Spielerhand wird auf die Ebene 301 kopiert und erhält den Namen “spieler”. Und wo Sie schon mal im ersten Frame sind (also am Anfang des Spieles), setzen Sie gleich auch die Punkte auf Null, so beginnt jedes Spiel von Neuem bei Null.
Auf den Cursor kommt ein Objekt-Script, welches den Cursor gesteuert, damit er immer der Maus folgt. Hier wird auch die Spielerhand gesteuert, denn sie soll in einiger Entfernung der Maus folgen.

onClipEvent (mouseMove)
{
  this._x = _root._xmouse;
  this._y = _root._ymouse;
  _root.spieler._x = 550 - (550 - _root._xmouse) / 2;
  _root.spieler._y = 400 + _root._ymouse / 4;
  _root.spieler._rotation = _root._xmouse / 20 - 20;
}

Das Script wird immer dann ausgeführt, wenn der Spieler die Maus bewegt. Als erstes wird der Cursor an die aktuelle Position der Maus verschoben. Dann wird die Spielerhand verschoben und zwar um einen Bruchteil des Cursors. Die Hand soll sich langsamer bewegen und auch nur am unteren Bildschirmrand sichtbar sein. Als kleines Extra wird die Hand in Abhängigkeit von der Maus-Position gedreht. So entsteht der Eindruck, als wäre die Hand an einem Punkt fixiert (am Arm des Spielers) und drehe sich darum.

Der Zufall

Damit die Blumen sich vermehren, brauchen Sie schon wieder einen Movieclip. Nennen Sie ihn “Steuerung”. Im ersten Frame steht folgendes Script:

i += 1;
if (i > 290)
{
  i = 1;
}
duplicateMovieClip (_root.blume, "blume" + i, i);
_root["blume" + i]._x = random (550);
_root["blume" + i]._y = random (250) + 100;

Für jede Blume wird die Variable “i” um 1 erhöht. Sie bezeichnet die Ebene, in welche die Blume kopiert wird. In Flash dürfen Sie nur einen Movieclip pro Ebene einfügen, daher der Umweg mit der Variable “i”. Aber Achtung: In Ebene 300 und 301 liegen bereits der Cursor und die Spielerhand. Damit diese nicht aus versehen gelöscht werden, wird “i” auf 1 zurückgesetzt, sobald es größer als 290 ist.
Anschließend wird die Blume kopiert. Der Befehl “duplicateMovieClip” hat drei Parameter: Zuerst geben Sie den Movieclip an, der kopiert werden soll; also in diesem Fall “_root.blume”. Als zweites kommt der neue Name des Movieclips. Hier heißt er “blume” plus die Nummer der Ebene. Zuletzt folgt noch die neue Ebene des Movieclips, ebenfalls bezeichnet durch die Variable “i”.
Die letzten beiden Zeilen verschieben die Blume an eine neue Stelle, welche per Zufall bestimmt wird. Für die horizontale Position (“_x”) ist dies die komplette Breite der Bühne, also eine Zahl zwischen 0 und 550. Für die vertikale Position (“_y”) steht weniger Platz zur Verfügung, weil am oberen Rand der Horizont zu sehen ist. Außerdem ist unten die Spielerhand, welche die Blumen verdecken könnte. Der Wert soll also zwischen 100 und 350 liegen.
In Frame 20 springen Sie mittels “gotoAndPlay” wieder in den ersten Frame. So wird alle 20 Frames eine neue Blume erzeugt. Bei der Geschwindigkeit von 20 Frames pro Sekunde entspricht dies einer neuen Blume pro Sekunde.
Der Movieclip “Steuerung” gehört auf die Hauptzeitleiste des Spiels, damit er immer aktiv ist.

Das komplette Spiel

Das Spiel ist fast fertig. Es soll aber länger als einen einzigen Frame dauern, nämlich genau 60 Sekunden. Dafür bietet sich der Streaming-Modus von Flash an. Wenn Sie einen Sound als Streaming-Sound abspielen, spielt Flash den Film auf jedem Computer in der gleichen Geschwindigkeit ab. So können Sie sicherstellen, dass jeder Spieler die gleichen Chancen hat.
60 Sekunden bei 20 Frames pro Sekunde ergibt 1200 Frames für das Spiel. Fügen Sie daher so viele leere Frames ein, bis der Flash-Film eine Gesamtlänge von 1200 Frames hat. Achten Sie dabei darauf, dass sich alle Objekte über die gesamte Länge erstrecken. Im ersten Frame fügen Sie den Sound “loop.aif” ein. Stellen Sie ihn auf “stream” und wiederholen Sie ihn mindestens 9 mal.
Für die Zeitanzeige zeichnen Sie in der oberen linken Ecke ein Rechteck und lassen Sie es mittels Shape-Tweening im Laufe des Spiels immer kleiner werden. So sieht der Spieler anhand der Größe des Balkens, wie lange das Spiel noch dauert.
Für die Punkteanzeige fügen Sie in der oberen rechten Ecke ein dynamisches Textfeld ein. Es ist einzeilig und hat den Variablen-Namen “punkte”. Hier werden automatisch die erreichten Punkte des Spielers angezeigt. Fügen Sie auf der untersten Ebene auch noch die Hintergrund-Grafik ein.
Im letzten Frame (Nr. 1200) ist das Spiel zu ende. Fügen Sie hier einen Keyframe ein und schreiben Sie folgendes Script:

for (i=1; i<300; i++)
{
  removeMovieClip (_root["blume" + i]);
}
removeMovieClip (_root.cursor);
removeMovieClip (_root.spieler);
gotoAndPlay ("Highscore", "eintragen");

Die ersten 4 Zeilen bilden eine Schleife, welche alle Blumen auf den Ebenen 1 bis 299 löscht. Danach werden auch der Cursor und die Hand gelöscht. Zuletzt springt Flash an den Keyframe “eintragen” in der Szene “Highscore”. Diese beschreibe ich weiter unten.
Starten Sie das Spiel, indem Sie “Apfel + Return” drücken (unter Windows natürlich “STRG + Return”). Für eine Minute erscheinen immer neue Blumen, die Sie mit den Schneebällen abwerfen können. Ihre Punkte sehen Sie in der rechten oberen Ecke. Wenn in der linken Ecke der Balken verschwindet, ist das Spiel aus und es beginnt (noch) von vorne.

Die Highscore

Bis hierher funktioniert das Spiel rein offline, das heißt, es ist ohne Internet-Verbindung spielbar. Damit aber die Punkte in einer zentralen Highscore gespeichert werden, ist auch eine Verbindung zu einem Webserver nötig. Auf dem Server brauchen Sie dann ein wenig PHP, um die Daten zu verarbeiten. Doch der Reihe nach.

Highscore eintragen

Offnen Sie in Flash die Kontrollpalette für die Szenen und benennen Sie die aktuelle Szene um in “Spiel”. Nach dieser Szene erzeugen Sie eine weitere Szene mit dem Namen “Highscore”. Diese wird immer nach dem Spiel aufgerufen.
In den ersten Frame kommt ein großes Textfeld. Es ist dynamisch, der Inhalt des Feldes wird also per Actionscript geschrieben. Es ist auch mehrzeilig und hat den Variablen-Namen “text”.
Schreiben Sie in diesen Keyframe folgendes Script:

text = "Gratulation, Du hast " + punkte + " Punkte! Möchtest Du Dich in der Highscore-Liste verewigen?"
stop ();

Der Trick ist, dass der Punktestand mitten im Text steht. Dazu kommt noch der Stop-Befehl, damit Flash nicht weiter spielt.
Der Spieler wird gefragt, ob er sich in die Liste eintragen möchte. Zum Beantworten dieser Frage geben Sie ihm zwei Buttons: “Ja” und “Nein”. “Ja” springt in den zweiten Frame (mittels “gotoAndStop”) und “Nein” springt zum Frame “zeigen”, in dem die Highscore angezeigt wird. Wenn der Spieler sich also nicht eintragen möchte, wird ihm wenigstens die Highscore angezeigt.
Im zweiten Frame fragen Sie den Spieler nach seinem Namen. Erzeugen Sie dazu ein Eingabe-Textfeld mit dem Variablen-Namen “name”.

Darunter ist ein Button “OK”, mit dem der Name abgeschickt wird. Er hat folgendes Script:

on (press)
{
  _root.fertig = "";
  loadVariables ("highscore.php", "", "post");
  gotoAndPlay (3);
}

Damit Sie wissen, wann der Server den Befehl verarbeitet hat, verwenden Sie eine Steuer-Variable namens “fertig”. Am Anfang wird sie geleert und der Server füllt sie dann mit einem vereinbarten String, sobald er fertig ist.
Dann werden die Daten an den Server geschickt. Der Befehl “loadVariables” schickt alle Variablen eines Flash-Filmes an ein Server-Script. In diesem Fall heißt es “highscore.php”. Das Ergebnis soll in Flash in der gleichen Ebene erscheinen, also lassen Sie den zweiten Parameter leer. Der dritte Parameter bezeichnet die Methode, mit der die Daten übermittelt werden. Verwenden Sie hier immer die Methode “post”.
Mit dem letzten Befehl springt der Film in den nächsten Frame, damit Flash auf das Ergebnis vom Server warten kann. Dazu erzeugen Sie ein paar Frames später einen Keyframe und schreiben Sie folgendes Script:

if (fertig == "ja")
{
  gotoAndPlay ("zeigen");
}
else
{
  gotoAndPlay (_currentframe - 2);
}

Wenn die Variable “fertig” den Inhalt “ja” hat, dann springt Flash zum Frame “zeigen”, um die Highscore anzuzeigen. Im anderen Fall ist der Server noch nicht so weit, Flash springt zwei Frames zurück und probiert es dann noch einmal.
Während dieser Aktion sollten Sie dem User einen Button zum Abbrechen anbieten. Falls es nämlich zu Serverproblemen kommen sollte, oder falls der User gerade gar nicht online ist, kann er immerhin das Spiel spielen, ohne mit einem Server kommunizieren zu müssen.

Highscore anzeigen

Nachdem die Highscore geschrieben ist, wird sie angezeigt. Dazu müssen Sie sie jedoch zuerst vom Server laden. Fügen Sie also einen weiteren Keyframe mit dem Namen “zeigen” am Ende ein und geben Sie ihm dieses Script:

fertig = "";
loadVariables ("highscore_lesen.php", "", "post");

Das Prinzip ist das gleiche wie beim Eintragen, außer dass hier eine andere Datei auf dem Server angesprochen wird. Ebenso müssen Sie auch hier auf den Server warten. Ein paar Frames später kommt deshalb ein Keyframe mit folgendem Script:

if (fertig == "ja")
{
  gotoAndStop ("zeigen2");
}
else
{
  gotoAndPlay (_currentframe - 2);
}

Wenn der Server fertig ist, springt Flash zum Frame “zeigen2”. Wenn nicht, bleibt es in der Schleife.
In den nächsten Keyframe (“zeigen2”) wird die Highscore dann angezeigt. Dazu benötigen Sie zwei dynamische Textfelder: “namen” und “punkte”. Stellen Sie diese nebeneinander, so dass zu jedem Namen auch der dazugehörige Punktestand angezeigt wird.

Die Werte in diesen Textfeldern werden dann vom Server geschrieben (siehe unten).
Dazu kommt noch ein Button, mit dem man zurück zum Hauptmenü gelangt:

on (press)
{
  gotoAndPlay ("Start", 1);
}

Das Hauptmenü

Das Hauptmenü ist lediglich eine weitere Szene, welche vor allen anderen Szenen aufgerufen wird. Diese Szene heißt “Start”. Hier können Sie je nach Belieben eine Intro-Animation abspielen oder nur das Menü anzeigen.

Das Menü besteht aus zwei Buttons: “Spiel starten” und “Highscore”. Der ActionScript-Code für diese Buttons ist einfach. Für “Spiel starten” schreiben Sie folgendes:

on (press)
{
  gotoAndPlay ("Spiel", 1);
}

Und für “Highscore”:

on (press)
{
  gotoAndPlay ("Highscore", "zeigen");
}

Damit ist die Flash-Datei fertig. Wenn Sie sie starten, wird die Szene der Highscore noch nicht funktionieren, weil natürlich kein Server vorhanden ist. Aber Sie können immerhin schon das Spiel spielen.

Die Server-Seite

Damit die Highscore auf dem Server gespeichert wird, ist ein wenig PHP nötig. In diesem Beispiel wird die Highscore in einer Textdatei gespeichert, eine Lösung mit einer Datenbank beschreibe ich weiter unten.
In der Textdatei werden jeweils die besten 5 Namen und die dazugehörigen Punktestände gespeichert. Diese Datei heißt “highscore.txt” und muss im gleichen Verzeichnis liegen, wie das PHP-Script. Fortlaufend werden erst die Namen und dann die Punkte geschrieben und zwar in absteigender Reihenfolge. Jeder Eintrag hat eine eigene Zeile. Die Datei könnte zum Beispiel so aussehen:

Bender
Fry
Leela
Amy
Zoidberg
475
390
380
273
158

Diese Datei wird vom PHP-Script geschrieben. Wenn Sie einen Webserver auf Unix- oder Linux-Basis haben, müssen Sie der Datei ein Schreibrecht vergeben. Die meisten FTP-Programme bieten diese Möglichkeit in den Eigenschaften einer Datei an. Wenn Sie zum Beispiel Transmit einsetzen, kopieren Sie die Datei auf den Server, markieren Sie diese und drücken Sie “Apfel + I”. Im folgenden Fenster können Sie Lese- und Schreibzugriff für alle Benutzer aktivieren. (So ähnlich sollte das auch in anderen FTP-Programmen funktionieren.)
Wenn Sie sich mit Unix auskennen, können Sie die Rechte auch von Hand setzen. Der Befehl dazu heißt “chmod”, Lese- und Schreibzugriff für alle Benutzer entspricht dem Level “666”. Weitere Informationen finden Sie unten.

Highscore schreiben

Wenn sich ein Spieler in die Highscore einträgt, gibt er dazu seinen Namen an. Anschließend schickt Flash den Namen und den Punktestand an den Server. Diese Informationen sollen dann vom Script gespeichert werden.
Öffnen Sie eine leere Datei in einem Texteditor Ihrer Wahl und speichern Sie diese unter dem Namen “highscore.php”. Diese Datei enthält kein HTML, sondern nur PHP. Schreiben Sie also am Anfang und am Ende die Klammern für PHP-Code. Der folgende Code kommt immer zwischen diese Klammern:

<?php

?>

Als erstes müssen Sie die Variablen überprüfen, die Flash an das Script schickt. Sie sollten generell vorsichtig sein mit Variablen, die von außen an ein PHP-Script geschickt werden, denn dies ist immer eine Sicherheitslücke und potentielle Einbruchstelle.

// Variablen pruefen
if (!isset ($name)) { $name = ""; }
if (!isset ($punkte)) { $punkte = ""; }
$name = strip_tags ($name);
$punkte = strip_tags ($punkte);

Wenn die beiden Variablen “name” und “punkte” nicht existieren, werden sie angelegt. So können Sie sicher sein, dass es später keine Fehler durch nicht-existierende Variablen gibt. Danach werden eventuelle HTML-Tags entfernt. Falls jemand versuchen sollte, mittels HTML oder Javascript in Ihr Script einzudringen, wird er hier ausgefiltert.
Als nächstes wird die Highscore gelesen und in zwei Arrays gespeichert.

// Alte Highscore lesen
$datei = file ("highscore.txt");
$alte_namen = array ();
for ($i=0; $i<=4; $i++)
{
  $alte_namen [] = $datei [$i];
}
$alte_punkte = array ();
for ($i=5; $i<=9; $i++)
{
  $alte_punkte [] = $datei [$i];
}

Der Befehl “file” öffnet eine Datei und speichert den Inhalt zeilenweise in einem Array. Für jede Zeile gibt es also einen Eintrag des Arrays. Achten Sie bitte darauf, dass PHP bei Arrays immer mit 0 beginnt. Die erste Zeile im Array hat also die Nummer 0.
Anschließend wird die Variable “alte_namen” als leerer Array angelegt. Mit der Schleife werden die ersten 5 Zeilen der Datei in die Variable “alte_namen” kopiert, das sind alle Namen der Datei. Das gleiche geschieht danach mit den Punkten und der Variable “alte_punkte”.
Nun werden die Punkte verglichen. Eine Schleife durchläuft die Punkte von oben nach unten und vergleich jeweils mit dem neuen Punktestand. Wenn der neue Punktestand größer ist, wird er an dieser Stelle eingefügt und die Schleife wird beendet, damit der Punktestand nicht ein zweites Mal eingefügt wird.

// Punkte vergleichen
for ($i=0; $i<=4; $i++)
{
  if ($punkte > (int) $alte_punkte [$i])
  {
    // Alte Punkte verschieben
    for ($j=4; $j>$i; $j--)
    {
      $alte_punkte [$j] = $alte_punkte [$j-1];
      $alte_namen [$j] = $alte_namen [$j-1];      
    }
    
    // Neue Punkte einfuegen
    $alte_punkte [$i] = $punkte . "n";
    $alte_namen [$i] = $name . "n";
    
    // Schleife abbrechen
    break;
  }
}

In der dritten Zeile werden die Punkte verglichen. Die Variable “punkte” ist ein Integer, also eine ganze Zahl. Die Variable “alte_punkte” ist jedoch ein String. Normalerweise konvertiert PHP diese Typen automatisch. Da aber am Ende des Strings noch ein Zeilenumbruch steht, kann es zu Fehlern beim Vergleich kommen. Es kann passieren, dass niedrigere Punkte oben eingefügt werden. Um dies zu verhindern, müssen Sie PHP mit dem Argument “(int)” explizit anweisen, die Variable “alte_punkte” als Integer zu interpretieren.
Der Trick steht dann im Abschnitt “Alte Punkte verschieben”. Mit einer Hilfs-Schleife werden alle Einträge, die unter dem aktuellen liegen, nach unten kopiert. Der unterste Eintrag wird dabei überschrieben und fällt raus. Anschließen werden die neuen Punkte eingefügt. Dabei müssen Sie am Ende noch jeweils einen Zeilenumbruch einfügen (“n”), damit später wieder jeder Eintrag in einer Zeile steht.
Anschließend wird die Datei “highscore.txt” neu geschrieben:

// Highscore schreiben
$datei = fopen ("highscore.txt", "w");
for ($i=0; $i<=4; $i++)
{
  fputs ($datei, $alte_namen [$i]);
}
for ($i=0; $i<=4; $i++)
{
  fputs ($datei, $alte_punkte [$i]);
}
fclose ($datei);

Erst wird die Datei geöffnet und der Variabeln “datei” zugewiesen. Das kleine “w” bedeutet, dass die Datei überschrieben wird. Mit zwei Schleifen werden dann alle Namen und Punkte in die Datei geschrieben. “fclose” schließt die Datei wieder.
Ist alles fertig, melden Sie das an Flash, damit die Highscore angezeigt wird:

// Operation gelungen
echo ("fertig=ja");

Highscore lesen

Zum lesen der Highscore benötigen Sie ein neues Script namens “highscore_lesen.php”. Das Lesen geht etwas einfacher. Öffnen Sie die Textdatei wieder mit dem Befehl “file” und speichern Sie den Inhalt in der Variable “datei”.

// Highscore lesen
$datei = file ("highscore.txt");

Mit zwei Schleifen schreiben Sie die Namen und die Punkte zu jeweils einer Variablen zusammen.

$namen = "";
for ($i=0; $i<=4; $i++)
{
  $namen .= $datei [$i];
}
$punkte = "";
for ($i=5; $i<=9; $i++)
{
  $punkte .= $datei [$i];
}

Und anschließend geben Sie diese aus.

// Variablen ausgeben
echo ("namen=" . urlencode ($namen) . "&");
echo ("punkte=" . urlencode ($punkte) . "&");

Nachdem in den Variablen Zeilenumbrüche und Leerzeichen vorhanden sind, müssen Sie diese mit “URLEncode” in das URL-Format umwandeln. So werden Leerzeichen und Sonderzeichen sicher durch das Web transportiert. Flash konvertiert die Variablen automatisch wieder in ein lesbares Format.
Ist alles fertig, melden Sie dies auch hier wieder an das Spiel.

// Operation gelungen
echo ("fertig=ja");

Das Spiel installieren

Die Dateien vom Spiel (HTML und SWF), die beiden PHP-Scripts sowie die Datei “highscore.txt” kopieren Sie zusammen in ein Verzeichnis auf dem Server. Denken Sie bei der Textdatei unbedingt an die Zugriffsrechte.
Das Spiel starten Sie, indem Sie die HTML-Datei vom Server aufrufen. Spielen Sie eine Runde und tragen Sie sich in die Highscore ein. Wenn Sie die Datei anschließend mit dem FTP-Programm anschauen, sollten Ihr Name und Ihre Punkte erscheinen.
Sie sehen, es ist nicht schwer, eine Highscore zu implementieren. Und Ihre Spieler werden diese dankend annehmen, kann man sich doch nun noch leichter mit anderen messen.

highscore.php

<?php

  // Variablen pruefen
  if (!isset ($name)) { $name = ""; }
  if (!isset ($punkte)) { $punkte = ""; }
  $name = strip_tags ($name);
  $punkte = strip_tags ($punkte);
  
  // Alte Highscore lesen
  $datei = file ("highscore.txt");
  $alte_namen = array ();
  for ($i=0; $i<=4; $i++)
  {
    $alte_namen [] = $datei [$i];
  }
  $alte_punkte = array ();
  for ($i=5; $i<=9; $i++)
  {
    $alte_punkte [] = $datei [$i];
  }
  
  // Punkte vergleichen
  for ($i=0; $i<=4; $i++)
  {
    if ($punkte > (int) $alte_punkte [$i])
    {
      // Alte Punkte verschieben
      for ($j=4; $j>$i; $j--)
      {
        $alte_punkte [$j] = $alte_punkte [$j-1];
        $alte_namen [$j] = $alte_namen [$j-1];        
      }
      
      // Neue Punkte einfuegen
      $alte_punkte [$i] = $punkte . "n";
      $alte_namen [$i] = $name . "n";
      
      // Schleife abbrechen
      break;
    }
  }
  
  // Highscore schreiben
  $datei = fopen ("highscore.txt", "w");
  for ($i=0; $i<=4; $i++)
  {
    fputs ($datei, $alte_namen [$i]);
  }
  for ($i=0; $i<=4; $i++)
  {
    fputs ($datei, $alte_punkte [$i]);
  }
  fclose ($datei);
  
  // Operation gelungen
  echo ("fertig=ja");

?>

highscore_lesen.php

<?php

  // Highscore lesen
  $datei = file ("highscore.txt");
  $namen = "";
  for ($i=0; $i<=4; $i++)
  {
    $namen .= $datei [$i];
  }
  $punkte = "";
  for ($i=5; $i<=9; $i++)
  {
    $punkte .= $datei [$i];
  }
  
  // Variablen ausgeben
  echo ("namen=" . urlencode ($namen) . "&");
  echo ("punkte=" . urlencode ($punkte) . "&");

  // Operation gelungen
  echo ("fertig=ja");

?>

Zugriffsrechte unter Unix

Unter Unix gehört eine Datei immer einen User. Eine Ebene tiefer gibt es die Gruppe, zu der der User gehört. Und die niedrigste Ebene sind alle User eines Rechners.
Für jede Datei können Sie angeben, welche dieser drei Klassen von Benutzern die Datei bearbeiten darf. Und zwar geben Sie an, ob man die Datei lesen darf, schreiben oder sogar ausführen. Für unser Beispiel muss das Schreibrecht für alle User aktiviert sein. Beachten Sie bitte, dass dies ein Sicherheits-Risiko darstellen kann. Sie sollten derartige Rechte also nur vergeben, wenn es unbedingt erforderlich ist.
Die Rechte werden in einer dreistelligen Zahl gespeichert. Die erste Stelle bezeichnet den Eigentümer der Datei, die zweite die Gruppe und die dritte alle User. Jede Stelle ist eine Summe von drei Zahlen: Lesen = 4, Schreiben = 2, Ausführen = 1. Wenn eine Datei also Schreib- und Leserecht hat, zählen Sie 4 und 2 zusammen und erhalten den Code 6. Eine Datei, die Schreib- und Leserecht für alle drei Klassen hat, hat also den Level “666”.
Keine Sorge, diese Art der Rechteverwaltung ist ganz einfach, wenn Ihr FTP-Programm Zugriffsrechte unterstützt. Dort können Sie i.d.R. die Rechte mit einem Mausklick setzen.

Highscore mit Datenbank

Wenn Sie über eine Datenbank verfügen, können Sie die Highscore noch einfacher verwalten. Legen Sie dazu eine Tabelle mit zwei Feldern an: “Name” und “Punkte”. Wenn ein neuer Eintrag dazu kommt, schreiben Sie diesen in die Tabelle.
Das Sortieren geschieht automatisch beim Lesen und zwar mit SQL. Schreiben Sie dazu folgenden SQL-Befehl:

select * from Highscore order by Punkte limit 5;

Sie wählen also alle Felder aus der Tabelle “Highscore”, sortieren diese nach den Punkten und lassen Sich davon die obersten 5 Felder ausgeben.
Mit einer Datenbank können Sie auch jedem User ein Passwort vergeben. Wenn sich ein Spieler einmal anmeldet, wählt er einen Spielernamen und ein Passwort, welche er dann beim Eintragen in die Highscore angeben muß. So können Sie verhindern, dass sich zwei Spieler unter dem gleichen Namen eintragen. Für die Spielernamen müssen Sie mit einer Hilfstabelle arbeiten.

Download

Hier die Dateien zum Artikel: snowball.sit oder snowball.zip (2,6 MB)