Readonly
classesReadonly
enabledWhether the key is enabled.
If it's disabled, checking if "pressed" can be set to true will return an error. Also the manager will not manage the key's state so it will never be set to pressed (and therefore it will not trigger any shortcuts, even though shortcuts can use disabled keys).
Useful for preventing the Meta/Super key from being pressed, but still showing a key.
Readonly
heightThe height of the key. See Keys.layout.
Readonly
idThe id used to identify which key was pressed.
For keyboard keys, this should be KeyboardEvent.code.
For mouse buttons, this should be MouseEvent.button, i.e. 0-5
.
For scroll wheel up/down, pass the custom WheelUp
and WheelDown
.
For modifiers, see Keys.variants. for how to handle them as the same key, otherwise they are handled like different keys.
For toggles, pass the key code like normal (e.g. CapsLock
), see Key.isToggle for how to implement toggles.
Changing the id is not supported. It's recommended you just create a new key if you happen to expose changing key options to users. You can then attempt to change all shortcuts to the new key (note you will have to find the toggles as well if they were created) and report back any errors to users (e.g. changing from/to a modifier can render shortcut chords invalid).
Readonly
isWhether the key is a modifier. A modifier can be either "native"
(event.getModifierState will always be used on all events to get it's true state) or "emulated"
.
For both, this determines in the manager when a chord is considered to have been pressed (when it contains a non-modifer key). See Manager.
Control
not ControlLeft/Right
Readonly
labelThe preferred human readable version of a key. Used when stringifying it.
Readonly
pressedWether the key is currently being held down.
Keys presses can be emulated for testing using the Emulator.
Readonly
renderWhether the key should be rendered. See Keys.layout.
Toggle on/off keys are automatically created with this set to false.
See Manager.options.updateStateOnAllEvents. Only has an effect if the key is a modifier or toggle key.
Readonly
variantsVariants are a list of fallback codes that will also trigger a key.
For example, without variants, there's no way to have native modifier keys or have a shortcut like [[Ctrl, A]]
where Ctrl can be either of the right/lefts Ctrl keys. One could create two shortcuts for both keys, but only one key would be considered triggered at a time on the layout.
Variants can solve this by allowing us to create a key that's only labeled as Ctrl
. The id
can be set to an invalid key code (we still need an id for the Keys class), preferably one that indicates what's happening (e.g. VirtualCtrl
). The variants can be set to ["ControlLeft", "ControlRight", "Control"]
. Now you can have shortcuts like [[VirtualCtrl, A]]
and either control key will trigger them.
const virtualCtrl = new Key("VirtualCtrl" {label: "Ctrl", variants: ["ControlLeft", "ControlRight", "Control"] })
If you still need the keys to be labeled or styled different, you can register multiple keys with different invalid ids but the same variants.
// different labels for the layout
const virtualCtrl = new Key("VirtualCtrl" {label: "Ctrl Left", variants: ["ControlLeft", "ControlRight", "Control"] })
const virtualCtrl2 = new Key("VirtualCtrl2" {label: "Ctrl Right", variants: ["ControlLeft", "ControlRight", "Control"] })
// same labels, different sizes
const virtualCtrl = new Key("VirtualCtrl"
{ label: "Ctrl", variants: ["ControlLeft", "ControlRight", "Control"], layout: {width: 1.5} },
)
const virtualCtrl2 = new Key("VirtualCtrl2"
{ label: "Ctrl", variants: ["ControlLeft", "ControlRight", "Control"], layout: {width: 2}},
)
They can also be use to treat any set of keys as the exact same keys. This can be useful for allowing users to remap keys only within the application.
For example, to use CapsLock as an extra Control key (e.g. id: Ctrl, variants: ["ControlLeft", "ControlRight", "Control", "Capslock"]
). You could even "remap" it to multiple modifiers, just add "Capslock" to the variants list of those modifiers (e.g. Ctrl, Alt, Shift). This would cause all those keys to be considered pressed when Capslock is pressed.
Readonly
widthThe width of the key. See Keys.layout.
Readonly
xThe x position of the key. See Keys.layout.
Readonly
yThe y position of the key. See Keys.layout.
A list of css classes the key should be rendered with.