Voir le flux RSS

TiranusKBX

[Actualité] Introduction à l'API javascript Battery Status

Noter ce billet
par , 28/11/2015 à 18h57 (756 Affichages)
Nom : batery_html5.png
Affichages : 998
Taille : 60,6 Ko
Présentation
L'API "Battery Status", sert fournit des informations sur le niveau de charge du système et permet d'envoyer des événements pour prévenir d'un changement du niveau de charge de la batterie ou du changement du mode de charge(charge/décharge). Cela peut être utilisé pour ajuster la consommation d'énergie ou encore déclencher une sauvegarder de données quand la batterie est bientôt vide.
Vus que l'API n'est pas fixée de manière définitive elle n'est actuellement supportée que par Chrome/Chromium et Firefox.
N’hésitez pas à consulter les sources pour les listes de compatibilité



Mise en pratique
L'interface navigator.battery étant dépréciée nous verrons donc comment utiliser l'accès aux informations de batterie à travers navigator.getBattery().
La méthode navigator.getBattery() retourne un promise pouvant servir à obtenir des information de manière asynchrone.
Code Javascript : Sélectionner tout - Visualiser dans une fenêtre à part
navigator.getBattery().then(function(battery) {/* votre code ici */});
Ce promise retourne un objet ... BatteryManager

L'objet BatteryManager à plusieurs propriétés directement disponibles(en lecture seule ), en voici la liste:
charging indique si le chargeur secteur est branché avec un booléen
chargingTime temps estimé de rechrge de la batterie en secondes(si batterie plaine= 0, 'Infinity' si débranché)
dischargingTime temps de décharge estimé en secondes, si branché retourne 'Infinity'
level le niveau batterie dans un nombre entre 0 et 1, pour avoir en pourcentage multipliez le par 100

Voyons ensuite la gestion d’événements, comme souvent pour les objets Javascript acceptants des événements les méthodes .addEventListener() et .removeEventListener() sont disponibles mais aussi la méthode .dispatchEvent(). Maintenant listons les événements disponibles :
chargingchange événement quand le chargeur secteur est branché ou débranché
chargingtimechange événement quand le temps de charge change
dischargingtimechange événement quand le temps de décharge change
levelchange événement quand le niveau batterie change
Vous pouvez donc par exemple les utiliser de cette manière
Code Javascript : Sélectionner tout - Visualiser dans une fenêtre à part
navigator.getBattery().then(function(battery) {battery.onlevelchange=function(e){console.log(navigator.battery.level);};});
ou de manière plus propre
Code Javascript : Sélectionner tout - Visualiser dans une fenêtre à part
navigator.getBattery().then(function(battery) {battery.addEventListener('levelchange',function(e){console.log(navigator.battery.level);}, false);});
sur Firefox les paliers pour le niveau de batterie est de 10%, de ce fait la propriété level vous retourneras 0.1, 0.2, 0.3, 0.4 ... 1.0 mais à +5%(ex: 85% donne 0.9 et 84% donne 0.8)

Voici donc un exemple plus important pour vous mettre l'eau à la bouche (Merci MDN)
Code Javascript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
navigator.getBattery().then(function(battery) {
 
  console.log("Battery charging ? " + (battery.charging ? "Yes" : "No"));
  console.log("Battery level: " + battery.level * 100 + "%");
  console.log("Battery charging time: " + battery.chargingTime + " seconds");
  console.log("Battery discharging time: " + battery.dischargingTime + " seconds");
 
  battery.addEventListener('chargingchange', function() {
    console.log("Battery charging? " + (battery.charging ? "Yes" : "No"));
  });
 
  battery.addEventListener('levelchange', function() {
    console.log("Battery level: " + battery.level * 100 + "%");
  });
 
  battery.addEventListener('chargingtimechange', function() {
    console.log("Battery charging time: " + battery.chargingTime + " seconds");
  });
 
  battery.addEventListener('dischargingtimechange', function() {
    console.log("Battery discharging time: " + battery.dischargingTime + " seconds");
  });
 
});

Conclusion
Donc dans cette rapide introduction je vous ais montré qu'il est simple d'utiliser cette API, pour le moment le support est surtout sur Firefox et chrome y compris en mobile(pourquoi Apple ce ferait chier à développer une API pas encore validée )
N'en doutons pas cette API est principalement pensée pour les petits terminaux mobiles mais peut aussi se montrer utile avec les PC portables.Il ne vous reste plus qu'à décider ce que vous en ferrez ensuite


Sources :
MDN API BatteryManager
MDN API GetBattery

Envoyer le billet « Introduction à l'API javascript Battery Status » dans le blog Viadeo Envoyer le billet « Introduction à l'API javascript Battery Status » dans le blog Twitter Envoyer le billet « Introduction à l'API javascript Battery Status » dans le blog Google Envoyer le billet « Introduction à l'API javascript Battery Status » dans le blog Facebook Envoyer le billet « Introduction à l'API javascript Battery Status » dans le blog Digg Envoyer le billet « Introduction à l'API javascript Battery Status » dans le blog Delicious Envoyer le billet « Introduction à l'API javascript Battery Status » dans le blog MySpace Envoyer le billet « Introduction à l'API javascript Battery Status » dans le blog Yahoo

Mis à jour 28/11/2015 à 19h50 par TiranusKBX

Catégories
Javascript , Développement Web

Commentaires