aframevr / aframe

:a: Web framework for building virtual reality experiences.
https://aframe.io/
MIT License
16.69k stars 3.98k forks source link

Inspector shortcut does not work on certain keyboard layouts #4089

Open LiekeVanmulken opened 5 years ago

LiekeVanmulken commented 5 years ago

Description: The keyboard shortcut for the inspector does not work on the United States-international keyboard layout.

This is the default code from the introduction in the docs

<html>
  <head>
    <script src="https://aframe.io/releases/0.9.0/aframe.min.js"></script>
  </head>
  <body>
    <a-scene>
      <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box>
      <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere>
      <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder>
      <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
      <a-sky color="#ECECEC"></a-sky>
    </a-scene>
  </body>
</html>

It looks like when i use an English keyboard layout (United States international keyboard layout), <ctrl> + <alt> + i it will produce the following character (gotten from keyboardtester): í

This then prevents the inspector from opening. This is solved when using a different keyboard layout, using the Dutch keyboard layout fixes the problem.

LiekeVanmulken commented 5 years ago

It looks like that when you hold down <ctrl> + <alt> + i for a solid second it will trigger the inspector.

LiekeVanmulken commented 5 years ago

This actually seems to be an issue with windows turning ctrl + alt into AltGr which you can read about here. I tested it and when you press ctrl+alt it recognizes that both are pressed but the moment you press the i it thinks that the ctrl and alt key are no longer pressed. When you hold it longer it will eventually recognize that both are pressed and will trigger.

The following code was used to check the keydown:

<html>
<head>
    <script>
        function handler(e) {
            var key = window.event ? e.keyCode : e.which;
            console.log(key, e.altKey, e.ctrlKey);

            //Shortcut code from aframe  src\components\scene\inspector.js line 62
            var shortcutPressed = e.keyCode === 73 && e.ctrlKey && e.altKey;

            console.log(shortcutPressed);
        }
        // attach handler to the keydown event of the document
        if (document.attachEvent) document.attachEvent('onkeydown', handler);
        else document.addEventListener('keydown', handler);

    </script>
</head>
<body>
    AltGr testing
</body>
</html>
LiekeVanmulken commented 5 years ago

^This doesn´t seem to fix the problem entirely, for some reason it only registers it the first time.

dmarcos commented 5 years ago

Thanks for investigating