Input visualization race condition

[tim-we]

The file InputDirectionDisplay.ts contains the show or hide input direction ring logic. It listens to these events:

• pointerlockchange ( a browser event fired e.g. when successfully requesting pointer lock)
• the input device changes (this our own event)

The ring is shown by default and hidden when the class "hide" is present. I'm not too happy about this inverted logic so feel free to change that (hidden by default with a "show" class). Right now both input listeners directly add or remove the "hide". These could be a problem as it depends on the order of events. Consider the scenario where the player is switching from keyboard to mouse input:

1. pointerlockchange event (removes "hide" class / shows ring)
2. device change event (adds "hide" class)
   Now the input direction ring is hidden even though it should be visible for mouse input with pointer lock. I'm not sure if this sequence of events can occur like this at the moment but it could in the future when changes to other files are made. So I think this should be fixed. One way would be to add some state variables to InputDirectionDisplay.ts and have the event listeners just update those variables and then decide based on that whether to show or hide the ring.