Calibrate Gyroscope to be controlled vertically

[AnweshGangula]

I really like the gyroscope implementation and I tried using it on my website.

What I noticed was that if my mobile is flat on a surface, then the gyroscope feature works fine.
But since any mobile in most of the cases will be vertical, it would be better if its configured to work when the mobile is vertical or maybe give that control to the developer using props.

[mkosir]

Hey @AnweshGangula, thanks for the suggestion, its a good point!
I think it makes a lot of sense, since I believe majority of users are holding mobile devices in vertical position.

I think the best approach, to not cause breaking change to current library API, would be to introduce another prop.
Not completely sure on the naming but maybe gyroscopeOrientation with normal and reversed string union type, where default value is normal (unchanged current behavior), and I think to achieve reverse effect, we would swap gamma and beta values of DeviceOrientationEvent.

[AnweshGangula]

sounds great @mkosir. Thank you for the inputs.

[far0s]

Hi there @mkosir has there been any evolution on that topic?

I'm having the same "issue": when the onmouseenter event happens I want the element to "normalize" its gamma and beta values to 0, so that the neutral position is the one the user is currently holding his device in, and then animate normally from there.

If I read you right there's a difference with the gyroscopeOrientation prop you proposed, I reckon something more akin to gyroscopeNormalizeOnEnter would be more appropriate?