[Workshop] Spieleprogrammierung in Javascript

[Malleus]

Hi Steffen,
ich meine mit dem "Schöner machen" natürlich ein paar schöne Grafiken. Das in Javascript zu machen, wäre dann schon heftig. Wenn SVG populärer wird, könnte man das eventuell damit machen. Wir "beide" machen das aber ganz traditionell ;-)

Zitat von St@eff.en

Genau das war der Punkt, wo ich bei meinen Hüpfern (Chaostheorie) aufgegeben hatte, und warum ich so scharf auf die Methodik Deiner Apfelmännchen war

...ich hab's vernommen, ich mach' demnächst weiter ;-)

Ich glaub, ein grosses Problem für viele ist, das sie JS im IE einsetzen und es einfach nicht funktioniert ohne Fehlermeldung.
Erst wenn man FF mit JS-Konsole nutzt, kommt man in den genuss direkter Fehleranzeige.
Jedoch sind manche Fehlermeldungen derart ominös, das ich auch grosse Fragezeichen auf den Pupillen hatte, z.B. wenn eine Var nicht übergeben wird.

Du wirst es nicht glauben, aber ich entwickle alles mit dem MSIE, weil gerade hier das Debuggen so einfach ist. Läuft ein Javascript in einen Fehler, wird das betreffende Script geladen und exakt an die Stelle gesprungen. Nun kann ich mit dem "DirektFenster" Javascriptbefehler eingeben, Variablen eingeben usw. Auch kann ich über den Javascript Befehl "debugger" die Scriptausführung unterbrechen und dann per Hotkey jede darauffolgende Zeile durchlaufen. Such' mal in "Google" nach "Microsoft Script Debugger". Das ist zwas ein alter (Win2000, NT ), aber er läuft noch ganz gut unter XP. Nur manchmal findet er das File nicht und ich muß den Cache leeren bzw. neustarten und es funktioniert wieder. Auch nicht schlecht ist die Firefox Alternative "Venkman". Der ist auch nicht schlecht, aber trotzdem mag ich meinen MS Debugger ( Auf der Arbeit natürlich Visual Studio, der "bester" ! )
... Vielleicht sollte man hier auch mal einen Workshop machen, aber ich glaub', da sind wir beide auch "alleine"

Javascript ist nicht out, aber eben sehr Fehleruntolerant und schwierig zu debuggen, so das die meisten schnell aufgeben.
Auch der Syntax ist nicht immer leicht zu verstehen, auch hier in unserem Bespiel - wer kann sich schon ein mehrdimensionales Array gut im Geist abbilden ...

Javascript ist eine richtige Programmiersprache, die wie jede andere auch auf Fehler reagiert. Das Problem hier ist nur, daß es eine Interpretersprache ist, d.h. es gibt Fehler zur Laufzeit. Andere wie C++, Borland Delphi usw. "meckern" schon beim Übersetzen. HTML liefert keine Fehlermeldung auch wenn der allerletzte Mist gecodet wurde. "Man" denkt immer nur, man müßte nur irgendein Script in seine Seite kopieren und das war's. "Hab' Ihr ein Script, das das und das macht? ". Javascript "Programmierung" ist kein "Copy&Paste" Verfahren ! Man muß wirklich "programmieren" und auch "CSS" verstehen.
Für mich ist Javascript sogar "schöner" und "genormter" als PHP. Ein Pendant zum W3C gibt's hier:ECMA 262 . Bei PHP find' ich die Namensgebung teilweise sehr seltsam, aber okay, damit muß ich wohl leben und allmählich klappt's ja auch.

So, das war's noch. Bis demnächst, fang' jetzt auch an, das ganze etwas zu verschönern.

tschau

Frank

[steffenk]

okay, Verschönerung in der ersten Phase erledigt - macht ja doch was her

Was hast Du ?

Und was haben die anderen ?



http://dislabs.de/catchup/

[Malleus]

Hi Steffen,
sieht doch schon richtig gut aus. Eins hast Du aber vergessen: Die Startpunkte der Spieler "müßten" doch deutlicher markiert werden. Berechne dazu ,ausgehend von unserem Spieler, die Positionen unserer "Gegner".
...ich muß gestehen, ich hab' noch nichts gemacht, ich komme einfach nicht dazu, ich probier's am Wochenende.

tschau

Frank

[steffenk]

Startpunkt und Spielsteine sowie die Würfel fehlen noch.
Ich denk ich mach erst mal die Würfelmaschine, das bekomme ich noch ohne Hilfestellung hin
Was Steine, setzen, Kollisionsberechnung angeht bräucht ich einen Ansatz - da kannst Du ja mal was aus dem Nähkästchen plaudern

