Consider using Pointer Lock

[cvan]

First off, nice component :smile: It might be nice to use the Pointer Lock API (perhaps let people opt-in through some property on the attribute value).

There aren't many but there are a few benefits I can think of: you don't have to do as much math yourself, the user can enable/disable the mousemove-based look controls (aka Pointer Lock) by pressing Escape (which is useful if the user wants to click on things outside or on top of the scene/canvas - see this example of Pointer Lock), and the cursor can be past the boundary of the browser or screen and the scene can still be moved.

Drawbacks? There is a permission prompt that appears when you engage Pointer Lock - but in Chrome you don't have to agree to it; it just shows up (Firefox will soon be changing its permissions treatment in a similar way - also like the Fullscreen API permissions are handled). Anyway, it may be worth looking into using this API. Totally up to you of course - just thought I'd mention it.

[alexrkass]

hey @cvan , thanks for letting me know about the Pointer Lock API, that's pretty neat! I think there's a use case for both the opt-in pointer lock and this component; I think one of the best things about this component is that it's totally natural for web users and doesn't have a scary popup that steals their cursor away :stuck_out_tongue_winking_eye: