motion-sensors-polyfill

A polyfill for the motion sensors based on the W3C Generic Sensor API

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
motion-sensors-polyfill
0.3.15 years ago5 years agoMinified + gzip package size for motion-sensors-polyfill in KB

Readme

W3C Generic Sensor API polyfills
Beware, we're still under active development. Expect rough edges.
This is a polyfill for Generic Sensor-based motions sensors to make migration from the old DeviceOrientationEvent/DeviceMotionEvent to the new APIs a smoother experience.
In particular, this polyfill will allow the users of modern browsers to get a feel of the new API shape before it ships (Chrome 63 has a native implementation).
src/motion-sensors.js implements the following interfaces:
How to use the polyfill
<script type="module">
// Import the objects you need.
import {
  Gyroscope,
  AbsoluteOrientationSensor
} from './src/motion-sensors.js';

// And they're ready for use!
let gyroscope = new Gyroscope({ frequency: 15 });
let orientation = new AbsoluteOrientationSensor({ frequency: 60 });
</script>
How to enable the native implementation in Chrome
There are two ways: Origin Trial and Enable via chrome://flags.

Origin Trial

Generic Sensor APIs are currently available as an Origin Trial in Chrome 63+.
To enable native Generic Sensor API implementation for all Chrome users on your site:
  1. Go to https://bit.ly/OriginTrialsSignup to get a token.
  2. Add the token to your web page as follows (replace ... with your token):
<!-- Origin Trial Token, feature = Generic Sensors, origin = https://example.org, expires ="2018-01-18" -->
<meta http-equiv="origin-trial" data-feature="Generic Sensors" data-expires="2018-01-18" content="...">
  1. Optional: add motion-sensors.js polyfill to cater for non-Chrome users (see How to use the polyfill).

Enable via chrome://flags

The native implementation is behind the following feature flags in Chrome 63+:
Generic Sensor (chrome://flags/#enable-generic-sensor):
  • Accelerometer
  • Gyroscope
  • LinearAccelerationSensor
  • AbsoluteOrientationSensor
  • RelativeOrientationSensor

Generic Sensor Extra Classes (chrome://flags/#enable-generic-sensor-extra-classes):
  • AmbientLightSensor
  • Magnetometer
Test suite
Run web-platform-tests with this polyfill enabled here.
Known issues
  • GravitySensor and LinearAccelerationSensor polyfills do not work on Android with Pixel 2, since DeviceMotionEvent.acceleration returns only null values, see Chromium bug 796518.
  • AbsoluteOrientationSensor on iOS uses non-standard webkitCompassHeading that reports wrong readings if the device is held in its portrait-secondary orientation. Specifically, the webkitCompassHeading flips by 180 degrees when tilted only slightly.
Learn more