HTML5 Mouse Lock


#1

Hello, everyone.

I noticed that while the Set Mouse Lock node works in Krom, it doesn’t lock the mouse when tested in browser. Is there a different node setup for that?


#2

Judging from github, it only supports Krom for now. You might be able to get it to work in the browser still, but if you don’t mind a bit of coding tho, plus it only works on Chrome and Firefox yet, as far as I’m aware.

From haxe, you can call javascript functions to the HTML5 Pointer Lock API (https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API).

If you don’t like coding, I can probably make an easy copy-paste haxe script when I get home if interested (or unless someone beats me to it)?


#3

Thank you for your response and the link, good stuff and I will certainly use it. I want to eventually test my little experiment out on an actual game portal site.

I don’t mind coding, I was just on a roll seeing what can be done with the logic nodes, I haven’t messed with something like this since the original BGE and MIT’s Scratch. I don’t want anyone to think I am begging for code or anything. I already suspect everyone thinks I am too dumb to use a search engine.

Again, thank you for your help!


#4

if I remember correctly, games created using html5 can not block the mouse (counting the browser)?


#5

@LostInRotation No worries, it’s not always easy to know what to search for, plus the feature is brand new and only available in the latest versions of Firefox and Chrome - Glad to help

@mod_nop they couldn’t until recently when the canvas.requestPointerLock function came - I’ve messed a bit with it, trying to invoke it from Armory, and it works, sort of…the mouse cursor is locked in the browser, but functions dependent on input from the mouse stops working (such as FPS or walkNavigation traits for instance):

package arm;

class CallJS extends iron.Trait {
	public function new() {
		super();

		 notifyOnInit(function() {

			 untyped __js__('

			 var canvas = document.getElementById("khanvas");

			 canvas.requestPointerLock = canvas.requestPointerLock || canvas.mozRequestPointerLock;
			 
			 canvas.onclick = function() {
				canvas.requestPointerLock();
			};
			 
			 ');

		 });

	}
}