shukivaknin/gniza4linux
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix touch scroll: dispatch wheel events to xterm canvas for page scrolling

Browse Source 
Target the xterm canvas element with WheelEvent including proper
clientX/clientY coordinates so xterm.js forwards scroll events to
the Textual app for container-level scrolling.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
shuki
2026-03-07 01:22:24 +02:00
parent 3b605807cd
commit 2b6a58f9df
1 changed files with 17 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
tui/web_templates/app_index.html
View File

@@ -164,11 +164,11 @@
} }
})(); })();
// Touch-to-scroll: translate swipe gestures into key events for Textual // Touch-to-scroll: translate swipe into mouse wheel for Textual scrollable containers
(function() { (function() {
var touchStartY = null; var touchStartY = null;
var accumDY = 0; var accumDY = 0;
var STEP = 20; // pixels per scroll step var STEP = 10;
document.addEventListener("touchstart", function(e) { document.addEventListener("touchstart", function(e) {
if (e.touches.length === 1) { if (e.touches.length === 1) {
@@ -185,14 +185,23 @@
accumDY += touchStartY - currentY; accumDY += touchStartY - currentY;
touchStartY = currentY; touchStartY = currentY;
var textarea = document.querySelector(".xterm-helper-textarea"); // Find the xterm canvas to dispatch wheel events on
if (!textarea) return; var canvas = document.querySelector(".xterm-screen canvas") ||
document.querySelector(".xterm-screen") ||
document.querySelector("#terminal");
if (!canvas) return;
while (Math.abs(accumDY) >= STEP) { while (Math.abs(accumDY) >= STEP) {
var key = accumDY > 0 ? "ArrowDown" : "ArrowUp"; var delta = accumDY > 0 ? 60 : -60;
textarea.dispatchEvent(new KeyboardEvent("keydown", { canvas.dispatchEvent(new WheelEvent("wheel", {
key: key, code: key, keyCode: key === "ArrowDown" ? 40 : 38, deltaY: delta,
bubbles: true, cancelable: true deltaX: 0,
deltaMode: 0,
clientX: canvas.getBoundingClientRect().width / 2,
clientY: canvas.getBoundingClientRect().height / 2,
bubbles: true,
cancelable: true,
composed: true
})); }));
accumDY -= (accumDY > 0 ? STEP : -STEP); accumDY -= (accumDY > 0 ? STEP : -STEP);
} }