Separate keyboard shortcuts for canvas and selected elements

Developers Modeler
1

I have overrided the BpmnKeyboardBindings to allow my own custom keyboard shortcut actions.

Currently the keyboard shortcuts work canvas wide as normal.

Can we have a separate keyboard shortcut actions for canvas wide and when an element is selected?

For example if i press ‘e’ with no element selected then ‘action 1’ happens but if i select an element and press ‘e’ then ‘action 2’ happens?

2

You have full control over how to interpret a key stroke.

If you intend to implement such a shortcut, simply check if an element is selected before deciding what to do in your BpmnKeyboardBindings override:

function MyCustomKeyboardBindings(selection, keyboard) {

  // contextual activate
  // E
  keyboard.addListener(function(context) {

    var event = context.keyEvent;

    if (selection.get().length) {
      // do this
    } else {
      // do that;
    }

    // indicate we handled the key stroke
    return true;
  });
}
2 Likes
3

What is the correct procedure to pass the selection value to that file?

My CustomKeyboard file is

import KeyboardBindings from 'playbooks-bpmn-js/lib/features/keyboard/BpmnKeyboardBindings';


export default class CustomKeyboard extends KeyboardBindings {
  constructor(injector) {
    super(injector);

    injector.invoke(KeyboardBindings, this);
  }

  public registerBindings(keyboard, editorActions, eventBus) {
    // (1) register another listener with a higher priority so it's called first
    keyboard.addListener(10000, context => {
      const event = context.keyEvent;


      if (keyboard.isKey(['e'], event)) {
        console.log('E WAS PRESSED');
      }
      
    });
  }
}

and my additionalModules is:

 additionalModules: [
        {
          __init__: ['customKeyboard'],
          customKeyboard: ['type', CustomKeyboard],
        },
      ],