hippoz/capybara
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

add experimental scrolling

Browse source
This commit is contained in:
hippoz 2021-10-29 04:11:15 +03:00
parent c61bdf7435
commit 248216891b
No known key found for this signature in database
GPG key ID: 7C52899193467641
2 changed files with 55 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
capybara
View file

@ -51,6 +51,11 @@ class InputController():
"x": "int",
"y": "int"
})
# Mouse relative scroll
self.parser.add_handler("s", {
"x": "int",
"y": "int"
})
# Mouse button down
self.parser.add_handler("d", {
"button": "int"
@ -82,6 +87,9 @@ class InputController():
elif code == "u":
print("u", args["button"])
self.mouse_controller.release(self.button_code_to_object(args["button"]))
elif code == "s":
print("s", args["x"], args["y"])
self.mouse_controller.scroll(args["x"], args["y"])
else:
print("got invalid code from parser (is this a bug with the MessageParser?)")
return False

60
public/index.html
View file

@ -6,8 +6,10 @@
<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 HOLDING_THRESHOLD_MS = 300;
const SINGLE_CLICK_BUTTON_UP_MS = 5;
const SCROLL_X_THRESHOLD = 50;
const SCROLL_Y_THRESHOLD = 5;
const loggerOfType = (components, type='log') => (...args) => {
let str = '%c';
@ -102,9 +104,12 @@
this.currentMoveY = 0;
this.lastMoveX = 0;
this.lastMoveY = 0;
this.scrollXSum = 0;
this.scrollYSum = 0;
this.shouldResetLastMove = false;
this.isInHoldingMode = false;
this.ongoingTouches = {};
this.holdModeTimeout = null;
this.log = Logger(["TouchpadController"], ["log"]).log;
@ -123,6 +128,12 @@
this.connection.sendMessage("r", [dx, dy]);
}
_sendRelativeMouseScroll(dx, dy) {
if (dx === 0 && dy === 0)
return;
this.connection.sendMessage("s", [dx, dy]);
}
_sendMouseButtonDown(button="left") {
this.connection.sendMessage("d", [this.getButtonCode(button)]);
}
@ -146,8 +157,10 @@
}
onTouchMove({ touches }) {
for (let i = 0; i < touches.length; i++) {
this.ongoingTouches[touches[i].identifier].hasMoved = true;
}
const targetTouch = touches[0];
this.ongoingTouches[targetTouch.identifier].hasMoved = true;
this.currentMoveX = targetTouch.clientX;
this.currentMoveY = targetTouch.clientY;
@ -164,7 +177,21 @@
const deltaY = this.currentMoveY - this.lastMoveY;
this.lastMoveX = this.currentMoveX;
this.lastMoveY = this.currentMoveY;
this._sendRelativeMouseMovement(deltaX, deltaY);
// if two touches moved at the same time, assume scrolling intent
if (touches.length === 2) {
this.scrollXSum += 1;
this.scrollYSum += 1;
if (this.scrollXSum > SCROLL_X_THRESHOLD) {
this._sendRelativeMouseScroll(deltaX, 0);
this.scrollXSum = 0;
}
if (this.scrollYSum > SCROLL_Y_THRESHOLD) {
this._sendRelativeMouseScroll(0, deltaY);
this.scrollYSum = 0;
}
} else {
this._sendRelativeMouseMovement(deltaX, deltaY);
}
}
onTouchEnd({ changedTouches }) {
@ -188,6 +215,23 @@
}
onTouchStart({ changedTouches }) {
// Clear the hold mode time out if another touch begins
if (this.holdModeTimeout)
clearTimeout(this.holdModeTimeout);
// 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
if (changedTouches.length === 1) {
const targetTouch = changedTouches[0];
this.holdModeTimeout = setTimeout(() => {
if (this.ongoingTouches[targetTouch.identifier] && !this.ongoingTouches[targetTouch.identifier].hasMoved) {
this.isInHoldingMode = true;
this._sendMouseButtonDown("left");
}
}, HOLDING_THRESHOLD_MS);
}
for (let i = 0; i < changedTouches.length; i++) {
const touch = changedTouches[i];
this.ongoingTouches[touch.identifier] = {
@ -196,16 +240,6 @@
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);
}
}
}