Set Controls not working for one object instance but works for other

Question

I'm trying to create a Multi-player game using JS.

    function EvilBall(player,color)
{
    EvilCircle.call(this,this.size,this.velY,this.velX);
    this.color=color;
    this.score =0;
    this.player=player;

} 

EvilBall.prototype=Object.create(EvilCircle.prototype);
EvilBall.prototype.constructor =EvilBall;

   EvilBall.prototype.setControls=function(left,right,down,up){
        var _this = this;
        window.onkeydown = function(e) {
            console.log(e.keyCode);
            if (e.keyCode === left) {
                _this.x -= _this.velX;
            } else if (e.keyCode === right) {
                _this.x += _this.velX;
            } else if (e.keyCode === down) {
                _this.y -= _this.velY;
            } else if (e.keyCode === up) {
                _this.y += _this.velY;
            }
        }
    }

after this I'm creating two instances of EvilBall and setting there controls using setControls function which has event handler function inside.

var evilBall = new EvilBall('p1','white');
var evilBall2 = new EvilBall('p2','yellow');
evilBall2.setControls(65,68,87,83);
evilBall.setControls(37,39,38,40);

Only evilBall instance with key 37,39,38 and 40 is working when keys are pressed. I have figured that since evilBall is mentioned below evilBall2, it is working fine. If an event handler is working fine on one instance, why is not working on the other? How can we develop multi-player games in JS when event-handler on only one instance works? Can anyone please explain this to me. Am I missing something here?

EvilCircle.call(this,this.size,this.velY,this.velX); this.size etc is undefined? — Jonas Wilms, Feb 04 '17 at 18:48
I have defined all the dependent functions. Please see the main.js for the entire code. https://github.com/karanjariwala/Bouncing-Ball-Game.git — Karan Jariwala, Feb 04 '17 at 18:51

Jonas Wilms · Accepted Answer · 2017-02-04T19:14:01.523

1

Window onkeydown is a property:

window.onkeydown = ()=>alert("one");
window.onkeydown = ()=>alert("two");//will override the first
window.onkeydown();

So use window.addEventListner instead:

window.addEventListener("keydown",function(event){
...
});

Overall it might be better to just have one event listener:

var keylisteners=[];
window.onkeydown=function(e){
 (keylisteners.find(el=>el.key==e.keyCode)||{callback:function(){}}).callback();
};

Use like this:

keylisteners.push({
 key:42,
 callback:function(){}
});

By the way, your shape function doesnt take arguments:

Shape.call(this); //will do the job too

edited Feb 04 '17 at 19:14

answered Feb 04 '17 at 18:52

Jonas Wilms

132,000
20
149
151

Both of them are still not working simultaneously and as expected. Demo: https://karanjariwala.github.io/Bouncing-Ball-Game/ Link to the main.js: https://github.com/karanjariwala/Bouncing-Ball-Game/blob/master/main.js – Karan Jariwala Feb 04 '17 at 19:02
"ASDW" Keys and "up, down, left, right" Keys are to control the white and yellow balls. I'm looking for someway to make both the event handlers work simultaneously to create a 2 player game. Example: if I long-press the key "A" yellow ball might move right, but the other ball doesn't move even if "up, down, right or left" key is pressed. Thank-you for your time in advance! – Karan Jariwala Feb 04 '17 at 19:06
@KaranJariwala it is working, i admit not perfectly. see update – Jonas Wilms Feb 04 '17 at 19:14
@KaranJariwala see this answer for how to correctly handle multiple-key events at once http://stackoverflow.com/questions/5203407/javascript-multiple-keys-pressed-at-once – jetpackpony Feb 04 '17 at 19:46
@jetpackpony the OP doesnt want keycombos. However, nice to read ;) – Jonas Wilms Feb 04 '17 at 22:05
@Jonasw yeah, but he wants two players be able to play simultaneously. Which means being able to respond to an arrow and "a" key being pressed simultaneously. Besides, I think this is a much clearer model - just to have all the keys pressed on the current frame and calculate the objects' positions based on that. – jetpackpony Feb 04 '17 at 22:19

Set Controls not working for one object instance but works for other

1 Answers1