Update WebRTCVideo.tsx

Changed code to improve wheel mouse scrolling. This should allow better performance (including some amount of acceleration) under most browsers.
This commit is contained in:
rmschooley 2025-05-15 03:31:14 -05:00 committed by GitHub
parent 5411424d7c
commit 54e9be2b53
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 11 additions and 14 deletions

View File

@ -259,25 +259,22 @@ export default function WebRTCVideo() {
(e: WheelEvent) => { (e: WheelEvent) => {
if (blockWheelEvent) return; if (blockWheelEvent) return;
// Determine if the wheel event is from a trackpad or a mouse wheel // Determine if the wheel event is an accelerable scroll value
const isTrackpad = Math.abs(e.deltaY) < trackpadThreshold; const isAccel = Math.abs(e.deltaY) >= 100;
// Apply appropriate sensitivity based on input device // Calculate the accelerable scroll value
const scrollSensitivity = isTrackpad ? trackpadSensitivity : mouseSensitivity; const accelScrollValue = e.deltaY / 100;
// Calculate the scroll value // Calculate the non-accelerable scroll value
const scroll = e.deltaY * scrollSensitivity; const nonAccelScrollValue = e.deltaY > 0 ? 1: -1;
// Apply clamping // Get actual scroll value
const clampedScroll = Math.max(clampMin, Math.min(clampMax, scroll)); const scrollValue = isAccel ? accelScrollValue : nonAccelScrollValue;
// Round to the nearest integer // Apply clamping (i.e. min and max mouse wheel hardware value)
const roundedScroll = Math.round(clampedScroll); const clampedScrollValue = Math.max(-128, Math.min(127, scrollValue));
// Invert the scroll value to match expected behavior send("wheelReport", { wheelY: clampedScrollValue });
const invertedScroll = -roundedScroll;
send("wheelReport", { wheelY: invertedScroll });
// Apply blocking delay // Apply blocking delay
setBlockWheelEvent(true); setBlockWheelEvent(true);