[Malleus]

Also, wie würde ich vorgehen, wenn ich gerade Zeit hätte ? ;-)

Meine Figuren stehen in einem Array mit "n" Elemente. Die Array-Elemente haben alle den Wert "-1", also nicht im Spiel.

Bei einer "6" nehme ich mir das erste Element aus dem Array, das den Wert "-1" hat und setze es auf "0" ( = Startposition. )

Nun "lösche" ich meine Figur aus meinem "Haus" und füge es über "innerHTML" in die entsprechende Table-Zelle ( PATH[0] ).

Nun würfle ich nocheinmal. Da eine meiner Spielfiguren auf dem Startfeld steht( Array durchgehen und nachschauen, ob ein Element den Wert 0 hat ),
wähle ich diese Figur aus und addiere zu diesem Wert die Würfelanzahl. Die nächste Zelle ist somit "PATH[0]+Würfelwert. Jetzt auch wieder die Figur an der alten Position "PATH[0]" löschen und in der neuen
Zelle [PATH[0+ ( 1..6 ) ] plazieren.
Wenn ich eine "6" und eine "4" gewürfelt habe, müßte mein Array jetzt so aussehen: POSITIONS[0]=[4,-1,-1,-1]. "0" bedeutet hier unsere Figur.
Kleine Frage: Was bedeutet "POSITIONS[1]=[-1,10,-1,-1] ?

Kollisionsabfrage:
Ausgehend von POSITIONS[0]=[4,-1,-1,-1]
werde ich eine "6" >>> POSITIONS[0]=[4,0,-1,-1]
dann eine "4" :

Ich gehe bei jedem Wurf durch "mein" Array und überprüfe, ob der neue Wert schon in meinem Array vorhanden ist. In unserem Fall "ja". Also ist das Spielfeld schon belegt und ich kann mit meiner Figur nicht ziehen.
Ich "suche" mir daher eine Figur aus ( Wert!=-1 ) und überprüfe, ob "alterWert+WürfelWert" in meinem Array vorkommt. Wenn alles okay ist, ziehe ich dann mit diesem. Wenn auch dieser belegt ist, nehme ich mir eine andere Figur.

Das Ergebnis müßte dann in unserem Fall POSITIONS[0]=[8,0,-1,-1] lauten.

Ist das Prinzip verstanden?

In der jetzigen Phase bewegen wir also "intelligenzfrei" unsere eigenen Figuren.


Dann viel Spaß Steffen

tschau

Frank

[steffenk]

Hab ich noch nicht ganz verstanden ...

also POSITIONS[1]=[-1,10,-1,-1] müsste dann sein:
Spieler 2 hat 3 Figuren im Anfangshaus und die 2.Figur steht auf dem 10. Feld (PATH[10])

Bedeutet jetzt POSITIONS[0]=[8,0,-1,-1] , das eine Figur auf PATH[8] steht und ein gerade rausgekommen ist ?

Da ja jeder Spieler ein anderes Startfeld hat, muss doch dieser Index dazuaddiert werden, oder ?

vg Steffen

PS - eine Hürde seh ich noch, nach einem Wurf muss man ja selbst entscheiden, welche Figur bewegt wird - wie soll man das machen ? Braucht man hier Drag'n Drop-Funktion ?

[Malleus]

also POSITIONS[1]=[-1,10,-1,-1] müsste dann sein:
Spieler 2 hat 3 Figuren im Anfangshaus und die 2.Figur steht auf dem 10. Feld (PATH[10])

Stimmt! ...Seine erste Figur war schon im Spiel, wurde aber rausgeworfen.

Bedeutet jetzt POSITIONS[0]=[8,0,-1,-1] , das eine Figur auf PATH[8] steht und ein gerade rausgekommen ist ?

Korrekt!

Da ja jeder Spieler ein anderes Startfeld hat, muss doch dieser Index dazuaddiert werden, oder ?

genau das wollte ich hören! *einBonusPunktFürDich*
Um die Zelle nachher zu "bestücken" muß der Differenzwert dazuaddiert werden. Achtung: Wenn's über die eigene "0" geht.

PS - eine Hürde seh ich noch, nach einem Wurf muss man ja selbst entscheiden, welche Figur bewegt wird - wie soll man das machen ? Braucht man hier Drag'n Drop-Funktion ?

..das ist der nächste Schritt: Wir würfeln jetzt erstmal und lassen den Rechner alleine ziehen. ( das wird später unser Gegner !)

So, muß "weiterschaffen"

tschau

Frank

[Malleus]

Hi Steffen,
kleiner Nachtrag bzgl. der Bewegung der eigenen Figuren: Deinen Figuren kannst Du einen onclick-Eventhandler geben. Wenn Du dann eine Figur anklickst, weißt Du genau, welches Element des Array Du gerade bist und kannst dann entsprechend die Figur setzen.



bis demnächst

Frank

[saphir2k]

Hi zusammen,

sagt mal, habt ihr diese schöne Idee mit dem Spielchen wegen desinteresse aufgegeben? Fände ich superschade! Bitte macht weiter.

Ich werde mich auch zukünftig an eurem Vorhaben beteiligen.

Kurze Anmerkung:

ich würde den Array POSITIONS in PLAYERPOSITIONS umbenennen. Das ließt sich irgendwie gleich viel leichter. ;-)

