Frage Touch Events

[Gykonik]

Hey,

kennt sich jemand gut mit Javascript Touch Events aus und könnte mir dabei helfen?
Wäre Lieb, wenn sich jemand findet...

vielen Dank schonmal im Vorraus!

 

[LeCub]

Was ist/sind denn deine Frage/n?
Edit: Falls du es noch nicht getan hast, schaue dir mal http://jquerymobile.com/ an, das erleichtert die Arbeit an mobil optimierten Seiten und das Einsetzen von Touch- Events.

 

[Gykonik]

Wie es prinzipiell geht und sowas weiß ich...
Ich hab nur ein Programm, was nicht 100%tig geht...

Ich hab folgenden Code:

onTouchUp: function(ev) {
            touches = (typeof ev.changedTouches != 'undefined') ? ev.changedTouches : [ev];

            for (var i = 0; i < touches.length; i++) {
                ev.preventDefault();
                touch = touches[i];
                touchID = (typeof touch.identifier != 'undefined') ? touch.identifier : (typeof touch.pointerId != 'undefined') ? touch.pointerId : 1;

                for(var i = 0; i < touchKeyArray.length; i++) {
                    extract = touchKeyArray[i].id;
                    if(extract == touchID) {
                        keyUp = touchKeyArray[i].function;
                        switch(keyUp) {
                            case Game.KEY.Q: if (!this.game.leftPaddle.auto)  this.game.leftPaddle.stopMovingUp();    break;
                            case Game.KEY.A: if (!this.game.leftPaddle.auto)  this.game.leftPaddle.stopMovingDown();  break;
                            case Game.KEY.P: if (!this.game.rightPaddle.auto) this.game.rightPaddle.stopMovingUp();   break;
                            case Game.KEY.L: if (!this.game.rightPaddle.auto) this.game.rightPaddle.stopMovingDown(); break;
                        }

                        console.log(touchKeyArray[i].function)
                        if(touchKeyArray.length == 1) {
                            touchKeyArray = [];
                        } else {
                            delete touchKeyArray[i];
                        }
                    }
                }
            }
},

onTouchDown: function(ev) {
            touches = (typeof ev.changedTouches != 'undefined') ? ev.changedTouches : [ev];

            for (var i = 0; i < touches.length; i++) {
                ev.preventDefault();
                touch = touches[i];
                touchID = (typeof touch.identifier != 'undefined') ? touch.identifier : (typeof touch.pointerId != 'undefined') ? touch.pointerId : 1;          

                var wc = document.getElementById("RahmenFuerPong").offsetWidth;
                var hc = document.getElementById("RahmenFuerPong").offsetHeight;
                var touchOffsetY = touch.pageY - document.getElementById("RahmenFuerPong").offsetTop;
                var touchOffsetX = touch.pageX - document.getElementById("RahmenFuerPong").offsetLeft;


                if (!helpthisplaying.playing) {
                    // If-Bedingung die "nichts" mit dem Rest zu tun hat, deswegen ausgeschnitten
                } else {
                    if (this.game.onkeydown) {
                        if (touchOffsetX > wc / 2) {
                            if (touchOffsetY > hc / 2) {
                                if (!this.game.rightPaddle.auto) this.game.rightPaddle.moveDown();
                                touchExpand = 76;
                            } else {
                                if (!this.game.rightPaddle.auto) this.game.rightPaddle.moveUp();
                                touchExpand = 80;
                            }
                        } else {
                            if (touchOffsetY > hc / 2) {
                                if (!this.game.leftPaddle.auto)  this.game.leftPaddle.moveDown();
                                touchExpand = 65;
                            } else {
                                if (!this.game.leftPaddle.auto)  this.game.leftPaddle.moveUp();
                                touchExpand = 81;
                            }                      
                        }
                     
                        for(var i = 0; i < touchKeyArray.length; i++) {
                            extract = touchKeyArray[i].id;
                            if(extract == touchID) {
                                doubled = true;
                            }
                        }
                     
                        if(doubled == false) {
                            touchFinishedExpand = { "function": touchExpand, "id": touchID };
                            touchKeyArray.push(touchFinishedExpand);
                        }
                    }
                }
            }
},

Die beiden Funktionen werden durch entsprechende Events aufgerufen, also touchstart und touchend.
Was das allgemein tut ist, dass dadurch ein Pong-Spiel am Handy spielbar ist unzwar folgendermaßen;
Tippt ein Spieler links unten in die Spiel-Arena geht auch das Ruder dahin, links oben dann ebenso.
Bei zwei Spieler funktioniert dies auch auf der 2. Seite...
So ist der Plan

Einspieler lässt sich auch einigermaßen gut spielen, jedoch bekommt mein Programm einen Fehler, wenn ich mehrere Touches gleichzeitig (oder sogar zur gleichen Zeit) ausführe...
Und eigentlich dachte ich, dass das Programm das kann...


Ich bin ratlos und bräuchte irgendwie Hilfe... :s

 

[LeCub]

Ich glaube, das kannst du mit deinem Programm nicht steuern, sondern das ist davon abhängig, ob das Gerät auf dem du das Spiel spielst, multi-touch fähig ist. Mein Handy beispielsweise, kann nur eine Touch-Interaktion verarbeiten, während mein Tablet Zehn finger auf einmal wahrnehmen kann.

 

[Gykonik]

Nein nein, das was ich da oben als Code gepostet hat geht so eigentlich...
Ich hab mich lange erkundigt und das ist so schon richtig...
Ich hab (glaube ich) nur irgendwo einen dummen Fehler gemacht. Prinzipell geht es so, aber ich hab wahrscheinlich irgendwo einen Fehler.
Btw. mein Handy ist Multi-Touch-Fähig und es geht trzdm nicht...
Ich muss nur den Fehler finden ... :c