1window.onload = function () {
2
3 // Check if is IOS 13 when page loads.
4 if ( window.DeviceMotionEvent && typeof window.DeviceMotionEvent.requestPermission === 'function' ){
5
6 // Everything here is just a lazy banner. You can do the banner your way.
7 const banner = document.createElement('div')
8 banner.innerHTML = `<div style="z-index: 1; position: absolute; width: 100%; background-color:#000; color: #fff"><p style="padding: 10px">Click here to enable DeviceMotion</p></div>`
9 banner.onclick = ClickRequestDeviceMotionEvent // You NEED to bind the function into a onClick event. An artificial 'onClick' will NOT work.
10 document.querySelector('body').appendChild(banner)
11 }
12}
13
14
15function ClickRequestDeviceMotionEvent () {
16 window.DeviceMotionEvent.requestPermission()
17 .then(response => {
18 if (response === 'granted') {
19 window.addEventListener('devicemotion',
20 () => { console.log('DeviceMotion permissions granted.') },
21 (e) => { throw e }
22 )} else {
23 console.log('DeviceMotion permissions not granted.')
24 }
25 })
26 .catch(e => {
27 console.error(e)
28 })
29}