Home
Last updated
With the HTML5 Battery Status API you can gain access to battery information for the host machine of the browser you are using. The uses for this might be to reduce operations that use battery life in your application if the battery is low or show battery graphics. You can get access to battery information through navigator.battery
. Particularly for mobile devices I can see this being really useful.
This returns a JavaScript object with battery status information.
navigator.battery
{
charging: true,
chargingTime: 0,
dischargingTime: Infinity,
level: 1,
onchargingchange: null,
onchargingtimechage: null,
ondischargingtimechange: null,
onlevelchange: null
}
You will notice a number of events that you can bind to
navigator.battery.onchargingchange = function () {
console.log(navigator.battery.charging);
}
navigator.battery.onchargingtimechange = function () {
console.log(navigator.battery.chargingTime);
}
navigator.battery.oncdischargingtimechange = function () {
console.log(navigator.battery.dischargingTime);
}
navigator.battery.onlevelchange = function () {
console.log(navigator.battery.level);
}
You could use these to update graphics or change application behaviour when battery life or status changes.
At the time of writing the Battery Status API is candidate recommendation but my experience of browser support is poor. I wasn’t able to find much information on the status of this API. In my current version of Chromium (31.0.1650.63) it is unsupported either as navigator.battery
or navigator.webkitBattery
. I found that my version of Firefox (26.0) is supported but only default values are returned so the browser isn’t able to read battery status.
Have an update or suggestion for this article? You can edit it here and send me a pull request.