Grundlagen
Bilder
- SVG-Bilder im Ordner img. Diese dürfen gerne verändert oder auch durch andere ersetzt werden (auch Rasterformate wie png sind natürlich möglich).
- Rotation der Bilder mit CSS in der Datei
raster.css
mit den Klassen 'rot90' etc. Achtung, die letzte Verschiebung nach der Drehung bezieht sich auf die gedrehten Achsen.- Alternative:
transform rotate(90deg) translate(0%, -100%);
- Bilder werden als Hintergrund der einzelnen Rasterzellen definiert (in
raster.css
) und den Werten 1 bis 5 zugeordnet. - Damit nicht Zahlen verwendet werden müssen, wurde die Variable
imgs
in der Dateisnake.js
definiert.
Richtungen
- Vier Richtungen, trigonometrisch, von 0 bis 3 nummeriert.
- Zusatz in der Methode
setValue
in der Dateiraster.js
, wo zusätzlich eine Klasse für die Rotation gesetzt werden kann.
Variablen für das Spiel, Tastenabfrage
currentDirection
undnewDirection
, für die Richtung der Schlange.- Tastenabfrage in vier Richtungen, Gegenrichtung verbieten