Fix mobile keyboard: remove readonly, use inputmode only
This commit is contained in:
@@ -165,7 +165,7 @@
|
|||||||
}
|
}
|
||||||
})();
|
})();
|
||||||
|
|
||||||
// Mobile keyboard control: prevent keyboard on every tap, add toggle button
|
// Mobile keyboard control: toggle button to show/hide virtual keyboard
|
||||||
(function() {
|
(function() {
|
||||||
if (!("ontouchstart" in window)) return;
|
if (!("ontouchstart" in window)) return;
|
||||||
|
|
||||||
@@ -178,52 +178,61 @@
|
|||||||
btn.style.cssText = "position:fixed;bottom:12px;right:12px;z-index:9999;" +
|
btn.style.cssText = "position:fixed;bottom:12px;right:12px;z-index:9999;" +
|
||||||
"width:44px;height:44px;border-radius:50%;background:rgba(94,11,167,0.85);" +
|
"width:44px;height:44px;border-radius:50%;background:rgba(94,11,167,0.85);" +
|
||||||
"color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;" +
|
"color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;" +
|
||||||
"cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,0.4);user-select:none;";
|
"cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,0.4);user-select:none;" +
|
||||||
|
"-webkit-tap-highlight-color:transparent;";
|
||||||
document.addEventListener("DOMContentLoaded", function() {
|
document.addEventListener("DOMContentLoaded", function() {
|
||||||
document.body.appendChild(btn);
|
document.body.appendChild(btn);
|
||||||
});
|
});
|
||||||
|
|
||||||
function setKeyboard(open) {
|
function getTA() {
|
||||||
kbOpen = open;
|
return document.querySelector(".xterm-helper-textarea");
|
||||||
var ta = document.querySelector(".xterm-helper-textarea");
|
}
|
||||||
if (!ta) return;
|
|
||||||
if (open) {
|
function openKeyboard() {
|
||||||
ta.removeAttribute("readonly");
|
kbOpen = true;
|
||||||
|
var ta = getTA();
|
||||||
|
if (ta) {
|
||||||
ta.setAttribute("inputmode", "text");
|
ta.setAttribute("inputmode", "text");
|
||||||
ta.focus();
|
ta.focus();
|
||||||
btn.style.background = "rgba(0,204,0,0.85)";
|
|
||||||
} else {
|
|
||||||
ta.setAttribute("inputmode", "none");
|
|
||||||
ta.setAttribute("readonly", "readonly");
|
|
||||||
ta.blur();
|
|
||||||
btn.style.background = "rgba(94,11,167,0.85)";
|
|
||||||
}
|
}
|
||||||
|
btn.style.background = "rgba(0,204,0,0.85)";
|
||||||
|
btn.textContent = "✕";
|
||||||
|
}
|
||||||
|
|
||||||
|
function closeKeyboard() {
|
||||||
|
kbOpen = false;
|
||||||
|
var ta = getTA();
|
||||||
|
if (ta) {
|
||||||
|
ta.setAttribute("inputmode", "none");
|
||||||
|
ta.blur();
|
||||||
|
}
|
||||||
|
btn.style.background = "rgba(94,11,167,0.85)";
|
||||||
|
btn.textContent = "⌨";
|
||||||
}
|
}
|
||||||
|
|
||||||
btn.addEventListener("click", function(e) {
|
btn.addEventListener("click", function(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
setKeyboard(!kbOpen);
|
if (kbOpen) closeKeyboard(); else openKeyboard();
|
||||||
});
|
});
|
||||||
|
|
||||||
// Block xterm from auto-focusing its textarea on touch
|
// Prevent keyboard from auto-opening on every tap
|
||||||
document.addEventListener("touchend", function(e) {
|
document.addEventListener("touchend", function(e) {
|
||||||
if (e.target === btn || btn.contains(e.target)) return;
|
if (e.target === btn || btn.contains(e.target)) return;
|
||||||
if (kbOpen) return; // user wants keyboard open
|
if (kbOpen) return;
|
||||||
setTimeout(function() {
|
setTimeout(function() {
|
||||||
var active = document.activeElement;
|
var active = document.activeElement;
|
||||||
if (active && active.classList && active.classList.contains("xterm-helper-textarea")) {
|
if (active && active.classList && active.classList.contains("xterm-helper-textarea")) {
|
||||||
active.blur();
|
active.blur();
|
||||||
}
|
}
|
||||||
}, 50);
|
}, 30);
|
||||||
}, { passive: true });
|
}, { passive: true });
|
||||||
|
|
||||||
// Disable keyboard on xterm textarea once it appears
|
// Set inputmode=none on xterm textarea once it appears (prevent initial keyboard)
|
||||||
var checkReady = setInterval(function() {
|
var checkReady = setInterval(function() {
|
||||||
var ta = document.querySelector(".xterm-helper-textarea");
|
var ta = getTA();
|
||||||
if (ta) {
|
if (ta) {
|
||||||
clearInterval(checkReady);
|
clearInterval(checkReady);
|
||||||
ta.setAttribute("readonly", "readonly");
|
|
||||||
ta.setAttribute("inputmode", "none");
|
ta.setAttribute("inputmode", "none");
|
||||||
}
|
}
|
||||||
}, 200);
|
}, 200);
|
||||||
|
|||||||
Reference in New Issue
Block a user