Magazine Internet

Battery Status Web API : Le statut de la batterie en JS avec l’API du W3C

Publié le 04 mars 2014 par Alexandre_julien

Voici une fonctionnalité Web assez pratique prévue dans le W3C permettant d’exploiter le niveau de batterie de votre périphérique / ordinateur en Web avec Battery Status API.

Peu convaincante auprès des géants des navigateurs (IE, Chrome, Safari) qui ont choisit de ne pas implémenter cette API Javascript dans leur navigateur. Il n’en a pas été de même pour la Mozilla Foundation qui l’a ajouté sur Firefox.

La première question (légitime) que l’on peut se poser et quel est l’intérêt d’une telle API au sein d’un navigateur ? Après tout les OS desktops et mobiles sont suffisamment ergonomiques pour en afficher le statut partout.

Et bien une utilisation possible est de jouer sur le déclencheur d’évènement en fonction du niveau de batterie restant pour déclencher des actions. Par exemple, déclencher en Javacript une sauvegarde avant que la batterie de l’utilisateur soit à plat.

Voici un petit exemple d’utilisation de Battery Status API sur un exemple fait avec Knockout.js :

//  Le ViewModel pour construire la vue
var BatteryViewModel = function (battery) {
    // Le niveau de batterie
    this.Level = battery.level.toFixed(2) * 100 + " % ";
    // Le temps de charge (uniquement si le périphérique est en charge).
    this.Charging = battery.chargingTime / 60 + " minutes";
    // Le temps restant de la batterie (uniquement hors charge).
    this.Decharging = battery.dischargingTime / 60 + " minutes";
    // Est-ce que le périphérique est en train de charger ?
    this.IsCharging = battery.charging ? 'In charge' : 'Not Charging';
}

// Binding des données du ViewModel et récupération de l'instance battery.
ko.applyBindings(new BatteryViewModel(navigator.battery));

Le code HTML (affichage) :

<!-- Affichage des données du ViewModel -->
    <ul>
        <li>Your battery level : <span data-bind="text: Level"></span> 
        </li>
        <li>Your charging time : <span data-bind="text: Charging"></span>
        </li>
        <li>Remaining time : <span data-bind="text: Decharging"></span> 
        </li>
        <li>Remaining time : <span data-bind="text: IsCharging"></span> 
        </li>
    </ul>

Voilà peut être trouverez-vous une utilisation de cette Battery Status API, cela dit c’est très difficile étant donnée qu’elle n’est implémentée que sur Firefox pour le moment.

Vous trouver sur http://jsfiddle.net/alexandrejulien/gDHve/62 une demo de l’api utilisable.

Source officielle du W3C : http://www.w3.org/TR/battery-status .

L'article Battery Status Web API : Le statut de la batterie en JS avec l’API du W3C appartient au blog Alexandre JULIEN.


Retour à La Une de Logo Paperblog

A propos de l’auteur


Alexandre_julien 60 partages Voir son profil
Voir son blog

l'auteur n'a pas encore renseigné son compte l'auteur n'a pas encore renseigné son compte

Dossiers Paperblog

Magazine