How to disable a character movements MelonJS temporarily?

Question

I am developing a game with Melon.Js, and down the canvas where it is loaded, I create a chat window. The problem is that when I type in the , if I press AWDS keys the character moves. Does anyone know how to temporarily disable (as long as the chat window on focus) character movement?

"game.html"

<div ng-controller="ChatController">
<div class="div-chat">
    <span ng-repeat="msj in chats | orderBy: 'createdAt'"> <b ng-class=""> {{msj.nick}} : </b> {{msj.mensaje}} <br></span>
</div>
<input class="form-control" type="text" ng-model="mensaje"  id="msjChat">
<button type="submit" class="btn btn-default" id="btn_enviar" ng-click="envMsj()">Enviar</button>

"player.js"

me.input.preventDefault;
me.input.bindKey(me.input.KEY.LEFT, 'left', false,false);
me.input.bindKey(me.input.KEY.A, 'left', false,false);
me.input.bindKey(me.input.KEY.RIGHT, 'right', false,false);
me.input.bindKey(me.input.KEY.D, 'right', false,false);
me.input.bindKey(me.input.KEY.UP, 'up', false,false);
me.input.bindKey(me.input.KEY.W, 'up', false,false);
me.input.bindKey(me.input.KEY.DOWN, 'down', false,false);
me.input.bindKey(me.input.KEY.S, 'down', false,false);

I try to use a "focus" in the input, but I cant disabled the movements in MelonJS canvas

One way would be to [unbind](http://melonjs.github.io/docs/me.input.html#unbindKey) the keys when the chat area gains focus, then [bind](http://melonjs.github.io/docs/me.input.html#bindKey) them again when the game gets focus again — Lbatson, Nov 01 '14 at 01:15

score 3 · Accepted Answer · answered Nov 08 '14 at 14:26

You can use the stopImmediatePropagation methods when the keyUp or keyDown events are called in the input text where you type the message. This will stop the propagation of the event and the keyUp or keyDown event will never arrive to the melonJS listeners.

I so that you are using angular. You can implement a directive that call this method on the element. Here is a sample code.

In your javascript:

app.directive('chat', function () {
  return {
    restrict: 'A',
    link: function (scope, elem, attrs) {
      elem.bind('keydown', function (e) {
          e.stopImmediatePropagation();
          return false;
      });
      elem.bind('keyup', function (e) {
          e.stopImmediatePropagation();
          return true;
      });
    }
  };
});

In the HTML:

<input chat class="form-control" type="text" ng-model="mensaje"  id="msjChat">

How to disable a character movements MelonJS temporarily?

1 Answers1