Programación y ejemplos de PHP, jQuery, HTML5, WordPress, MySQL y htaccess


Battery Status API de HTML5: Comprobar la carga de la batería de dispositivos móviles

Voy a tratar de hacer ejemplos sencillos de la Battery Status API de HTML5 en esta nueva entrada, como veréis es otro paso más de las APIs de HTML5 para integrarse y comunicarse con el hardware de los dispositivos móviles.

Quizás no sea una API de HTML5 muy potente o demandada, pero creo que debía hacer este post ya que nos puede ser útil para futuros desarrollos que dependan mucho del consumo de batería.

Segun la documentación oficial de la W3C:

La API ofrece información sobre el estado de carga de la batería del dispositivo.

Privacidad y seguridad de la Battery Status API

La API devuelve información del estado de carga de la batería. Esta información tiene un impacto mínimo en la privacidad y seguridad del dispositivo consultado, por lo que se accede a la información sin permiso del usuario.

Atributos de la Battery Status API de HTML5

Las consultas del estado de la carga de batería en HTML5 se hacen mediante atributos, los enumero a continuación:

  • charging: Determina si la batería se está cargando.
  • chargingTime: Determina el número de segundos restantes para que la batería se cargue por completo.
  • dischargingTime: Determina el número de segundos restantes para que la batería se gaste completamente y el dispositivo entre en suspensión.
  • level: Representa el nivel de batería del 1 al 1.0.

Eventos para controlar los cambios del estado de la bateria en HTML5

Ahora nos queda conocer los eventos que nos permiten controlar los cambios en el estado de la batería. Si no los usamos podemos estar viendo todo el rato el mismo valor de nivel de batería sin que este sea correcto.

  • onchargingchange: Determina si la batería comienza a cargarse o se deja de cargar.
  • onchargingtimechange: Determina el cambio del tiempo en segundos restantes para cargar la batería al 100%
  • ondischargingtimechange: Determina el cambio del tiempo en segundos restantes para que la batería quede descargada y entre en suspensión el dispositivo.
  • onlevelchange: Determina el cambio del valor de nivel de la batería del 1 al 1.0.

Completa demo de ejemplo de la Battery Status API de HTML5

Os voy a poner esta demo de ejemplo de la Battery Status API de HTML5 en la que repasaré los diferentes atributos y eventos mencionandos anteriormente.

El ejemplo está probado con la versión móvil de Firefox, en las de Safari y Chrome no he conseguido reproducirlo. Habrá que esperar a futuras versiones de estos navegadores.

A ver por donde empiezo… básicamente primero he asigando a los input el valor de cada dato en el momento de la consulta. Después he programado 4 funciones para detectar los cambios de valor del: estado de la batería, tiempo de carga restante, tiempo de descarga restante y si se está cargando la batería.

Habrá veces que el valor devuelto en tiempo decarga/descarga os devuelva ‘Infinity‘, esto sucede cuando:

  • Se carga la batería: Es lógico ya que el tiempo restante de batería es infinito puesto que se está cargando.
  • No se carga la batería: Daría el tiempo de carga infinito ya que no se está cargando la batería.

Os pongo esta imagen de ejemplo:

battery status api html5Comento la inicialización de las variables con los atributos:

Y ahora comento los eventos:

Termino poniendo el código de los input:

Para que esta demo de ejemplo de la Battery Status API de HTML5 sea más completa y eficiente habría que poner algún control más sobre los valores devueltos, tales como, el valor ‘Infinity’ o el redondeo de los minutos. Aun así espero que os valga para conocer los atributos y eventos para controlar el estado de la batería con HTML5.

comments powered by Disqus

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.

ACEPTAR
Aviso de cookies