Keyboard

Keyboard enables creating keyboard shortcuts in your JointJS+ application.

Learn more about the Keyboard plugin.

constructor

constructor(opt?: Keyboard.Options);

The ui.Keyboard constructor accepts the following parameters:

filter

[optional] Prevent keyboard events from triggering. The callback will be invoked whenever the keyboard DOM event is fired. If the function returns false, the keyboard event will not be fired. The default filter is isConsumerElement().

Methods

on()

keyboard.on(evt: string | object, callback?: ((evt: dia.Event) => void) | any, context?: any): this;

Bind a callback function to an object. The callback will be invoked whenever the keyboard evt is fired. It is the same logic as mvc.Events.on. More information about event can be found in the Event description section.

off()

keyboard.off(evt: string | object, callback?: ((evt: dia.Event) => void) | any, context?: any): this;

Remove a previously-bound callback function from an object. It is the same logic as mvc.Events.off. More information about evt can be found in the Event description section.

enable()

keyboard.enable(): void;

Start tracking keyboard events (enabled by default).

disable()

keyboard.disable(): void;

Stop tracking keyboard events.

isActive()

keyboard.isActive(name: string, evt: Keyboard.Event): boolean;

Check if key name is currently pressed. event is the DOM Event KeyboardEvent. It is available for modifiers only

• alt, ctrl, shift, command.

isKeyPrintable()

keyboard.isKeyPrintable(evt: Keyboard.Event): boolean;

Check if the key pressed is a printable character. event is the DOM Event KeyboardEvent.

isConsumerElement()

keyboard.isConsumerElement(evt: Keyboard.Event): boolean;

Checks if the element onto which the event was dispatched should consume this event and thus prevent the ui.Keyboard event from firing. event is the DOM Event KeyboardEvent. The method returns true for inputs, selects, text-areas, and elements defined as content-editable.

Types

Options

interface Options {
    filter?: (evt: dia.Event, keyboard: Keyboard) => boolean;
}