registerKeyEventsInterest is not working

[AAverin]

At least on MacOS, registerKeyEventInterest is not working I tried to run the provided sample, but it doesn't work there too Adobe CC 2018 latest

[akibnavidkhan]

I am able to register keys on macOS using registerKeyEventsInterest function. Note that, keycodes are different in windows and mac for same key. For eg, if you want to register key 'a' on MacOS you have to use structure, [ { "keyCode": 0 } ] but on Windows you have to use structure, [ { "keyCode": 65 } ]

Please find keycodes for, MacOS:- https://gist.github.com/kemmason/949034 Windows:- https://msdn.microsoft.com/en-us/library/windows/desktop/dd375731(v=vs.85).aspx

[AAverin]

I tried different keys, and beforehand checked keyCodes with a browser javascript. So if, for example, I register:

csInterface.registerKeyEventsInterest(JSON.stringify(
    [ 
            {
               "keyCode": 49
            }
        ]
))

I expect to catch number 1 being pressed, but it's not working

[akibnavidkhan]

For 1, MacOS have keycode 18, so if you use, csInterface.registerKeyEventsInterest(JSON.stringify( [ { "keyCode": 18 } ] )) you should be able to register for 1.

[Kashterion]

I can confirm this as well. It seems that you cannot simply register for specific key combos (e.g. PS shortcuts, Cmd + A, i'm using the right key codes for Mac). @akibnavidkhan have you tested what happens if you have a CodeMirror instance in a panel? I've also registered for the extraKeys in the CodeMirror instance, but it's just not working on Mac. On Windows, everything seems to be working perfectly as expected. Could you please point me in a direction, how to get this working on Mac?

Thank you.

[AAverin]

I see my mistake with the codes – they are hexamedical. They could have mentioned this in documentation

What I basically need is to know when keys Shift, Alt, Ctrl are being held by the user (no keyup sent yet). And, I don't want to break Photoshop functionality, so if there is anything that Photoshop does when you hold Alt, it should still work, but my panel should also know that Alt is in the pressed state.

Is it possible with this method?

[akibnavidkhan]

@Kashterion We have internal bug to register keys which are App shortcuts in MacOS. You can not register for keys CMD+A, CMD+C, CMD+Z, CMD+X and CMD+V when focus on editable widget(we have bug for this as well). I have not tested with CodeMirror instance in a panel. I will try it out and come back to you. @AAverin you can use keycode 55 for Cmd, 56 for shift, 58 for option(Alt) and 59 for Ctrl. Key event will either goes to extension or host application, so described workflow will not work with this method.

[Kashterion]

@akibnavidkhan I understand. Anyways, thank you for your effort investigating this issue.

By the way, is there any chance to capture TAB keypress, this doesn't seem to work well on Windows & Mac.

FYI: I've tried the followings to get this working, unfortunately without any success.

    var keyInterests = [
        { "keyCode": 0, "metaKey": true },
        { "keyCode": 48 },
    ];
    CSInterface.registerKeyEventsInterest( JSON.stringify( keyInterests ) );

    /************************************************************************/

    editor.setOption( 'extraKeys', {
        'Cmd-A': function ( cm ){
            console.log ( 'This is not working' );
        },
        'Tab': function ( cm ){
            console.log ( 'This is not working' );
        }
    });

    var keyMap = CodeMirror.keyMap;
    keyMap.macKeyMap = {
        "Cmd-A": function(){ console.log( "This is not working" ) },
        "Tab": function(){ console.log( "This is not working" ) }
    };
    CodeMirror.normalizeKeyMap( keyMap.macKeyMap );
    editor.addKeyMap( keyMap.macKeyMap );    

    editor.on( 'keyHandled',function( editor, name, event ){
        console.log( 'editor KeyHandler:', name, event );
    });
    editor.on( 'catchPanelKeyDown',function( event ){
        console.log( 'catchedEvent', event );
    });

    window.addEventListener("keydown", windowKeyDown);

/************************************************************************/

function windowKeyDown(event){
    console.log('window KeyHandler:',event);
    CodeMirror.signal(editor,'catchPanelKeyDown',event);
}

[akibnavidkhan]

@Kashterion you are having extra ',' in [ { "keyCode": 0, "metaKey": true }, { "keyCode": 48 }, ];

If you use [ { "keyCode": 0, "metaKey": true }, { "keyCode": 48 } ]; you should be able to capture CMD+A(if focus is not on editable widget) and tab

[Kashterion]

@akibnavidkhan It was a typo error while copy / pasting the code here.

The problem is that we need to use workarounds for specific keypresses to make it work with CodeMirror. It would be better if we could use the native behaviour which is working for Windows.

Thanks for any further updates / informations.

[AAverin]

@akibnavidkhan what would be a correct way to capture Fn+Shift or Fn+Alt, for example, cross platform? And have a fallback for keyboards that don't have Fn key? Also, where can I find a full list of Adobe Photoshop CC hotkeys? I will need to find a combination for my panel that will not conflict with Photoshop functionality

[jardicc]

Users can set their custom keys. You can export shortcut settings as HTML file from preferences dialog. There is not everything but most of them are here.

Next shortcuts are here: https://helpx.adobe.com/photoshop/using/default-keyboard-shortcuts.html but there are not all shortcuts.

[akibnavidkhan]

@Kashterion I was able to capture tab with code provided by you. Screenshot attached What are the keypresses that need workaround in MacOS? @AAverin unfortunately Fn key can't be registered as we don't get keydown event for it(https://stackoverflow.com/questions/8279754/detect-fn-key-on-mac-using-javascript).

[ErinFinnegan]

This bug is being tracked in at least two places on Adobe's internal JIRA boards:

DVAPR-4206137 "PPro fails to send keyDown events to panels, making key handling very difficult"

CEP-1218 "[MAC-only]keyboard shortcuts that are used by the app, cannot be overridden by the panel"

I am watching both, and will report back when there's news.

[louwjlabuschagne]

Any update on this? I'm still struggling to add an event listener to keypresses in PPRO 2019 CC.

After registering the keys, I add an Event listener to the CSInterface object that never hears anything.

Has anybody got an idea how I can detect what key has been pressed?

var cs = new CSInterface();
var keyEvents = [
{
    "keyCode": 0
  }, etc.
]

cs.registerKeyEventsInterest(keyEvents);
cs.addEventListener("keydown", function(e) {
    alert("event: " + e);
  });

[ErinFinnegan]

🤔... it was moved to the 13.1 release of Premiere... which is out now. You can tell the build number from the Premiere Pro -> About Premiere menu.

Actually, the comments on DVAPR-4206137 say, "moved to 13.1 release" and then, mysteriously, "Moved to future release".

CEP-1218 is in "To Track" status.

@bbb999 ?

[bbb999]

No progress against DVAPR-4206137.

[sean256]

I'm on MacOS and can get some keys to work using registerKeyEventInterest but only if my panel has focus. Does the panel having to have focus intentional or a bug? If this is by design that seems a little silly to me.

[louwjlabuschagne]

@sean256 I've also had to go with the panel option if the panel is activate you can use window.addEventListener.

window.addEventListener("keydown", function(e) {
    alert("event: " + e);
  });

However, it would still be great if it was possible to capture keys from the host application.

[schroef]

Im not sure this is the same. But this Animators Toolbar Pro seems to be able to register keypresses The button act different with certain keycombos. Im not 100% sure this is the same as keycombos ofcourse. I think the panel only registers them when panel is active. https://youtu.be/MqJiUU07bJ8?t=259

[schroef]

I have the modifier keys working now. Im not registering anykeys, just using regular keycode from Jquery. Im new to this CEP development and think it surpasses my knowledge of code by miles. But I'm able to adjust items, add code, add functionality in a very slow pace. Now i need to get the devtool working without that error showing about document.registeCustomElement not being a function. Looks like a know bug, but i also see it in Safari.

$("#btn_newVideoGroup").click(function (event) {
            if(event.shiftKey)
                loadJSXFile("/jsx/AnimD2_newVideoGroupSelection.jsx");
            else if(event.altKey)
                loadJSXFile("/jsx/AnimD2_newVideoUngroup.jsx");
            else
                loadJSXFile("/jsx/AnimD2_newVideoGroup.jsx");
        });

[silvseyes-ntgl]

I'm on MacOS and can get some keys to work using registerKeyEventInterest but only if my panel has focus. Does the panel having to have focus intentional or a bug? If this is by design that seems a little silly to me.

Hi, can you provide an example of how to use registerKeyEventInterest? Also where does all the code go? I'm trying to use spacebar for a specific action, but not sure where to register the event and then also how do I call the event when i'm trying to call a function once the key is pressed?

In my JS file I registered the key events like this

register_key_events = function() {
   var keyEventsInterest;
   var os = 'win';
   if (os === 'win') {
      keyEventsInterest = JSON.stringify([
         {"keyCode": 32} // Spacebar
      ]);
   } else {
   // mac
      keyEventsInterest = JSON.stringify([
         {"keyCode": 49} // Spacebar
      ]);
   }
   window.__adobe_cep__.registerKeyEventsInterest(keyEventsInterest);
}

Then later in the same JS file, I'm trying to listen for the event:

window.addEventListener('keydown', (event) => {
    var key_code = event.keyCode;
    var os = 'win';
    if (os === 'win') {
        if (key_code === 32) {
        playPause();
        } //will add more else if conditions for other keys and functions
    } else {
        // mac
        if (key_code === 49) {
            playPause();
            } //will add more else if conditions for other keys and functions
    }
});

However, it doesn't seem to work in my panel. (I also tried document.addEventListener). Am I missing some piece of code somewhere?