[Projekt] EasySnake.org

[Seku]

Hallo liebe Gemeinde,

der Post war eigentlich im Show-room erstellt worden, aber meine Projektbilder wurden auf der Startseite nicht angezeigt, deshalb probiere ich das so nochmal.

ich denke mein letzter Post hier war zu Zeiten vor dem Redesign, welcher ja auch bestimmt schon Jahre zurückliegt.
Zwar habe ich der Spiele-/3D-/Grafikprogrammierung aus Zeitgründen (jaja, das Studium) den Rücken zukehren müssen, dennoch finde ich ab und an Zeit an einem kleinen Hobbyprojekt zu schrauben, welches vielleicht nicht ganz in die Reihe der bisher vorgestellten Spiele passt.

EasySnake (url: www . easysnake . org)
EasySnake ist ein Snake-Spiel, das sich direkt im Browser spielen lässt. Zum Spielprinzip muss ich nicht viel Worte verlieren, denke ich. Einfach ein kleines Spiel für zwischendrin.
Um sich jedoch etwas von der Masse abzuheben, bietet das Spiel neben einer Online-Highscore über einen Leveleditor, mit dem eigene Szenarien erstellt werden können. Diese können dann auch zur Veröffentlichung eingereicht werden und erscheinen nach meiner Bestätigung in der Levelliste links. In naher Zukunft möchte ich weitere Objekte implementieren, die auf der Karte gesetzt werden können. Derzeit gibt es nur Spawn-Points, Obstacles, Apples und Teleporter. Ich denke da an Power-Ups, Scripting-Felder, Türen mit Schaltern, etc., was dank OOP (und ja, JavaScript kann das!) nicht all zu schwer werden dürfte.

Hier eine kleine Spielszene:


Der Leveleditor in Aktion:


Testet das Spiel doch an, wenn ihr Zeit und Lust habt, und berichtet mir was man so verbessern könnte. Ich bin für jede Form von Anregung dankbar.
Leider funktioniert das Spiel im InternetExplorer nicht so wirklich. Daran wird gearbeitet. Aber von den ZFX'lern erwarte ich eigentlich einen anständigen Browser :-)

Liebe Grüße,
Fabian

[Chromanoid]

Ich finde es ein sehr interessantes Projekt. Es sieht ein bisschen "unflüssig" aus, aber das macht ja nicht. Könnte man evt. mit einer pixelgenauen Verrückung der Endstücke beheben. Wenn du noch Spielmodi und Ideen brauchst: Capture The Flag im Mehrspielermodus (an einem Keyboard oder via Netzwerk) nach jedem Einsammeln der Fahne wird man länger (evt. kann man durch die andere Schlange durch ohne Schaden zu nehmen); Unterschiedlich gefärbte Schlangen mit verschiedenen Vorteilen (eine Schlange die beschleunigen kann, eine die über eine Mauer springen kann usw.); Größere Level die evt. sogar über mehrere Bildschirme gehen. Verkettung mehrerer Level zu einem großen wie bei http://worldsbiggestpacman.com/. Felder auf denen Äpfel wachsen.

PS Falls du deine Projektvorstellung schon mal geschrieben hattest und sie verschwunden ist, lag das sicher an dem Absturz, den wir hatten. Siehe http://zfx.info/viewtopic.php?f=9&t=2143&p=28234#p28234

[Seku]

Hallo Chromanoid,

das unflüssige lässt sich ohne weiteres nicht beheben. Das liegt daran, dass das Spielfeld eine HTML-Tabelle ist, deren einzelelne Zellen verschiedene Hintergrundgrafiken bekommen (eine Grafik für einen Schlangenkopf, der nach rechts geht, eine für eine Box, etc.). Um das ruckelfrei zu machen bräuchte es entweder Grafiken, die den Schlangenkopf zeigen, wie er zu 25%, 50%, 75% oder 100% die Zelle betreten hat. Dass diese Lösung schwachsinn ist, liegt auf der Hand: es ist Aufwendig die Bewegungs-"Auflösung" entsprechend umzusetzen. Viel klüger ist es das mit HTML5 eingeführte <canvas>-Element zu nutzen, die mit JS frei bemalt werden kann. Das ist auch der Weg, den ich in dieser Hinsicht beschreiten will.
Was ich dennoch jetzt schon an "Grafikaufwertung" im Vergleich zur erstmals veröffentlichten Version eingebaut habe: Grafiken, wie die Schlange in einen Teleporter geht; das sah so abgehackt aus.

