diff --git a/src/lib/components/Keyboard.css b/src/lib/components/Keyboard.css index 1ac92d2d..3d5555dd 100644 --- a/src/lib/components/Keyboard.css +++ b/src/lib/components/Keyboard.css @@ -66,7 +66,7 @@ html { font-size: inherit; } -.simple-keyboard.hg-theme-default .hg-button:active { +.simple-keyboard.hg-theme-default:not(.hg-touch-events) .hg-button:active { background: #e4e4e4; } diff --git a/src/lib/components/Keyboard.js b/src/lib/components/Keyboard.js index 05d47233..b951f301 100644 --- a/src/lib/components/Keyboard.js +++ b/src/lib/components/Keyboard.js @@ -61,6 +61,8 @@ class SimpleKeyboard { * @property {boolean} useButtonTag Render buttons as a button element instead of a div element. * @property {boolean} disableCaretPositioning A prop to ensure characters are always be added/removed at the end of the string. * @property {object} inputPattern Restrains input(s) change to the defined regular expression pattern. + * @property {boolean} useTouchEvents Instructs simple-keyboard to use touch events instead of click events. + * @property {boolean} autoUseTouchEvents Enable useTouchEvents automatically when touch device is detected. */ this.options = options; this.options.layoutName = this.options.layoutName || "default"; @@ -618,6 +620,20 @@ class SimpleKeyboard { }); } + + /** + * Process autoTouchEvents option + */ + processAutoTouchEvents(){ + if (this.options.autoUseTouchEvents){ + this.options.useTouchEvents = true; + + if (this.options.debug) { + console.log(`autoUseTouchEvents: Touch device detected, useTouchEvents enabled.`); + } + } + } + /** * Executes the callback function once simple-keyboard is rendered for the first time (on initialization). */