• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] [JAVASCRIPT] 2 KeyEvents auf einmal localisieren

Transformator

New member
Hey!

Wie vielleicht schon einige von euch schon bemerkt haben (indem sie andere Posts von mir gelesen haben) programmiere ich gerade ziemlich viele verschiedene JavaScript-Canvas Spiele. Bei diesen Spielen kann der Spieler dann durch Tastendruck (meistens die Pfeiltasten) das Spiel steuern.

Dafür habe ich eine Variable erstellt und diese "keystate" gennant. Immer wenn ein Spieler eine Taste drück wird in diese Variable (Array) ein Element mit dem Keycode auf "true" gesetzt. Der Code dafür war folgendermaßen:

Code:
//setzen der keycodes
keystate = {};
document.addEventListener("keydown", function(evt) {
	keystate[evt.keyCode] = true;
});
//abfragen
//...in einem loop
if(keystate[32]) { // SPACE
  // do something;
}
keystate = {};

Nun Gibt es mehrere Probleme damit.

Nummer 1: wenn man zwei Tasten gleichzeitig drückt steht in meinem Array nur die zuletzt gedrückte Taste.

Nummer 2: wenn man eine Taste nicht einmal kurz drückt sondern gedrückt hält, ist der Keycode keinesfalls immer auf "true" sondern verhält sich folgendermaßen:

Code:
// alle 150 Millisekunden
{32: true}
{32: false}
{32: false}
{32: false}
{32: false}
{32: false}
{32: true}
{32: true}
{32: true}
// ... ab jetzt immer true

Es scheint so, als ob mein Firefox das Tastendrücken "smooth" machen will oder so.

Die Frage ist, wie kann ich das alles fixen? (das 1. Problem ist das wichtigste)
 
Hi,

Transformator schrieb:
Nummer 1: wenn man zwei Tasten gleichzeitig drückt steht in meinem Array nur die zuletzt gedrückte Taste.
Das kann nicht sein, wenn man 3 Tasten Gleichzeit drück dann sind in deinem Array auch 3 Tasten abgelegt. Allerdings sind die Keycodes immer der Größe nach sortiert warum weiß ich auch nicht.


Transformator schrieb:
Nummer 2: wenn man eine Taste nicht einmal kurz drückt sondern gedrückt hält, ist der Keycode keinesfalls immer auf "true" sondern verhält sich folgendermaßen:

Ich kann nirgens feststellen woher das false kommen soll.
Du weist ja immer als value nur true zu:
keystate[evt.keyCode] = true;

Schau mal das an, das verdeutlicht es besser:
Code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">

<head>
    <title>keystate</title>

</head>

<body>
    <p id="ausgabe"></p>

    <script type="text/javascript">
var keystate = {};
document.addEventListener("keydown", function(evt) {
	keystate[evt.keyCode] = true;
         printKeys();
});

document.addEventListener("keyup", function(evt) {
	keystate[evt.keyCode] = false;
         printKeys();
});

function  printKeys (){
    var html = "";
    for (var i in keystate) {
       if (!keystate.hasOwnProperty(i)) continue;
       html +=  i + " " + keystate[i] + "<br>" ;
    }
     document.getElementById("ausgabe").innerHTML=html;
}

    </script>
</body>
</html>
 
Danke!

Allerdings gibt es einen Unterschied in unserem Code, ich habe mir ziemlich den Kopf eingeschlagen, als ich gemerkt habe, das Mein Event nicht dann resetet wird, wenn der Button losgelassen wird, sondern alle 50 Millisekunden (jeden Frame). Das war mal wieder einer dieser Idiotischen Fehler :)
 
Zurück
Oben