add support for holding left click
This commit is contained in:
parent
1e869c4708
commit
c61bdf7435
1 changed files with 42 additions and 9 deletions
|
@ -6,6 +6,9 @@
|
|||
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"> <title>Document</title>
|
||||
|
||||
<script>
|
||||
const HOLDING_THRESHOLD_MS = 175;
|
||||
const SINGLE_CLICK_BUTTON_UP_MS = 5;
|
||||
|
||||
const loggerOfType = (components, type='log') => (...args) => {
|
||||
let str = '%c';
|
||||
const style = 'color: #5e81ac; font-weight: bold;';
|
||||
|
@ -100,6 +103,7 @@
|
|||
this.lastMoveX = 0;
|
||||
this.lastMoveY = 0;
|
||||
this.shouldResetLastMove = false;
|
||||
this.isInHoldingMode = false;
|
||||
this.ongoingTouches = {};
|
||||
|
||||
this.log = Logger(["TouchpadController"], ["log"]).log;
|
||||
|
@ -107,20 +111,31 @@
|
|||
this.connection = connection;
|
||||
}
|
||||
|
||||
getButtonCode(button) {
|
||||
let buttonCode = 0;
|
||||
if (button === "right") buttonCode = 1;
|
||||
return buttonCode;
|
||||
}
|
||||
|
||||
_sendRelativeMouseMovement(dx, dy) {
|
||||
if (dx === 0 && dy === 0)
|
||||
return;
|
||||
this.connection.sendMessage("r", [dx, dy]);
|
||||
}
|
||||
|
||||
_sendSingleClick(button="left") {
|
||||
let buttonCode = 0;
|
||||
if (button === "right") buttonCode = 1;
|
||||
_sendMouseButtonDown(button="left") {
|
||||
this.connection.sendMessage("d", [this.getButtonCode(button)]);
|
||||
}
|
||||
|
||||
this.connection.sendMessage("d", [buttonCode]);
|
||||
_sendMouseButtonUp(button="left") {
|
||||
this.connection.sendMessage("u", [this.getButtonCode(button)]);
|
||||
}
|
||||
|
||||
_sendSingleClick(button="left") {
|
||||
this._sendMouseButtonDown(button);
|
||||
setTimeout(
|
||||
() =>this.connection.sendMessage("u", [buttonCode]),
|
||||
5
|
||||
() => this._sendMouseButtonUp(button),
|
||||
SINGLE_CLICK_BUTTON_UP_MS
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -154,9 +169,17 @@
|
|||
|
||||
onTouchEnd({ changedTouches }) {
|
||||
this.shouldResetLastMove = true;
|
||||
// A single tap = left click
|
||||
if (changedTouches.length === 1 && !this.ongoingTouches[changedTouches[0].identifier].hasMoved)
|
||||
if (changedTouches.length === 1) {
|
||||
// This is a single tap - left click
|
||||
if (!this.ongoingTouches[changedTouches[0].identifier].hasMoved) {
|
||||
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++) {
|
||||
const touch = changedTouches[i];
|
||||
this.ongoingTouches[touch.identifier] = null;
|
||||
|
@ -173,6 +196,16 @@
|
|||
clientY: touch.clientY,
|
||||
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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue