HTML5 to technologia stosunkowo młoda w tworzeniu aplikacji webowych, jednak rozwijająca się niezwykle szybko. Twórcy aplikacji webowych często zastanawiają się, jak połączyć obsługę sprzętu z oprogramowaniem. W tym celu wykorzystuje się tzw. wirtualizację. Skupmy się jednak na temacie wpisu - wibracji obsługiwanej w HTML5.
Co to jest Vibration API?
Niemal każde urządzenie mobilne jest wyposażone w moduł wibracji. Możliwości wykorzystania Vibration API są niemal nieograniczone - zdarzenia takie jak nadejście sms, wybuch w grze czy tapnięcie w ekran. Interfejs api wygląda następująco:
partial interface Navigator {
boolean vibrate ((unsigned long or sequence<unsigned long>) pattern);
};
Jak używać wibracji w HTML5?
Implementacja wibracji w HTML5 jest bardzo prosta. Najpierw sprawdzamy czy urządzenie obsługuje navigatora oraz jego metodę wibracji.
if (window.navigator && window.navigator.vibrate) {
// super, wibrujemy
} else {
// nie śmiga
}
Następnie, jeśli wibracja jest wspierana wywołujemy metodę vibrate(). Możemy to wykonać w dwojaki sposób:
// wibracja przez 1000ms = 1s
navigator.vibrate(1000);
// kilka wibracji - 1s, 1s, 0.5s, 3s
navigator.vibrate([1000, 1000, 500, 3000]);
Proste, prawda? Dodatkową opcją jest możliwość zatrzymywania wibracji, co wykonujemy w następujący sposób:
navigator.vibrate(0);
//lub
navigator.vibrate([]);
Wsparcie przeglądarek
Chyba najważniejsza kwestia - wsparcie. Jak to zwykle bywa z nowościami, wibrację wspierają nowsze przeglądarki mobilne takie jak:
- Firefox 11+ (zalecenia Firefox 15+)
- Opera 17+ (zalecenia Opera 19+)
- Chrome 30+ (zalecenia Chrome 32+)
Demo
Naturalnie można to przetestować na swoim urządzeniu mobilnym. Należy jednak być wyposażonym w powyższe wersje przeglądarek.
