Automatically focus input when typing into nothing

This commit is contained in:
Pavel Djundik 2018-03-13 10:32:15 +02:00
parent 44b9597981
commit b6cde34a08
2 changed files with 64 additions and 4 deletions

View file

@ -108,7 +108,7 @@ const colorsHotkeys = {
for (const hotkey in colorsHotkeys) {
Mousetrap.bind("mod+" + hotkey, function(e) {
// Do not handle modifier hotkeys if input is not focused
if (document.activeElement !== input[0]) {
if (document.activeElement !== input) {
return;
}
@ -119,3 +119,66 @@ for (const hotkey in colorsHotkeys) {
wrapCursor(input, modifier, input.selectionStart === input.selectionEnd ? "" : modifier);
});
}
// Ignored keys which should not automatically focus the input bar
const ignoredKeys = {
8: true, // Backspace
9: true, // Tab
12: true, // Clear
16: true, // Shift
17: true, // Control
18: true, // Alt
19: true, // Pause
20: true, // CapsLock
27: true, // Escape
33: true, // PageUp
34: true, // PageDown
35: true, // End
36: true, // Home
37: true, // ArrowLeft
38: true, // ArrowUp
39: true, // ArrowRight
40: true, // ArrowDown
45: true, // Insert
46: true, // Delete
112: true, // F1
113: true, // F2
114: true, // F3
115: true, // F4
116: true, // F5
117: true, // F6
118: true, // F7
119: true, // F8
120: true, // F9
121: true, // F10
122: true, // F11
123: true, // F12
144: true, // NumLock
145: true, // ScrollLock
224: true, // Meta
};
if (!("ontouchstart" in window || navigator.maxTouchPoints > 0)) {
$(document.body).on("keydown", (e) => {
// Ignore if target isn't body (e.g. focused into input)
// Ignore any key that uses alt modifier
// Ignore keys defined above
if (e.target !== document.body || e.altKey || ignoredKeys[e.which]) {
return;
}
// Ignore all ctrl keys except for ctrl+v to allow pasting
if ((e.ctrlKey || e.metaKey) && e.which !== 86) {
return;
}
// On enter, focus the input but do not propagate the event
// This way, a new line is not inserted
if (e.which === 13) {
input.trigger("focus");
return false;
}
input.trigger("focus");
});
}

View file

@ -5,7 +5,6 @@ const options = require("./options");
const socket = require("./socket");
const templates = require("../views");
const chat = $("#chat");
const input = $("#input");
const Mousetrap = require("mousetrap");
module.exports = renderPreview;
@ -207,8 +206,6 @@ function closeImageViewer({pushState = true} = {}) {
imageViewer.empty();
});
input.trigger("focus");
// History management
if (pushState) {
const clickTarget =