Mehrspielermodus ist in Planung, wobei ich mir über das Konzept nocht nicht im klaren bin. Vermutlich wird es aber in Richtung Tron gehen, dass man versucht, sich gegenseitig auszustechen. Eine Netzwerk-Variante halte ich für derzeit nicht realisierbar. Es gibt zwar eine Ajax-Push-Technologie, aber ich habe festgestellt, dass die nicht wirklich flüssig läuft, was ja für Spiele absolut wichtig ist. Vielversprechender sind da WebSockets, aber - wer hätte es gedacht - die sind erst im HTML5 Standard dabei und werden kaum unterstützt. Deshalb wird eine Multiplayer-Umsetzung eher so ausschauen, dass zwei Leute an einem PC sitzen müssen.

Der nächste Schritt für mich ist, mehrere Level zu verknüpfen, wie du das schon vorgeschlagen hast. Vermutlich wird es jedoch eher so ausschauen, dass man von einem Level ins nächste kommt und nicht wie bei dem Pacman, dass du gepostet hast, sich in einer freien Welt bewegen kann.

Gruß und danke für deinen Kommentar,
Fabian


PS: Ne, der Post war noch da gewesen, den habe ich selber gelöscht. Nur die Bilder waren nicht im Showroom. So im Nachhinein glaube ich aber, dass meine Bilder noch nicht freigegeben waren (ich hatte angenommen, dass das automatisch passiert ;)

Edit: Achja. Fast vergessen: Ich habe Schalter-Türen-Elemente implementiert. Es gibt da zwar noch kein Level für, aber im Editor kann man es sich schonmal anschauen :-)

[Chromanoid]

Hey das mit den Teleportern sieht ja jetzt cool aus. Vielleicht könntest du ja auch einfach Löcher draus machen und eine gewisse Verzögerung beim durchkriechen einbauen, mich würde mal interessieren wie sich das spielt. Evt. sogar mit einem leichten Schatten da wo sich ein Gang befindet. Die Tron-Idee ist bestimmt lustig besonders weil es so schön das Äpfel einsammeln in den Wettbewerb integriert, schließlich ist dabei eine lange Schlange von Vorteil.

Für's Multiplayer könntest du dir sonst mal http://socket.io/ anschauen, das nutzt unter anderem eine Flash-Fallback Lösung. Man muss ja wahrscheinlich nur rundenweise arbeiten und Änderungen der Schlangenrichtung übertragen, das sollte recht performant möglich sein :)...

Achja wenn du genau wissen willst wie der Showroom funktioniert: http://zfx.info/viewtopic.php?f=9&t=1162&p=13777#p13777 :) momentan kann jeder der will den Crawler mit dem dort aufgeführten Link ausführen. Wenn ich sehe, dass jemand ein Bild in einem Projekt-Thema gepostet hat, führe ich meistens den Link aus, weil den viele nicht finden (man muss auf die Überschrift des Showroom klicken ("Showroom (Beta)") um zu dem Thema zu gelangen)

[Tobi]

Your level coult not be uploaded because there was a database problem or invalid level data. :(

[Seku]

Ich hatte leider erst jetzt Zeit, mich des Problems, dass Level nicht hochgeladen werden können, anzunehmen. Aber jetzt sollte alles einwandfrei funktionieren und wenn nicht gibt es nun auch ausführliche Error logs. Das hat man eben davon, wenn man am Anfang mit dem debugging information reporting schludert, um schnelle Ergebnisse zu bekommen, aber das kennt ihr sicherlich :-)

Ansonsten...
- Es gibt nun Türen und Schalter wie im Level "Switch" zu sehen
- Die Seite wurde von der Anordnung umgebaut (Levelliste ist nun unten am Seitenrand statt links, etc.)
- Spiel übersetzt ins Deutsche.
- Einiges an Schickschnack. So wird z.B. beim Highscore speichern der Name als Cookie festgehalten, um beim nächstem Mal direkt eingegeben zu sein.

Leider finde ich nur so selten Zeit, weiterzuarbeiten. Aber ich versuche natürlich dranzubleiben.

Lieber Gruß,
Fabian

[Seku]

So. Habe eben ein großes Update eingespielt.
Größte Veränderung: Das Spiel wird endlich per HTML5-Canvas dargestellt. Damit ist die Abwärtskompatibilität bei den Browsern zwar komplett futsch, aber dafür sind einige nette Dinge möglich. So bewegt sich die Schlange nun ruckelfrei, wie das hier auch schon verlangt wurde. Auch neu dank Canvas sind "Spezialeffekte" (bewusst in Gänsefüßchen, weil man damit vor 15 jahren vllt noch jemand hätte begeistern können) Die kommen auf dem Bild leider nicht halb so gut rüber wie in echt.
Zusätzlich kann man nun die Spielgeschwindigkeit einstellen, einigen Leuten war das Tempo einfach zu schnell.


