kyuno/watchparty
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Packages Wiki Activity Actions

Hide the cursor over the video once the bottom bar auto-hides #3

Merged
kyuno merged 2 commits from fix/player-cursor-hide into master 2026-09-15 22:52:34 +02:00
Conversation 0 Commits 2 Files changed 2 +16 -1
2 changed files with 16 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
client/src/views/player/Player.css
View file

@ -16,6 +16,15 @@
object-fit: contain;
}
/* Toggled alongside .bottomBar.minimal (see Player.ts's scheduleControlsHide/
showControls) - a mouse cursor left sitting over the video is the same
kind of clutter the bar itself was, once there's nothing left under it
to interact with. Any pointermove/pointerdown anywhere in .playerWrap
already calls showControls(), so the cursor reappears the instant the
mouse moves again - same convention as any other video player's
auto-hiding controls. */
.playerWrap.cursorHidden { cursor: none; }
/* Two stacked rows, both part of the same top gradient overlay: the action
bar (title/members/next/settings/leave) and, below it, the presence
avatars - see .presenceOverlay in styles/presence.css. Stacking them in

8
client/src/views/player/Player.ts
View file

@ -530,7 +530,11 @@ function renderVideoPlayer(root: HTMLElement, partyId: string, party: PartyPubli
* sitting on the bar itself, and re-arms on every discrete playback
* event too (onDriverStateChanged above), not just raw pointer
* activity - resuming from pause has to restart the countdown, not
* leave the bar stuck open forever.
* leave the bar stuck open forever. .playerWrap also gets
* .cursorHidden alongside .minimal (see Player.css) - asked for
* directly too: a mouse cursor left sitting over the video is exactly
* the same kind of clutter the bar itself was, once there's nothing
* left under it to interact with.
*/
function clearControlsHideTimer() {
if (controlsHideTimer) {
@ -544,11 +548,13 @@ function renderVideoPlayer(root: HTMLElement, partyId: string, party: PartyPubli
controlsHideTimer = window.setTimeout(() => {
if (activeDriver.paused || isPointerOverBottomBar) return;
bottomBar.classList.add('minimal');
playerWrap.classList.add('cursorHidden');
}, CONTROLS_HIDE_DELAY_MS);
}
function showControls() {
bottomBar.classList.remove('minimal');
playerWrap.classList.remove('cursorHidden');
scheduleControlsHide();
}