diff --git a/src/membrane-keypad-element.ts b/src/membrane-keypad-element.ts index 0bdbbdc..e4170d6 100644 --- a/src/membrane-keypad-element.ts +++ b/src/membrane-keypad-element.ts @@ -1,8 +1,7 @@ import { customElement, html, LitElement, property, svg } from 'lit-element'; import { pinsFemalePattern } from './patterns/pins-female'; import { ElementPin } from './pin'; - -const SPACE_KEY = 32; +import { SPACE_KEYS } from './utils/keys'; const rowPositions = [10.7, 25, 39.3, 53.6]; const columnPositions = [7, 22, 37, 52]; @@ -81,9 +80,9 @@ export class MembraneKeypadElement extends LitElement { @touchstart=${() => this.down(text)} @touchend=${() => this.up(text)} @keydown=${(e: KeyboardEvent) => - e.keyCode === SPACE_KEY && this.down(text, e.currentTarget as SVGElement)} + SPACE_KEYS.includes(e.key) && this.down(text, e.currentTarget as SVGElement)} @keyup=${(e: KeyboardEvent) => - e.keyCode === SPACE_KEY && this.up(text, e.currentTarget as SVGElement)} + SPACE_KEYS.includes(e.key) && this.up(text, e.currentTarget as SVGElement)} > ${text} diff --git a/src/pushbutton-element.ts b/src/pushbutton-element.ts index 1c8be26..a047c51 100644 --- a/src/pushbutton-element.ts +++ b/src/pushbutton-element.ts @@ -1,7 +1,6 @@ import { css, customElement, html, LitElement, property } from 'lit-element'; import { ElementPin } from './pin'; - -const SPACE_KEY = 32; +import { SPACE_KEYS } from './utils/keys'; @customElement('wokwi-pushbutton') export class PushbuttonElement extends LitElement { @@ -46,8 +45,8 @@ export class PushbuttonElement extends LitElement { @mouseup=${this.up} @touchstart=${this.down} @touchend=${this.up} - @keydown=${(e: KeyboardEvent) => e.keyCode === SPACE_KEY && this.down()} - @keyup=${(e: KeyboardEvent) => e.keyCode === SPACE_KEY && this.up()} + @keydown=${(e: KeyboardEvent) => SPACE_KEYS.includes(e.key) && this.down()} + @keyup=${(e: KeyboardEvent) => SPACE_KEYS.includes(e.key) && this.up()} >