HTML 5 Vibration API

Ayer estuve jugando con mi ZTE Open con Firefox OS y una de las Apis que podemos probar a día de hoy es HTML 5 Vibration API, la cual nos permite activar la vibración del dispositivo a través de JavaScript.

La interfaz vibrate cuelga de navigator y lo único que necesitamos indicar es un número o array de milisegundos durante los cuales queremos que el dispositivo esté vibrando. Si utilizamos un patrón de vibración podemos definir el número de milisegundos que el dispositivos está vibrando o en pausa, alternando estos valores.

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <input type="button" id="btn2Secs" value="Vibrate for 2 seconds" />
    <input type="button" id="btnPattern" value="vibrate for 2000 ms, wait 300 ms, vibrate again for 2000 ms">
    <input type="button" id="btnStopVibration" value="Stop vibration" />
    <script>
        if ("vibrate" in navigator) {

            btn2Secs.addEventListener("click", function () {
                navigator.vibrate(2000);
            });

            btnPattern.addEventListener("click", function () {
                navigator.vibrate([2000, 300, 2000]);
            });

            btnStopVibration.addEventListener("click", function () {
                navigator.vibrate(0);
            });
        }
    </script>
</body>
</html>

En el ejemplo anterior, he creado una serie de botones que nos permiten activar la vibración durante 2 segundos, a través de un patrón y por último para parar la vibración en curso. Es necesario que la llamada esté asociada a una acción del usuario, ya que de lo contrario no será posible lanzar su ejecución.

A día de hoy esta Api está soportada por Chrome y Firefox para escritorio (pero es necesario un dispositivo con vibración) y en el entorno mobile es necesario Firefox Mobile o Android (webkit) para poder usarlo.

Espero que sea de utilidad.

¡Saludos!