Web development has classically been confined to the purview of a limited browser, which proffered document level manipulation and handling user interactions. The W3C has begun to lift this barrier by introducing a series of APIs which allow developers to interact with a device and a variety of peripherals. Two of these specifications, "Proximity Events" and "Ambient Light Events" have entered their Last Call stages as drafts and in the coming months will enter the Candidate Recommendation stage wherein implementations will begin to appear.
The "Proximity Events" and "Ambient Light Events" specifications define a means to receive events from a proximity sensor and light sensor, respectively, through JavaScript and HTML5's event handlers.
As currently defined, the "Proximity Events" specification defines two interfaces the DeviceProximityEvent
, which provides developers with information about the devices distance from an object, and the UserProximityEvent
, which provides the developer with browser and platform-specific notification of a nearby object's detection. The DeviceProximityEvent
exposes three read-only attributes:
-
min
- the minimum sensing distance in centimeters -
max
- the maximum sensing distance in centimeters -
value
- the proximity of a nearby object in centimeters
The object is passed to a special callback, defined in the HTML5 specification as an event handler, which takes an event as its argument.
// Event Handler deviceProximityHandler = function(event) { document.writeln('min = ', event.min, 'max = ', event.max, 'value = ', event.value); // e.g. => min = 0 max = 5 value = 5 document.write('<br>'); } // Assigning the Event Handler to a Listener window.addEventListener('deviceproximity', deviceProximityHandler);
The UserProximityEvent
is a bit less "exciting" and provides access to the boolean attribute near
for object proximity indication:
userProximityHandler = function(event) { document.write('near = ', event.near); // e.g. => near = true/false document.write('<br>'); } window.addEventListener('userproximity', userProximityHandler);
As currently defined, the "Ambient Light Events" specification defines two interfaces as well. The DeviceLightEvent
provides a value
attribute with the ambient light level in lux. The LightLevelEvent
provides information about the ambient light levels in terms three ranges "dim" (below 50 lux), "normal", and "bright" (above 10000 lux) as defined by the User Agent.
deviceLightHandler = function(event) { document.write('value = ', event.value); // e.g. => value = 10/100/1000 document.write('<br>'); } window.addEventListener('devicelight', deviceLightHandler);
Currently, the DeviceProximityEvent
, UserProximityEvent
, and DeviceLightEvent
are available in Firefox Mobile Beta versions 15 and up. Support for ambient light sensors in Firefox Beta for Windows may be arriving soon as well. Remember, that as sample implementations, the features provided are subject to significant change. For example, Mozilla's current implementation of DeviceLightEvent
provides access to a min
and max
which are no longer defined in the specification.
The "Proximity Events" and "Ambient Light Events" are the most mature branches from the now-divided Sensor API Specification that ambitiously sought to define access to temperature, pressure, humidity, and noise as well. The breadth of those aspirations gives developers a glimpse into the tools they will be afforded to interact with a user's environment with tomorrow's DOM. Developers are encouraged to give feedback regarding these APIs especially during the Last Call. Join the conversation by subscribing to the Device APIs Working Group's public mailing list.
Demonstrations of these developing APIs are available on Github.