Access to the gyro and accelerometer from javascript

I think many have seen demos made by google guys, when shaking a laptop, the video inside the html page was falling apart. I wanted to do the same, but unfortunately at that time I could not find how. More recently, I read about two types of events: DeviceOrientationEvent and DeviceMotionEvent , which are now supported in iOS 4.2. Details under the cut.

Start over. The draft version of the specification appeared on August 24, 2010. For I understand what, where and where, I advise you to read it.

Then, already in November, if I am not mistaken on the 25th, information about the implementation of these events in iOS, namely, two events DeviceOrientationEvent (running on iPhone 4 with iOS 4.2) and DeviceMotionEvent (iPhone 3GS and 4, also iPad with iOS 4.2). The links documentation for safari.

Further googling showed that for the Mozilla version above 3.6 there is also a corresponding event - onmozorientation .
')
For those who can not wait to see how it all works, here is a link to an interesting demo.

So, if we write something iOS 4.2-shaped, then the following data is available for the DeviceOrientationEvent event:

• event.alpha - rotation angle around the z axis, varies from 0 to 360
• event.beta - rotation angle around the x axis, varies from -180 to 180
• event.gamma - rotation angle around the y axis, varies from -90 to 90

The following data is available for the DeviceMotionEvent event:

• event.acceleration - acceleration given to the device (values ​​are available for the x, y and z axes)
• event.accelerationInc includingGravity- gravity-based device acceleration (values ​​for x, y, and z axes are available)
• event.interval - time interval since the last movement (in milliseconds)
• event.rotationRate - rotation angle (see DeviceOrientationEvent)

Since I only have an iPhone 3G in my hands, I was able to check only the work of DeviceOrientationEvent , and only accelerationIncludingGravity worked for me in it. Therefore, for the beginning I made such a simple demo.

After sitting a little more on the basis of the old demo from PhoneGap, I got such a simple toy.

The main problem when working with my iPhone 3G - with a strong rotation, the mode changes from portrait to landscape, there is a strong lack of the ability to lock the screen.

All code is available in gita .