add support for holding left click

This commit is contained in:
hippoz 2021-10-29 02:03:35 +03:00
parent 1e869c4708
commit c61bdf7435
Signed by: hippoz
GPG key ID: 7C52899193467641

View file

@ -6,6 +6,9 @@
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"> <title>Document</title> <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"> <title>Document</title>
<script> <script>
const HOLDING_THRESHOLD_MS = 175;
const SINGLE_CLICK_BUTTON_UP_MS = 5;
const loggerOfType = (components, type='log') => (...args) => { const loggerOfType = (components, type='log') => (...args) => {
let str = '%c'; let str = '%c';
const style = 'color: #5e81ac; font-weight: bold;'; const style = 'color: #5e81ac; font-weight: bold;';
@ -100,6 +103,7 @@
this.lastMoveX = 0; this.lastMoveX = 0;
this.lastMoveY = 0; this.lastMoveY = 0;
this.shouldResetLastMove = false; this.shouldResetLastMove = false;
this.isInHoldingMode = false;
this.ongoingTouches = {}; this.ongoingTouches = {};
this.log = Logger(["TouchpadController"], ["log"]).log; this.log = Logger(["TouchpadController"], ["log"]).log;
@ -107,20 +111,31 @@
this.connection = connection; this.connection = connection;
} }
getButtonCode(button) {
let buttonCode = 0;
if (button === "right") buttonCode = 1;
return buttonCode;
}
_sendRelativeMouseMovement(dx, dy) { _sendRelativeMouseMovement(dx, dy) {
if (dx === 0 && dy === 0) if (dx === 0 && dy === 0)
return; return;
this.connection.sendMessage("r", [dx, dy]); this.connection.sendMessage("r", [dx, dy]);
} }
_sendSingleClick(button="left") { _sendMouseButtonDown(button="left") {
let buttonCode = 0; this.connection.sendMessage("d", [this.getButtonCode(button)]);
if (button === "right") buttonCode = 1; }
this.connection.sendMessage("d", [buttonCode]); _sendMouseButtonUp(button="left") {
this.connection.sendMessage("u", [this.getButtonCode(button)]);
}
_sendSingleClick(button="left") {
this._sendMouseButtonDown(button);
setTimeout( setTimeout(
() =>this.connection.sendMessage("u", [buttonCode]), () => this._sendMouseButtonUp(button),
5 SINGLE_CLICK_BUTTON_UP_MS
); );
} }
@ -154,9 +169,17 @@
onTouchEnd({ changedTouches }) { onTouchEnd({ changedTouches }) {
this.shouldResetLastMove = true; this.shouldResetLastMove = true;
// A single tap = left click if (changedTouches.length === 1) {
if (changedTouches.length === 1 && !this.ongoingTouches[changedTouches[0].identifier].hasMoved) // This is a single tap - left click
if (!this.ongoingTouches[changedTouches[0].identifier].hasMoved) {
this._sendSingleClick("left"); this._sendSingleClick("left");
// We were in "holding mode" and now that touch event has ended,
// thus we have to stop holding the left click button
} else if (this.isInHoldingMode) {
this._sendMouseButtonUp("left");
this.isInHoldingMode = false;
}
}
for (let i = 0; i < changedTouches.length; i++) { for (let i = 0; i < changedTouches.length; i++) {
const touch = changedTouches[i]; const touch = changedTouches[i];
this.ongoingTouches[touch.identifier] = null; this.ongoingTouches[touch.identifier] = null;
@ -173,6 +196,16 @@
clientY: touch.clientY, clientY: touch.clientY,
hasMoved: false hasMoved: false
}; };
// If the touch is still unmoved and held for a certain amount of time,
// we will enter "holding mode" which keeps the mouse button held while dragging
// allowing you to, for example, select text or drag a scrollbar
setTimeout(() => {
if (this.ongoingTouches[touch.identifier] && !this.ongoingTouches[touch.identifier].hasMoved) {
this.isInHoldingMode = true;
this._sendMouseButtonDown("left");
}
}, HOLDING_THRESHOLD_MS);
} }
} }
} }