HTML5 İle Telefon Titreştirmek
HTML5 Vibration API ile, tarayıcı üzerinden telefonu istediğiniz aralıklarda titretebilirsiniz. Bu yazımda size API hakkında biraz bilgi vereceğim. HTML5 tabanlı oyunlar yazıyorsanız kullanıcı etkileşimini arttırabilirsiniz.
Kullanılan tarayıcının bu API yi destekleyip desteklemediğini öğrenmek için şu kodu kullanabiliriz,
navigator.vibrate = navigator.vibrate || navigator.webkitVibrate || navigator.mozVibrate || navigator.msVibrate;
if (navigator.vibrate) {
console.log('Tebrikler, destekliyor.');
} else {
console.log('Üzgünüm, desteklemiyor.');
}
1000ms süreli 1 kez titreşim için,
window.navigator.vibrate(1000);
// ya da
window.navigator.vibrate([1000]);
Farklı süreler kullanarak birden fazla kez titreştirmek için,
window.navigator.vibrate([1000, 2000, 3000]); // 1 saniye titret 2 saniye bekle sonra 3 saniye titret.
Telefonu titreterek Mors alfabesinde SOS(Yardım) çağrısı yapmak için (Kaynak 4),
window.navigator.vibrate([100,30,100,30,100,200,200,30,200,30,200,200,100,30,100,30,100]);
Titreşimi sonlandırmak içinse,
window.navigator.vibrate(0);
//ya da
window.navigator.vibrate([]);
kodlarını kullanabilirsiniz.
Ne İşe Yarayacak?
Vibration API ile mobil web uygulamalarına biraz daha canlılık katabiliriz. Oyun oynarken, sohbet ederken ya da bir bildirim gönderirken kullanıcıya titreşim yollayarak ilgisini çekebiliriz. Tabi titreşimin açık olması gerektiğini unutmamak gerek 😀
Tarayıcı Desteği
Demoyu Android 4.2.2 üzerinde Chrome 40 sürümünde ve Firefox’un son sürümünde test ettim ve çalıştı. Varsayılan Android tarayıcısında api çalışmadı (4.2.2 olduğundan dolayı). Web tarayıcıları da destekliyor görünse bile bilgisayarların titreşim özelliği olmadığından bunu test edemeyeceksiniz. Windows işletim sistemine sahip tabletler için durumun ne olduğunu açıkçası bilmiyorum.
Caniuse’a göre Vibration API desteği şu tarayıcılarda var;
- Firefox 35+
- Chrome 31+
- Opera 27+
- Varsayılan Android Tarayıcı ( 4.4 / Kitkat +)