JavaScript implements mobile phone vibration API code

A new API is out. HTML5 will (soon) support user device vibration. This is obviously a very interesting thing. For example, it can trigger reminders for users and improve the gaming experience. The editor below will sort out the JavaScript mobile phone vibration API for everyone. Friends who need it can refer to it.

The new APIs provided in modern browsers are increasingly leaning towards mobile phone applications rather than traditional desktop applications, such as the javascript geolocation information API. Another JavaScript API that is only targeted at mobile applications is the Vibration API. Obviously, this API allows mobile programmers to use JavaScript to call the vibration function of the phone and set the vibration mode and duration.

Determine the browser’s support for the vibration API
A good habit is to check whether your current application environment and browser support the vibration API before using it . The following is the detection method:

The code is as follows:

// Standards ftw!
var supportsVibrate = "vibrate" in navigator;

There is only one API about vibration in the window.navigator object: vibrate .

Basic Application of Vibration API
The navigator.vibrate function can accept a numeric parameter or a numeric array. When using array parameters, the odd-numbered digits are the number of seconds to vibrate, and the even-numbered digits are the waiting seconds. Number of seconds.

// Vibrate for 1 second

navigator.vibrate(1000);

// Vibrate multiple times
// The parameters are vibrate for 3 seconds, wait for 2 seconds, and then vibrate for 1 second

navigator.vibrate([3000, 2000, 1000]);

If you want to stop vibrating, you only need to pass 0 or an empty array to the navigator.vibrate method:

// Stop vibrating

navigator.vibrate(0);
navigator.vibrate([]);

Required As a reminder, calling the navigator.vibrate method will not cause the phone to vibrate cyclically; when the parameter is a number, the vibration will occur once and then stop. When the parameter is an array, the vibration will vibrate according to the value in the array, and then stop vibrating.

Continuous vibration
We can simply use the setInterval and clearInterval methods to produce the effect of making the phone continuously vibrate:

var vibrateInterval;
// Starts vibration at passed in level
function startVibrate(duration) {
navigator.vibrate(duration);
}
// Stops vibration
function stopVibrate() {
// Clear interval and stop persistent vibrating 
if(vibrateInterval) clearInterval(vibrateInterval);
navigator.vibrate(0);
}
// Start persistent vibration at given duration and interval
// Assumes a number value is given
function startPeristentVibrate(duration, interval) {
vibrateInterval = setInterval(function() {
startVibrate(duration);
}, interval);
}

The above code is only for vibration parameters that are a number. In case, if the parameter is an array, you also need to calculate its total duration and then loop based on its characteristics.

Scenarios for using Vibration API
This API is obviously targeted at mobile phone devices. When developing mobile WEB mobile applications, it is a good warning tool. When developing Web games or multimedia applications, this vibration function is an indispensable good technology. For example, when a user is playing your WEB game on a mobile phone, and an explosion occurs in the game, and you make the mobile phone vibrate with it, is it an excellent user experience?

What do you think about this JavaScript vibration API? Do you think it will become popular quickly? Still not of much use?

The above is the entire content of this chapter. For more related tutorials, please visit JavaScript Video Tutorial, Html5 Video Tutorial!