Jump to content

  • Log In with Google      Sign In   
  • Create Account


[Javascript] Catching Keyboard Input in GameLoop


Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

  • You cannot reply to this topic
3 replies to this topic

#1 zee_ola05   Members   -  Reputation: 320

Like
0Likes
Like

Posted 28 January 2012 - 10:04 AM

Hello guys. I'm having a problem catching a keyboard input in Javascript. I've tried this before in a different language but I can't make it work in Javascript. I am trying to catch this type of keyboard input (I don't know what it's called)
if(prevKeyState.isDown(Key.X) && !currentKeyState.isDown(Key.X))

Help me find what is wrong with my implementation (Please, I've been frustrated trying to debug this for hours). TIA! Here is my code:

<!DOCTYPE html>
<html>
<head>
  <title>Sample</title>
  <script type="text/javascript" src="jquery-1.6.2.js"></script>
  <script type="text/javascript">
  $(document).ready(function(){

   var Key = {
	_pressed: {},
	A: 97,
	W: 119,
	D: 100,
	S: 115,
  
	isDown: function(keyCode)
	{
	 return this._pressed[keyCode];
	},
  
	onKeyDown: function(event)
	{
	 this._pressed[event.keyCode] = true;
	},
  
	onKeyUp: function(event)
	{
	 this._pressed[event.keyCode] = false;
	}
   };
   window.addEventListener('keyup', function(event) { Key.onKeyUp(event); }, false);
   window.addEventListener('keydown', function(event) { Key.onKeyDown(event); }, false);
  
   var prevKeyboardState;
   var currentKeyboardState = $.extend(true, {}, Key); //deep copy
  
   function loop()
   {
	prevKeyboardState = currentKeyboardState;
	currentKeyboardState = $.extend(true, {}, Key); //deep copy
  
	if(prevKeyboardState.isDown(Key.A) && !currentKeyboardState.isDown(Key.A))
	{
	 alert('true');
	}
   }
  
   setInterval(loop,1000/60);
  });
  </script>
</head>

<body style="margin:0px; padding:0px;">
  <canvas id="canvas" height="600px" width="800px">Your browser does not support HTML5 Canvas.</canvas>
</body>
</html>


Sponsor:

#2 AlysiumX   Members   -  Reputation: 152

Like
0Likes
Like

Posted 29 January 2012 - 12:23 PM

I did a bit of messing around building a game an javascript before.

Here what I used for key implementation.

This code is its own function.
function keyListener(e)
{
   if(!e){
	  //for IE
	  e = window.event;
   }
   //keyCode 37 is left arrow
   if(e.keyCode==37){

   }
   //keyCode 39 is right arrow
   if(e.keyCode==39){
  
   }
   //keyCode 39 is up arrow
   if(e.keyCode==38){
	
   }
   //keyCode 40 is down arrow
   if(e.keyCode==40){
  
   }
}


Call this code from your game loop.

//Key listener.
	   if (window.document.addEventListener) {window.document.addEventListener("keydown", keyListener, false);}
	 else {window.document.attachEvent("onkeydown", keyListener);}
   }


#3 zee_ola05   Members   -  Reputation: 320

Like
0Likes
Like

Posted 30 January 2012 - 07:25 PM

Thanks, AlysiumX. But my concern is more on debugging my code. And I want to get the state of the keyboard every game frame and compare it with the previous keyboard state. Anyone? Thanks! :)

#4 QuackCoder   Members   -  Reputation: 100

Like
0Likes
Like

Posted 04 February 2012 - 11:21 AM

Thanks, AlysiumX. But my concern is more on debugging my code. And I want to get the state of the keyboard every game frame and compare it with the previous keyboard state. Anyone? Thanks! Posted Image

Why not put an array inside? At every interval or on state change just push it in....maybe adding a timestamp would help....imho
Sorry, English isn't my first language




Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.



PARTNERS