I'm trying to use HTML5 deviceOrientation events in Javascript to rotate an image when the user rotate his iPhone around him.
I use this code to detect when the gyroscope is moving :
window.addEventListener('deviceorientation', function (e) {
alpha = e.alpha;
beta = e.beta;
gamma = e.gamma;
}, true);
It really works well on iPhone 4+ and iPad 2, but there's no gyroscope on the 3GS (and older iPhones). That's why I'm testing the deviceOrientationSupport like this :
if(window.DeviceOrientationEvent){ // gyroscope support
alert('DeviceOrientationEvent support OK');
} else {
alert('DeviceOrientationEvent support KO');
}
I've seen this code on many websites or forums, but my problem is that with my iPhone 3GS under IOS 5.0.1, this test indicates me : deviceOrientationSupport OK !
I think that this test check only if Safari is able to handle these events :(
So my question is, is it possible to add a test to know if the hardware can fire orientation events ?
Thanks !
After having the same issue as above I also had problems with the older iPad/iPhones not even calling the function on addEventListener.
So I found that the following worked a lot better for me and eliminated any chance of an unsupported device getting through (this was sat with a load screen so it did require an interval before completing its full test. So not for everyone).
var _i = null;
var _e = null;
var _c = 0;
var updateDegree = function(e){
_e = e;
}
window.addEventListener('deviceorientation', updateDegree, false);
// Check event support
_i = window.setInterval(function(){
if(_e !== null && _e.alpha !== null){
// Clear interval
clearInterval(_i);
// > Run app
}else{
_c++;
if(_c === 10){
// Clear interval
clearInterval(_i);
// > Redirect
}
}
}, 200);