Keyboard/Mouse event listening when module is embedded in a canvas among other elements in the page

Hi,

We have an issue managing Keyboard/Mouse events in our WebGL module, as our application is in a canvas among other elements in the page. We want input forwarded to WebGL module only when its canvas has focus.

Using what is described at bottom of https://docs.unity3d.com/Manual/webgl-input.html, we set WebGLInput.captureAllKeyboardInput = false, and used a workaround based on
http://answers.unity3d.com/questions/993114/webgl-moduledonotcapturekeyboard-true-or-modulekey.html.

However, since 5.6 and WebAssembly, the 'JSEvents' object used in workaround is no longer available.

Is there a more elegant way to do it in 5.6 ? Otherwise, do we still have access to 'JSEvents' somewhere ?

Thanks,

Yvan

 

Does anyone have an idea about this?
A new workaround to catch keystrokes only when the Unity canvas is activated?

 

Thanks Alex !

We are using 5.6.0f3, using WebAssembly build option.

Unfortunalty, JSEvents seems to not be defined into MyGameInstance.Module :



I think you should be able to reproduce it with any WebAssembly build. Sending you a package could be complicated in this context. Let's go there only if we really need to

 

Thank you !

Works like a charm

 

Hey, the Assets/Plugins/JSEvents.jspre file does not appear to exist anymore in Unity 5.6.3f1. Is there any other work around for this, as I need to be able to have keyboard input within the game and also on HTML input elements on the webpage, thanks.

 

You can make it yourself pretty easily:

Create a new .jspre file in Assets/Plugins/ with this single line of code:

Code (JavaScript):

1. Module.getJSEvents = function () { return JSEvents; };

Then create your build. You can access this now with:

Code (JavaScript):

1. window.<unityInstanceVariableName>.Module.getJSEvents()

 

FYI, if anyone is having issues with getting the canvas to catch keyboard events when WebGLInput.captureAllKeyboardInput = false, try adding the attribute: tabindex='1' to the canvas element. That did the trick for me.

Not sure why it works through, do keyboard events only go to things that can get focus? Is something having a tabindex a requirement to be "focusable"?

Thanks.

 

Thank you alexsuvorov and Ewanuk! It works!!

You might also want to hide that input field, but still let it receive focus. This is is the best way I found to do that. Tested on Chrome and Firefox:

<div id="WebGLKeyboardInputHider">
<input id="WebGLKeyboardInput" type="text" name="WebGLKeyboardInput" value="" />
</div>

#WebGLKeyboardInput {
opacity: 0;
}
#WebGLKeyboardInputHider {
width: 0;
overflow: hidden;
}