Axis3D commands that provide state for user inputs.
$ npm install axis3d-inputs
const KeyboardInput = require('axis3d-inputs/keyboard')
const MouseInput = require('axis3d-inputs/keyboard')
const TouchInput = require('axis3d-inputs/keyboard')
const quat = require('gl-quat')
const vec3 = require('gl-vec3')
const keyboard = new KeyboardInput(ctx)
const mouse = new MouseInput(ctx)
const touch = new TouchInput(ctx)
const rotation = quat.identity([])
const position = [0, 0, 0]
frame(() => {
keyboard(({keys}) => {
if (keys.left) {
vec3.add(position, position, [-1, 0, 0])
} else if (keys.right) {
vec3.add(position, position, [+1, 0, 0])
}
if (keys.up) {
vec3.add(position, position, [0, 0, +1])
} else if (keys.down) {
vec3.add(position, position, [0, 0, -1])
}
})
mouse(({mouse, wheel}) => {
if (mouse.buttons > 0) {
quat.rotateY(rotation, rotation, mouse.deltaX)
quat.rotateX(rotation, rotation, mouse.deltaY)
}
if (wheel.deltaY) {
vec3.add(position, position, [0, 0, 0.5*wheel.deltaY])
}
})
touch(({touches}) => {
if (touches) {
switch (touches.length) {
case 1:
quat.rotateY(rotation, rotation, touches[0].deltaX)
quat.rotateX(rotation, rotation, touches[0].deltaY)
break;
case 2: break;
default:
}
}
})
})
- Keyboard
- Mouse
- Touch
This module exposes constructors for commands compatible with Axis3D. Commands are just functions that accept arguments and a callback. The callback function exposes context variables associated with the command. Context variables can hold information about the current state of the input in use.
The KeyboardInput
command provides keyboard context variables that
expose which keys are currently pressed (or not).
keyboard(({keys, keycodes}) => {
if (keys.h) left()
if (keys.l) right()
if (keys.k) up()
if (keys.j) down()
})
keys
- An object containing a map of key names and a boolean value indicating that the key is currently pressedkeycodes
- An object containing a map of key codes and a boolean value indicating that the key is currently pressed
The MouseInput
command provides mouse context variables that
expose the current mouse state including the wheel and currently pressed
buttons count. The current, delta, and previous [x, y]
coordinates of
the mouse cursor position and wheel are exposed.
mouse(({mouse, wheel}) => {
quat.setAxisAngle(xRotation, [1, 0, 0], 0.5*mouse.deltaY)
quat.setAxisAngle(yRotation, [0, 1, 0], 0.5*mouse.deltaX)
})
fieldOfView += 0.5*wheel.deltaY
mouse
- The current mouse statebuttons
- Number of mouse buttons currently pressedcurrentX
- The currentx
coordinate of the mouse cursorcurrentY
- The currenty
coordinate of the mouse cursordeltaX
- The differnence between the previous and currentx
coordinate of the mouse cursordeltaY
- The differnence between the previous and currenty
coordinate of the mouse cursorprevX
- The previousx
coordinate of the mouse cursorprevY
- The previousy
coordinate of the mouse cursor
The TouchInput
command provides touch context variables that
expose the current touch state including the wheel and currently pressed
buttons count. The current, delta, and previous [x, y]
coordinates of
the touch position and wheel are exposed.
touch(({touches, wheel}) => {
if (1 == touches.length) {
quat.setAxisAngle(xRotation, [1, 0, 0], 0.5*touches[0].deltaY)
quat.setAxisAngle(yRotation, [0, 1, 0], 0.5*touches[0].deltaX)
}
})
touches
- Currently active touches wheretouches[i]
is:currentX
- The currentx
coordinate of the touchcurrentY
- The currenty
coordinate of the touchoffsetX
- The currentx
coordinate offset of the touch positionoffsetY
- The currenty
coordinate offset of the touch positionstartX
- The startx
coordinate offset of the touchstartY
- The starty
coordinate offset of the touchdeltaX
- The differnence between the previous and currentx
coordinate of the touch positiondeltaY
- The differnence between the previous and currenty
coordinate of the touch positionprevX
- The previousx
coordinate of the touchprevY
- The previousy
coordinate of the touch
MIT