fix: control bar icon clicks, hover/focus-within, nudge action

This commit is contained in:
2026-04-02 13:43:43 -04:00
parent f85a1f9f29
commit 64a9b85587
2 changed files with 26 additions and 11 deletions
+22 -10
View File
@@ -1939,14 +1939,20 @@ function defineVideoController() {
if (subtitleNudgeIndicator) {
updateSubtitleNudgeIndicator(this.video);
}
function blurAfterPointerTap(target, e) {
if (!target || typeof target.blur !== "function") return;
var pt = e.pointerType;
if (pt === "mouse" || pt === "touch" || (!pt && e.detail > 0)) {
requestAnimationFrame(function () {
target.blur();
});
}
}
dragHandle.addEventListener(
"mousedown",
(e) => {
runAction(
e.target.dataset["action"],
getKeyBindings(e.target.dataset["action"], "value"),
e
);
var dragAction = dragHandle.dataset.action;
runAction(dragAction, getKeyBindings(dragAction, "value"), e);
e.stopPropagation();
},
true
@@ -1955,11 +1961,9 @@ function defineVideoController() {
button.addEventListener(
"click",
(e) => {
runAction(
e.target.dataset["action"],
getKeyBindings(e.target.dataset["action"]),
e
);
var action = button.dataset.action;
runAction(action, getKeyBindings(action), e);
blurAfterPointerTap(button, e);
e.stopPropagation();
},
true
@@ -1974,6 +1978,7 @@ function defineVideoController() {
var newState = !isSubtitleNudgeEnabledForVideo(video);
setSubtitleNudgeEnabledForVideo(video, newState);
}
blurAfterPointerTap(subtitleNudgeIndicator, e);
e.stopPropagation();
},
true
@@ -2667,6 +2672,7 @@ function runAction(action, value, e) {
"mark",
"jump",
"drag",
"nudge",
"toggleSubtitleNudge",
"display"
];
@@ -2782,6 +2788,12 @@ function runAction(action, value, e) {
case "toggleSubtitleNudge":
setSubtitleNudgeEnabledForVideo(v, subtitleNudgeToggleValue);
break;
case "nudge":
setSubtitleNudgeEnabledForVideo(
v,
!isSubtitleNudgeEnabledForVideo(v)
);
break;
}
});
log("runAction End", 5);
+4 -1
View File
@@ -10,8 +10,11 @@
line-height: 1;
}
/* Show extra buttons on hover or keyboard :focus-visible only. Plain :focus-within
after a mouse click kept #controls visible while hover-only rules (e.g. draggable
margin) turned off when the pointer left the bar. */
#controller:hover #controls,
#controller:focus-within #controls,
#controller:focus-within:has(:focus-visible) #controls,
:host(:hover) #controls {
display: inline-flex;
vertical-align: middle;