@maxgraph/core
    Preparing search index...

    Class KeyHandler

    Event handler that listens to keystroke events. This is not a singleton, however, it is normally only required once if the target is the document element (default).

    This handler installs a key event listener in the topmost DOM node and processes all events that originate from descandants of Graph#container or from the topmost DOM node. The latter means that all unhandled keystrokes are handled by this object regardless of the focused state of the .

    Example:

    The following example creates a key handler that listens to the delete key (46) and deletes the selection cells if the graph is enabled.

    let keyHandler = new KeyHandler(graph);
    keyHandler.bindKey(46, (evt)=>
    {
      if (graph.isEnabled())
      {
        graph.removeCells();
      }
    });

    Keycodes:

    See http://tinyurl.com/yp8jgl or http://tinyurl.com/229yqw for a list of keycodes or install a key event listener into the document element and print the key codes of the respective events to the console.

    To support the Command key and the Control key on the Mac, the following code can be used.

    keyHandler.getFunction = (evt)=>
    {
      if (evt != null)
      {
        return (mxEvent.isControlDown(evt) || (Client.IS_MAC && evt.metaKey)) ? this.controlKeys[evt.keyCode] : this.normalKeys[evt.keyCode];
      }

      return null;
    };

    Constructor: KeyHandler

    Constructs an event handler that executes functions bound to specific keystrokes.

    Reference to the associated Graph.

    Optional reference to the event target. If null, the document element is used as the event target, that is, the object where the key event listener is installed.

    Index

    Constructors

    constructor

    Properties

    controlKeys controlShiftKeys enabled graph keydownHandler normalKeys shiftKeys target

    Methods

    bindControlKey bindControlShiftKey bindKey bindShiftKey escape getFunction isControlDown isEnabled isEnabledForEvent isEventIgnored isGraphEvent keyDown onDestroy setEnabled

    Constructors

    Properties

    controlKeys: { [key: number]: Function } = {}

    Maps from keycodes to functions for pressed control keys.

    controlShiftKeys: { [key: number]: Function } = {}

    Maps from keycodes to functions for pressed control and shift keys.

    enabled: boolean = true

    Specifies if events are handled. Default is true.

    graph: null | Graph = null

    Reference to the Graph associated with this handler.

    keydownHandler: null | ((event: KeyboardEvent) => void) = null
    normalKeys: { [key: number]: Function } = {}

    Maps from keycodes to functions for non-pressed control keys.

    shiftKeys: { [key: number]: Function } = {}

    Maps from keycodes to functions for pressed shift keys.

    target: null | Element = null

    Reference to the target DOM, that is, the DOM node where the key event listeners are installed.

    Methods

    • Binds the specified keycode to the given function. This binding is used if the control key is pressed.

      Parameters

      • code: number

        Integer that specifies the keycode.

      • funct: Function

        JavaScript function that takes the key event as an argument.

      Returns void

    • Binds the specified keycode to the given function. This binding is used if the control and shift key are pressed.

      Parameters

      • code: number

        Integer that specifies the keycode.

      • funct: Function

        JavaScript function that takes the key event as an argument.

      Returns void

    • Binds the specified keycode to the given function. This binding is used if the control key is not pressed.

      Parameters

      • code: number

        Integer that specifies the keycode.

      • funct: Function

        JavaScript function that takes the key event as an argument.

      Returns void

    • Binds the specified keycode to the given function. This binding is used if the shift key is pressed.

      Parameters

      • code: number

        Integer that specifies the keycode.

      • funct: Function

        JavaScript function that takes the key event as an argument.

      Returns void

    • Hook to process ESCAPE keystrokes. This implementation invokes Graph#stopEditing to cancel the current editing, connecting and/or other ongoing modifications.

      Parameters

      • evt: KeyboardEvent

        Key event that represents the keystroke. Possible keycode in this case is 27 (ESCAPE).

      Returns void

    • Returns the function associated with the given key event or null if no function is associated with the given event.

      Parameters

      • evt: KeyboardEvent

        Key event whose associated function should be returned.

      Returns null | Function

    • Returns true if the control key is pressed. This uses Event#isControlDown.

      Parameters

      • evt: KeyboardEvent

        Key event whose control key pressed state should be returned.

      Returns boolean

    • Returns true if the given event should be handled. is called later if the event is not an escape key stroke, in which case is called. This implementation returns true if returns true for both, this handler and , if the event is not consumed and if returns true.

      Parameters

      • evt: KeyboardEvent

        Key event that represents the keystroke.

      Returns boolean

    • Returns true if the given keystroke should be ignored. This returns graph.isEditing().

      Parameters

      • evt: KeyboardEvent

        Key event that represents the keystroke.

      Returns boolean

    • Returns true if the event should be processed by this handler, that is, if the event source is either the target, one of its direct children, a descendant of the Graph#container, or the Graph#cellEditor of the .

      Parameters

      • evt: KeyboardEvent

        Key event that represents the keystroke.

      Returns boolean

    • Handles the event by invoking the function bound to the respective keystroke if returns true for the given event and if returns false, except for escape for which is not invoked.

      Parameters

      • evt: KeyboardEvent

        Key event that represents the keystroke.

      Returns void

    • Destroys the handler and all its references into the DOM. This does normally not need to be called, it is called automatically when the window unloads (in IE).

      Returns void

    • Enables or disables event handling by updating .

      Parameters

      • enabled: boolean

        Boolean that specifies the new enabled state.

      Returns void

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods