Register key press events

[Silly-V]

The CEP-9 github spot says the following:

Register an interest in specific key events

(Since 6.1) Register an interest in some key events to prevent them from being sent to the host application:

CSInterface.prototype.registerKeyEventsInterest = function(keyEventsInterest) 

This function works with modeless extensions and panel extensions. Generally all the key events will be sent to the host application for these two extensions if the current focused element is not text input or dropdown.

If you want to intercept some key events and you want them to be handled in the extension, please call this function in advance to prevent them being sent to the host application.

• keyEventsInterest: A JSON string describing those key events you are interested in. A null object or an empty string will lead to removing the interest

This JSON string should be an array, each object has following keys:

• keyCode: [Required] represents an OS system dependent virtual key code identifying the unmodified value of the pressed key.
• ctrlKey: [optional] a Boolean that indicates if the control key was pressed (true) or not (false) when the event occurred.
• altKey: [optional] a Boolean that indicates if the alt key was pressed (true) or not (false) when the event occurred.
• shiftKey: [optional] a Boolean that indicates if the shift key was pressed (true) or not (false) when the event occurred.
• metaKey: [optional] (macOS Only) a Boolean that indicates if the Meta key was pressed (true) or not (false) when the event occurred. On Macintosh keyboards, this is the command key. To detect Windows key on Windows, please use keyCode instead.

But here is what I get in Adobe Illustrator CC2019?

Uncaught TypeError: csInterface.registerKeyEventsInterest is not a function

How on earth could that be?

[Loic.Aigon · Accepted solution]

Hi Silly-V​

Check your CSinterface.js file. The Version 6 of the file doesn't host the method declaration hence your possible execution error.

Version 8 has it. Don't have 7 at hand but it has probably been added somewhere between 7 and 8.

[Silly-V]

Indeed this was the issue! However, now I am unsure about how to actually get it to work. I have the following code which I expect would yield alert boxes when my extension is open and I press the "Esc" key - but nothing happens!

My code is exactly like this all in one place, what could I be doing wrong?

  <script>

       const csInterface = new CSInterface();

       var keyInterests = [

            { "keyCode": 27 }

       ];

       csInterface.registerKeyEventsInterest( JSON.stringify( keyInterests ) );

       csInterface.addEventListener('keydown',function(e){ 

             alert("keydown detected"); 

       });

  </script>

[Loic.Aigon]

Too far from keyboard to give it a try but a quick search show some issues with keypress events :

registerKeyEventsInterest is not working · Issue #165 · Adobe-CEP/CEP-Resources · GitHub

or

Keyboard Shortcut Conflicts

Might be something os related or a bug. I think you need more researches

[Silly-V]

Aha! Indeed it was the OS. I was sabotaged by my unwilling to pay attention to the OS differences for the "Esc" key code!

Besieged by basic browser-based bias. Indeed, the reason the key codes differ is because our CEP deals with key-pushes actually before they get to the built-in browser.

Well, I can keep on the progress, thank you.

Here is what I ended up with, starting with the scope of the 'main.js':

    const currentOs = (navigator.userAgent.indexOf("Mac") != -1) ? "Mac" : "Windows";

   const csInterface = new CSInterface();

   let keyInterests = (currentOs == "Windows") ? [

  { "keyCode": 27 }

  ] : [

      { "keyCode": 53 }

    ];

   csInterface.registerKeyEventsInterest( JSON.stringify( keyInterests ) );

and in the Vue component's javascript in the created event, the listener:

        this.$nextTick(function(){

          $("#the-element").on('keydown', handlerFunc);

        });