Vibration API – HTML5 APIs

Vibration API von HTML5

Immer mehr Menschen verwenden ihr Smartphone oder Table, um Inhalte im Internet zu Konsumieren. Diese Geräte beinhalten inzwischen unzählige Sensoren, auf die native Apps Zugriff  haben. Doch dank HTML5 kann man die meisten Sensoren auch mit JavaScript ansprechen. Es ist also möglich Web-Apps zu entwickeln, die sich wie native Apps verhalten.

Wie wäre es, wenn man den Benutzer über etwas per Vibration informiert? Zum Beispiel, wenn eine neue Nachricht (PM) ankommt. Hier kommt das Vibration API zum Einsatz.

Browserunterstützung

Im Moment unterstützen nur die letzten Versionen von Firefox (ab Version 16) und Chrome das Vibration API. Frühere Versionen (Firefox ab Version 11) verwendeten den webkit, bzw. moz Präfix.

Mit dem folgendem Code lässt sich herausfinden, ob der Browser oder das Gerät das Vibration API unterstützt:

Anwendung

Die Dauer der Vibration kann in Millisekunden an die vibrate() Methode übergeben werden.

Alternativ kann auch ein Array mit Werten übergeben werden. Dabei wird die Vibrationsdauer und Pause in Millisekunden abwechselnd angegeben. In dem Folgebeispiel vibriert das Gerät 300ms, macht 200ms Pause und vibriert weitere 800ms.

Eine Vibration abbrechen kann man, indem man eine Null an die Methode übergibt.

Die Vibrationen blockieren dabei die Ausführung von JavaScript nicht.

Fazit und Demo

Mit HTML5 bekommen die Webentwickler immer mehr Möglichkeiten für die Realisierung von Web-Apps. Dabei ist das Vibration API von HTML5 nur ein keiner Bestandteil. (Battery Status API)

Auch wenn wir solche Möglichkeiten bekommen, sollte man immer stets überlegen, ob das Feature wirklich notwendig ist. Benutzer könnten sich belästigt fühlen, wenn Webseiten anfangen die Geräte vibrieren zu lassen. Außerdem darf der zusätzliche Stromverbrauch nicht außer Acht gelassen werden. Solche Features sollten Web-Apps und Online-Spielen vorbehalten bleiben.

Demo: http://jsfiddle.net/abogomolov/4RN4e/

Ich wünsche euch viel Spaß beim Ausprobieren und hinterlasst gerne eure Meinungen in den Kommentaren.

ALL-INKL.COM