Use proper soft keyboard events
...or as close as it gets because the way input events work on mobile is awful.
This commit is contained in:
@@ -23,16 +23,63 @@ $.ready(() => {
|
||||
else input.blur()
|
||||
}
|
||||
|
||||
let lastCompositionString = '';
|
||||
let compositing = false;
|
||||
|
||||
let sendInputDelta = function (newValue) {
|
||||
let resend = false;
|
||||
if (newValue.length > lastCompositionString.length) {
|
||||
if (newValue.startsWith(lastCompositionString)) {
|
||||
// characters have been added at the end
|
||||
Input.sendString(newValue.substr(lastCompositionString.length))
|
||||
} else resend = true;
|
||||
} else if (newValue.length < lastCompositionString.length) {
|
||||
if (lastCompositionString.startsWith(newValue)) {
|
||||
// characters have been removed at the end
|
||||
Input.sendString('\b'.repeat(lastCompositionString.length -
|
||||
newValue.length))
|
||||
} else resend = true;
|
||||
} else if (newValue !== lastCompositionString) resend = true;
|
||||
|
||||
if (resend) {
|
||||
// the entire string changed; resend everything
|
||||
Input.sendString('\b'.repeat(lastCompositionString.length) +
|
||||
newValue)
|
||||
}
|
||||
lastCompositionString = newValue;
|
||||
}
|
||||
|
||||
input.addEventListener('keydown', e => {
|
||||
if (e.key === 'Backspace') {
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
Input.sendString('\b')
|
||||
if (e.key === 'Unidentified') return;
|
||||
|
||||
e.preventDefault();
|
||||
input.value = '';
|
||||
|
||||
if (e.key === 'Backspace') Input.sendString('\b')
|
||||
else if (e.key === 'Enter') Input.sendString('\x0d')
|
||||
})
|
||||
input.addEventListener('input', e => {
|
||||
e.stopPropagation();
|
||||
|
||||
if (e.isComposing) {
|
||||
sendInputDelta(e.data);
|
||||
} else {
|
||||
if (e.data) Input.sendString(e.data);
|
||||
else if (e.inputType === 'deleteContentBackward') {
|
||||
lastCompositionString
|
||||
sendInputDelta('');
|
||||
}
|
||||
}
|
||||
})
|
||||
input.addEventListener('keypress', e => {
|
||||
e.stopPropagation()
|
||||
})
|
||||
input.addEventListener('compositionstart', e => {
|
||||
lastCompositionString = '';
|
||||
compositing = true;
|
||||
});
|
||||
input.addEventListener('compositionend', e => {
|
||||
lastCompositionString = '';
|
||||
compositing = false;
|
||||
input.value = '';
|
||||
});
|
||||
|
||||
Screen.on('open-soft-keyboard', () => input.focus())
|
||||
})
|
||||
|
||||
@@ -333,9 +333,9 @@ class TermScreen {
|
||||
}
|
||||
|
||||
// schedule a draw in the next tick
|
||||
scheduleDraw () {
|
||||
scheduleDraw (aggregateTime = 1) {
|
||||
clearTimeout(this._scheduledDraw);
|
||||
this._scheduledDraw = setTimeout(() => this.draw(), 1)
|
||||
this._scheduledDraw = setTimeout(() => this.draw(), aggregateTime)
|
||||
}
|
||||
|
||||
getFont (modifiers = {}) {
|
||||
@@ -788,7 +788,7 @@ class TermScreen {
|
||||
}
|
||||
}
|
||||
|
||||
this.scheduleDraw();
|
||||
this.scheduleDraw(16);
|
||||
this.emit('load');
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user