Ich denke so langsam wird das Projekt echt spielbar.

Und ich geh jetzt schlafen, gute Nacht!
Gruß, Fabian

[Tobi]

Werdet ihr auch auf "interjeroidejos.com/aoiu.html?h=757200" (einer als attackierend gemeldeten Website) weitergeleitet, wenn ihr auf den Link hier im Forum klickt, aber wenn die URL direkt ins Browserfenster eingegeben wird, funktioniert es.

Sowas war mir bisher unbekannt. Aber auch die Verlinkung auf z.B. meiner Homepage klappt nicht und leitet zu der Malware-Website um.

Wie geht sowas?

:shock: :?

[Chromanoid]

Ja, evt. wurde der Server gehackt oder die Domain ist bei einem komischen Anbieter geparkt.

[Tobi]

Ja, evt. wurde der Server gehackt oder die Domain ist bei einem komischen Anbieter geparkt.

Allerdings klappt es ja, wenn man die URL direkt eingibt. Dann wird die richtige "EasySnake"-Seite geöffnet.

[Chromanoid]

Achso, das liegt am www. www funktioniert genauso wie andere Subdomains. Das es mit www geht ist mir aber erst nach Deinem Hinweis aufgefallen.

[Chromanoid]

Achso, das liegt am www. www funktioniert genauso wie andere Subdomains. Das es mit www geht ist mir aber erst nach Deinem Hinweis aufgefallen.

Ich habe die Verlinkung mal entfernt.

[Tobi]

Ja, schon. Aber es ist egal ob die Seite mit www. oder ohne verlinkt ist. Gib mal "easysnake.org" mit und ohne www. in die Adresszeile direkt ein. Beides geht.

http:// www . easysnake.org und http:// easysnake.org als Verlinkung aber nicht.

Sowas war mir bisher neu, die Domain muss doch eigentlich gleich aufgelöst werden!? Sprich es dürfte doch keine Rolle spielen, ob die Seite verlinkt ist oder direkt eingegeben wird!? :? Tut es aber anscheinend doch :o

[Chromanoid]

Das ist ja interessant. Ich entferne gleich mal die Links bei Dir (siehe http://zfx.info/viewtopic.php?f=9&t=307&p=40831#p40831). Das muss mit dem Request-Header zu tun haben. Also ob ein HTTP Referer angegeben ist oder nicht.

Mit Referer:

Code: Alles auswählen

Request URL:http://www.easysnake.org/
Request Method:GET
Status Code:302 Found

Request Headers
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en,en-US;q=0.8,de;q=0.6,de-DE;q=0.4
Connection:keep-alive
Host:www.easysnake.org
Referer:http://zfx.info/posting.php?mode=reply&f=10&t=2148
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.101 Safari/537.36

Response Headers
Connection:Keep-Alive
Content-Length:312
Content-Type:text/html; charset=iso-8859-1
Date:Fri, 08 Nov 2013 16:57:59 GMT
Keep-Alive:timeout=15, max=98
Location:http://interjeroidejos.com/aoiu.html?h=757200
Server:Apache/2.2.16 (Debian)

Ohne Referer

Code: Alles auswählen

Request URL:http://www.easysnake.org/
Request Method:GET
Status Code:200 OK

Request Headers
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en,en-US;q=0.8,de;q=0.6,de-DE;q=0.4
Cache-Control:max-age=0
Connection:keep-alive
Host:www.easysnake.org
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.101 Safari/537.36

Response Headers
Access-Control-Allow-Origin:*
Connection:Keep-Alive
Content-Type:text/html; charset=utf-8
Date:Fri, 08 Nov 2013 16:56:43 GMT
Keep-Alive:timeout=15, max=99
Server:Apache/2.2.16 (Debian)
Transfer-Encoding:chunked

Das ist wahrscheinlich auch ein Grund warum die Seite blockiert wird.

[Tobi]

Danke, das meinte ich ;)
Ja, wollte die Links nur eben testweise einbringen. Hatte Fabian auch schon per Mail angeschrieben, weiß nur nicht, ob er seine @easysnake.org-Mails noch liest.

Kurios, sowas war mir bisher noch nicht bekannt...