repcomm / gameinput-ts

procedural input for javascript/typescript

gameinput-ts

Runtime re-mappable procedural input for the web

current-support

• keyboard
• mouse
• touch
• gamepad
• importing JSON input mappings during runtime!

future-support

• UI elements
• WebSocket API

how it works

The main idea:

• Anything can be a button
• Anything can be an axis

Anything being:

• keyboard buttons
• mouse buttons
• mouse axes
• touch
• gamepad buttons
• gamepad axes
• HTML elements

Classes

• Input (raw, hooks into browser APIs, used by GameInput)
• GameInput - main API
• Button - unique names, boolean state
• Axis - unique names, floating point state

Using

Installing

• Via NPM (usage with webpack or snowpack, which are tested)

``` npm install @repcomm/gameinput-ts ``` ```ts import { GameInput } from "@repcomm/gameinput-ts"; ``` - Browser ESM script:
```js <script type="module"> import { GameInput } from "/path/to/gameinput/mod.js"; </script> ```

Example Usage

//so we can use await
async function main () {
  
  //get the singleton
  let input = GameInput.get();
  
  //create an axis
  input.getOrCreateAxis ("forward")
  .addInfluence ({
    //value when triggered by boolean state (such as keys, mouse buttons, gamepad buttons)
    value: 1.0,
    
    //make it influenced by first mouse button
    mouseButtons:[0],
    
    //you can also make it take on the value of the mouse axes
    mouseAxes:[0],
    //scale factor when activated by mouse/touch
    pointerAxisScale: 0.5,
    
    //use gamepad axes!
    gpAxes:[0],
    //scale factor when activated by gamepad axes
    gpAxisScale: 2,
    //force use of specific connected gamepad
    gpIndex: 0
  });
  
  //You can also supply JSON!
  const inputMapFile = "./demo.input.json";
  console.log(`Fetching ${inputMapFile}`);
  let config = await (await fetch( inputMapFile )).json();

  //button and axis definitions will merge with pre-existing buttons and axes
  input.addJsonConfig( config );
  
  //loop
  let fps = 30;
  setInterval (()=>{
    //get the axis value
    let fwd = input.getAxisValue ("forward");
    
    console.log(fwd);
    
  }, 1000/fps);

}

main();

Compiling

To build you'll want to clone the repo
git clone https://github.com/RepComm/gameinput-ts.git

Install dev dependencies

npm install

Build

npm run build

gameinput-ts's Issues

Problem with importing using build tool like Snowpack

Due to this specification in snowpack, importing the library fails due to mod.js exporting typescript types.

I can try and make a PR, but basically what makes it work is ensuring mod.js only exports references to actual JS code, such as GameInput and leave the rest up to the .d.ts files.

Sensitivity config in axis influence

pointerAxisScale, gpAxisScale, uiAxisScale

Configurable dead zones for gamepad interface

Having axis mapped to both keyboard, touch, and gamepad will mean that gamepads can have their dead zones interfere with setting the input value.

Things that can be done to mitigate this:

• get highest value from all the inputs of an axis, return that
• add dead zone configuration per gamepad axis (and possibly touch as well)

Axis should be mappable to any set of inputs

Currently, axes are only mapped to gamepad axes, but mouse wheel, and mobile touch axes (not implemented as of yet), and even keyboard buttons should be able to be mapped to axes.

Something like this for keyboards:

GameInput.get().createAxis ("fwd-bwd")
.addKey("w", 1.0)
.addKey("s", -1.0)
.addGamepadAxis (13);

Causes primary button to be fired when it shouldn't

gameinput-ts/src/input.ts

Line 72 in f21ffe9

this.setPointerButton(evt.button);

Simply commenting this out fixes the issue.

Possible name change

I've used this project is way more apps than games at this point,
I'm thinking of renaming to something like procedural-web-input or something similar.

Unfortunately I'd have to do annoying things to the repo and npm install location,
not thrilled about that.

gpAxesScale replace with gpAxesTransform callback

Next update

A major API change will occur in the next version

In the next version, all glue code will be removed.

Two kinds of inputs:

• button
• axis

Anything can be an axis, anything can be a button.
All mappings will be runtime configurable
Mappings will be able to be saved and loaded from JSON

DOM events can also be hooked to buttons and axis, which will solve the mobile touch button problem.

A package will be created using exponent-ts and gameinput-ts as dependencies, providing
a user input mapping panel which can be mounted anywhere in the DOM at any time, and can have events fired to trigger an input manager instance (or several) changed to match.

getGamepad can return undefined, no checks in getButton or getAxis

Need to add check for when no gamepad is available from perspective of browser API