diff --git a/js/lib/keymaster.js b/js/lib/keymaster.js index 0f33d44..5c8c7a6 100644 --- a/js/lib/keymaster.js +++ b/js/lib/keymaster.js @@ -277,7 +277,8 @@ }; // set the handlers globally on document - addEvent(document, 'keydown', function(event) { dispatch(event) }); // Passing _scope to a callback to ensure it remains the same by execution. Fixes #48 + // Disabled for ESPTerm: + // addEvent(document, 'keydown', function(event) { dispatch(event) }); // Passing _scope to a callback to ensure it remains the same by execution. Fixes #48 addEvent(document, 'keyup', clearModifier); // reset modifiers to false whenever the window is (re)focused. @@ -305,6 +306,9 @@ global.key.noConflict = noConflict; global.key.unbind = unbindKey; + // Added for ESPTerm: + global.key.dispatch = dispatch; + if(typeof module !== 'undefined') module.exports = assignKey; })(window); diff --git a/js/soft_keyboard.js b/js/soft_keyboard.js index 7921e5d..633f890 100644 --- a/js/soft_keyboard.js +++ b/js/soft_keyboard.js @@ -2,6 +2,15 @@ window.initSoftKeyboard = function (screen, input) { const keyInput = qs('#softkb-input') if (!keyInput) return // abort, we're not on the terminal page + document.addEventListener('paste', e => { + e.preventDefault() + console.log('document paste', e) + }) + keyInput.addEventListener('paste', e => { + e.preventDefault() + console.log('keyInput paste', e) + }) + let keyboardOpen = false // moves the input to where the cursor is on the canvas. @@ -59,18 +68,19 @@ window.initSoftKeyboard = function (screen, input) { lastCompositionString = newValue } + // override keymaster filter to include keyInput + let originalFilter = key.filter + key.filter = function (event) { + if (event.target === keyInput) return true + return originalFilter(event) + } + keyInput.addEventListener('keydown', e => { if (e.key === 'Unidentified') return keyInput.value = '' - if (e.key === 'Backspace') { - e.preventDefault() - input.sendString('\b') - } else if (e.key === 'Enter') { - e.preventDefault() - input.sendString('\x0d') - } + key.dispatch(e) }) keyInput.addEventListener('keypress', e => { @@ -106,4 +116,16 @@ window.initSoftKeyboard = function (screen, input) { }) screen.on('open-soft-keyboard', () => keyInput.focus()) + screen.canvas.addEventListener('mouseup', e => { + if (document.activeElement !== keyInput) keyInput.focus() + }) + + keyInput.addEventListener('focus', () => { + qs('#screen').classList.add('focused') + screen.window.focused = true + }) + keyInput.addEventListener('blur', () => { + qs('#screen').classList.remove('focused') + screen.window.focused = false + }) } diff --git a/js/term_input.js b/js/term_input.js index 2199f7e..4adfa00 100644 --- a/js/term_input.js +++ b/js/term_input.js @@ -144,6 +144,7 @@ window.Input = function (conn) { function initKeys ({ allFn }) { // This takes care of text characters typed window.addEventListener('keypress', function (evt) { + return if (cfg.no_keys) return let str = '' if (evt.key) str = evt.key diff --git a/js/term_screen.js b/js/term_screen.js index 44d87d6..72937fb 100644 --- a/js/term_screen.js +++ b/js/term_screen.js @@ -117,13 +117,14 @@ window.TermScreen = class TermScreen extends EventEmitter { fitIntoHeight: 0, debug: false, graphics: 0, - statusScreen: null + statusScreen: null, + focused: false } // scaling caused by fitIntoWidth/fitIntoHeight this._windowScale = 1 - // properties of this.window that require updating size and redrawing + // properties of this.window that change the size (used for diffing) this.windowState = { width: 0, height: 0, @@ -907,7 +908,8 @@ window.TermScreen = class TermScreen extends EventEmitter { devicePixelRatio, gridScaleX, gridScaleY, - statusScreen + statusScreen, + focused } = this.window if (statusScreen) { @@ -946,7 +948,7 @@ window.TermScreen = class TermScreen extends EventEmitter { let isCursor = !this.cursor.hanging && this.cursor.x === x && this.cursor.y === y && - this.cursor.blinkOn && + (this.cursor.blinkOn || !focused) && this.cursor.visible let wasCursor = x === this.drawnCursor[0] && y === this.drawnCursor[1] @@ -974,7 +976,8 @@ window.TermScreen = class TermScreen extends EventEmitter { bg !== this.drawnScreenBG[cell] || attrs !== this.drawnScreenAttrs[cell] || isCursor !== wasCursor || - (isCursor && this.cursor.style !== this.drawnCursor[2]) + (isCursor && this.cursor.style !== this.drawnCursor[2]) || + (isCursor && !focused) // hack to ensure cursor is redrawn when blurred. Side effect: will always redraw when blurred let font = attrs & FONT_MASK if (!fontGroups.has(font)) fontGroups.set(font, []) @@ -1086,7 +1089,24 @@ window.TermScreen = class TermScreen extends EventEmitter { if (isCursor && !inSelection) { ctx.save() ctx.beginPath() - if (this.cursor.style === 'block') { + if (!focused) { + let left = x * cellWidth + let top = y * cellHeight + let right = (x + 1) * cellWidth + let bottom = (y + 1) * cellHeight + // draw a rect clockwise + ctx.moveTo(left, top) + ctx.lineTo(right, top) + ctx.lineTo(right, bottom) + ctx.lineTo(left, bottom) + ctx.lineTo(left, top) + // draw another smaller rect counter-clockwise to subtract + ctx.moveTo(left + 2, top + 2) + ctx.lineTo(left + 2, bottom - 2) + ctx.lineTo(right - 2, bottom - 2) + ctx.lineTo(right - 2, top + 2) + ctx.lineTo(left + 2, top + 2) + } else if (this.cursor.style === 'block') { // block ctx.rect(x * cellWidth, y * cellHeight, cellWidth, cellHeight) } else if (this.cursor.style === 'bar') { diff --git a/sass/pages/_term.scss b/sass/pages/_term.scss index bb781c9..a11ef32 100755 --- a/sass/pages/_term.scss +++ b/sass/pages/_term.scss @@ -20,17 +20,21 @@ body.term { background: #111213; padding: 6px; display: inline-block; - border: 2px solid #3983CD; + border: 2px solid #224364; position: relative; line-height: 0; + @include noselect(); + cursor: default; canvas.selectable { cursor: text; } - @include noselect(); + &.focused { + border-color: #3983CD; + } // Dummy input field used to open soft keyboard #softkb-input {