Web Sensors is a wrapper around a handful of common web APIs. It provides a simple way to add real-world sensors to a web application. This library was developed to make creative web coding easier. It also includes streams for perlin and simplex noise.
npm install web-sensors --save
Currently only tested on Chrome for OSX. PRs welcome!
npm run test
(then open http://localhost:8080 in browser)
import { sight, click, mouse, simplexnoise } from 'web-sensors'
sight().subscribe((light) => {
state.update('retinas', light)
})
click().subscribe((ev) => {
state.update('click', ev)
})
mousemove().map((ev) => {return {x: ev.clientX, y: ev.clientY}})
.subscribe((location) => {
state.update('mouse', location)
})
simplexnoise({shape: [5, 5, 5]}).subscribe((3DnoiseArray) => {
state.update('noise', 3DnoiseArray)
})
observe the passing of time...
Parameters
frameratenumber? optional framerate. defaults to 0, which uses requestAnimationFrame (optional, default0)
Returns Observable stream of the current UTC time in ms
a wrapper to make getting a webcam feed much easier than the standard getUserMedia API
Parameters
$0Object
Returns Observable pixel array stream
a wrapper to make getting a microphone feed much easier than the standard getUserMedia API
Parameters
$0Object
Returns Observable Uint8Array stream
watch the user's current GPS coordinates
Returns Observable {lat, lng} stream
watch for changes in the user's browser window size
Parameters
throttleRatenumber? optional interval to throttle this stream by. (optional, default100)
Returns Observable {width, height}
Parameters
throttleRatenumber? optional interval to throttle this stream by. (optional, default2)
Returns Observable {scroll event}
Returns Observable document mousedown event
Returns Observable mousemove event
a simple version of mousemove that only returns the clientX and clientY location
Returns Observable {x, y} of the mouse position
Returns Observable document mouseup event
Returns Observable document click event
Returns Observable document double click event
Returns Observable document keydown event
Returns Observable document keypress event
Returns Observable document keyup event
Returns Observable document touchstart event
Returns Observable document touchmove event
Returns Observable document touchmove event
Returns Observable document touchend event
generates a stream of random numbers
Parameters
$0Object$0.seednumber? optional seed for the generator. (optional, defaultMath.random())$0.shapearray? the dimensionality of the returned value shape[0] corresponds to the length of the x axis, shape[1] corresponds to the length of the y axis, shape[2] corresponds to the length of the z axis. Shape array can be any length between 1 and 3, so [5, 5], for example, would return a 5x5 array of random values between 0 and 1 (optional, default[1,0,0])$0.frameratenumber? optional framerate. defaults to 0, which uses requestAnimationFrame (optional, default0)
Returns Observable stream of random numbers or an array of random numbers
generates a stream of values using simplex noise
Parameters
$0Object$0.seednumber? optional seed for the generator. (optional, defaultMath.random())$0.shapearray? the dimensionality of the returned value shape[0] corresponds to the length of the x axis, shape[1] corresponds to the length of the y axis, shape[2] corresponds to the length of the z axis. Shape array can be any length between 1 and 3, so [5, 5], for example, would return a 5x5 array of simplex noise values (optional, default[1,0,0])$0.frameratenumber? optional framerate. defaults to 0, which uses requestAnimationFrame (optional, default0)
Returns Observable stream of simplex values
generates a stream of values using perlin noise
Parameters
$0Object$0.seed(optional, defaultnull)$0.shape(optional, default[1, 0, 0])$0.framerate(optional, default0)
$0.$0.seednumber? optional seed for the generator. (optional, defaultMath.random())$0.$0.shapearray? the dimensionality of the returned value shape[0] corresponds to the length of the x axis, shape[1] corresponds to the length of the y axis, shape[2] corresponds to the length of the z axis. Shape array can be any length between 1 and 3, so [5, 5], for example, would return a 5x5 array of perlin noise values (optional, default[1,0,0])$0.$0.frameratenumber? optional framerate. defaults to 0, which uses requestAnimationFrame (optional, default0)
Returns Observable stream of perlin values