Mir ist bei dir Malleus aufgefallen das du einige Semikolons setzt wo keine benötigt werden. (Siehe ganz unten die Fettmakierten).

function setMapData( mode )
{
switch( mode )
{
case 0:

MAXCOLUMNS = 11;
MAXROWS = 11;
MAXITEMS = 4;
COLORS = new Array( "yellow" , "red" , "blue" , "green" );

path = "4-10|4-9|4-8|4-7|4-6|3-6|2-6|1-6|0-6|0-5|0-4|1-4|2-4|3-4|4-4|4-3|4-2|4-1|4-0|5-0|6-0|6-1|" +
"6-2|6-3|6-4|7-4|8-4|9-4|10-4|10-5|10-6|9-6|8-6|7-6|6-6|6-7|6-8|6-9|6-10|5-10";

targetPath = "5-9|5-8|5-7|5-6|1-5|2-5|3-5|4-5|5-1|5-2|5-3|5-4|9-5|8-5|7-5|6-5".split( "|" );
housePath = "0-9|1-9|0-10|1-10|0-0|1-0|0-1|1-1|9-0|10-0|9-1|10-1|9-9|10-9|9-10|10-10".split( "|" );
break;

case 1:

MAXCOLUMNS = 11;
MAXROWS = 11;
MAXITEMS = 4;
COLORS = new Array( "yellow" , "red" , "blue" );

path = "...";
targetPath = "...";
housePath = "..."

break;

case 2:

MAXCOLUMNS = 11;
MAXROWS = 11;
MAXITEMS = 3;
COLORS = new Array( "yellow" , "red" , "blue", "white"," black" );

path = "...";
targetPath = "...";
housePath = "..."

break;

};
};

Oder haben die doch ihren Grund?

Das soll keine Kiritik oder nörgeln sein, sondern einfach nur Hinweise. Schließlich sollten wir alle voneinander lernen.

Grüße,
Thorsten

[steffenk]

naja, das ganze ist etwas eingeschlafen, da ich ausser Frank wohl der einzige war, der sich beteiligt hat. Und bei mir ist im Moment die Zeit zu knapp.

Ich fands äusserst schade, aber wenn Frank schon die Zeit opfert und sein Wissen zur Verfügung stellt, sollten auch Interessenten da sein, sonst ist es eher frustrierend.

[Malleus]

Hi,
Ihr habt schon recht: Die Motivation ging schon verloren. Ich hatte mir eigentlich gedacht, daß ca. fünf mitmachen. Warten wir's mal ab. Vielleicht ist's auch momentan einfach zu warm.

bis demnächst

Frank

[DSB]

Ich hätte mir gerne alle Seiten des interessanten Threads angesehen, aber ich lande immer auf der letzten Seite. Egal welche Seitennummer ich anklicke.
Liegt das an mir?

[steffenk]

Du kannst im Profil die Anzahl der Posts pro Seite einstellen - diese nun 13 Posts sollten eigentlich auf eine Seite passen

[DSB]

Zitat von St@eff.en

Du kannst im Profil die Anzahl der Posts pro Seite einstellen - diese nun 13 Posts sollten eigentlich auf eine Seite passen

???

Schau Dir den Screenshot an.
Laut Pagination gibt es 3 Seiten. Egal auf welche Nummer ich klicke - ich komme immer auf die im Screenshot abgebildete.
Ist das der Anfang des Threads?

[steffenk]

ich glaub irgendwas stimmt mit dem Thread nicht, denn der erste ist nicht der erste ...

ich meinte diese Einstellung - teste mal damit: