pixi.js-controller

Set of controls for Pixi.js to facilitate general handling of external events.

Usage no npm install needed!

<script type="module">
  import pixiJsController from 'https://cdn.skypack.dev/pixi.js-controller';
</script>

README

PIXI.JS Controller

Set of controls for Pixi.js to facilitate general handling of external events.

Install

npm install pixi.js pixi.js-controller

or

yarn add pixi.js pixi.js-controller

Basic Example

import * as PIXI from 'pixi.js';
import Controller from 'pixi.js-controller';

const app = new PIXI.Application();
document.body.appendChild(app.view);

app.loader.add('example', 'example.jpg').load((loader, resources) => {
    const example = new PIXI.Sprite(resources.example.texture);

    app.stage.addChild(example);

    app.ticker.add(() => {
      if(Controller.Mouse.isButtonDown(Controller.Mouse.Button.LEFT)) {
        console.log('left')
      }

      if(Controller.Mouse.isButtonDown(Controller.Mouse.Button.RIGHT)) {
        console.log('right')
      }
      
      if (Controller.Keyboard.isKeyDown('ArrowLeft', 'KeyA'))
        example.x -= 1;
      if (Controller.Keyboard.isKeyDown('ArrowRight', 'KeyD'))
        example.x += 1;
      if (Controller.Keyboard.isKeyDown('ArrowUp', 'KeyW'))
        example.y -= 1;
      if (Controller.Keyboard.isKeyDown('ArrowDown', 'KeyS'))
        example.y += 1;

      Controller.update();
    });
});

TODO

  • Pixi.js-mouse and Pixi.js-keyboard Implement
  • Control Event Listeners
  • Internal Observables

Credits

-non- for creation pixi.js-mouse and pixi.js-keyboard