-
Notifications
You must be signed in to change notification settings - Fork 1
/
orient.html
41 lines (37 loc) · 1.28 KB
/
orient.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<html>
<head>
<title>Screen Orientation</title>
</head>
<body>
<!-- To be able to access the vibration API, the user must explicitly
perform some event such as a button click. This is to make sure
that developers do not misuse the vibration API to make it vibrate
at any given time.
-->
<!-- The button below allows the vibration API to be triggered on button
click. Once the user allows this action, the developer can trigger
vibration events at any time until the page is refreshed or destroyed.
-->
<button onclick="navigator.vibrate(0);" id="btn">Allow Vibrate</button>
<p id="orient"></p>
</body>
<script>
// Add an event listener to check for a change in the orientation
window.addEventListener('orientationchange', function(e){
// Check if the device is tilted to the right
// -90 -> Tilted to the right
// 0 -> Straight/Portrait
// 90 -> Tilted to left
if(window.orientation == -90){
// Display tilt side on webpage
document.getElementById('orient').innerHTML = "Tilted Right";
// Vibrate for 10 seconds
navigator.vibrate(10000);
} else if(window.orientation == 90){
document.getElementById('orient').innerHTML = "Tilted Left";
// Stop the vibration
navigator.vibrate(0);
}
});
</script>
</html>