In this post were going to explore the (small) BatteryManager API.
BatteryManager is returned by navigator.battery. You can interface with the object in the following ways
levelchargingTimedischargingTimeThe battery manager also dispatches the following events
levelchangechargingchangechargingtimechangedischargingtimechangeYou can add an event listener using addEventListener interface.
function updateStatus() {
var battery = navigator.battery;
console.log('Battery: ' + battery.level * 100 + '%');
console.log('Charge Time: ' + battery.chargingTime);
console.log('DisCharge Time: ' + battery.dischargingTime);
}
function addBatteryListeners() {
var battery = navigator.battery;
battery.addEventListener('levelchange', updateStatus, false);
battery.addEventListener('chargingchange', updateStatus, false);
battery.addEventListener('chargingtimechange', updateStatus, false);
battery.addEventListener('dischargingtimechange', updateStatus, false);
}
addBatteryListeners();
updateStatus();
Now we can test this…but it’s a lot of trouble to create a new application to test this little bit of javascript. Thus, this leads us to an introduction to some of the developer tools.
The Web Developer Tools for in the Firefox Web browser can be used for any website and for any Firefox OS app.
Apps Tab on the left hand sideHello, Firefox OS app from the first post.DebugHere there is a couple of different tools at out disposal.
Console - the javascript consoleInspector - inspect HTML elements from the page. Shows the CSS rules applied to the element.Debugger- used to set breakpoints in javascript code and step through itStyle Editor - CSS editorProfiler - profile the render and running time of the webpage.Scratchpad - write javascript code that gets run in the context of the webpageThe one we are interested in is the Scratchpad. Just paste the javascript code above, click run, and look at the console! Much simpler than creating another app.