Fix touch problem with Stream Menu

This commit is contained in:
redphx 2024-08-06 20:24:40 +07:00
parent c1af19072d
commit 2fcf14c5b9
2 changed files with 18 additions and 9 deletions

View File

@ -7713,8 +7713,7 @@ class StreamUiHandler {
static $btnHome; static $btnHome;
static observer; static observer;
static cloneStreamHudButton($btnOrg, label, svgIcon) { static cloneStreamHudButton($btnOrg, label, svgIcon) {
const $streamHud = document.getElementById("StreamHud"); if (!$btnOrg)
if (!$streamHud || !$btnOrg)
return null; return null;
const $container = $btnOrg.cloneNode(!0); const $container = $btnOrg.cloneNode(!0);
let timeout; let timeout;
@ -7722,14 +7721,19 @@ class StreamUiHandler {
const onTransitionStart = (e) => { const onTransitionStart = (e) => {
if (e.propertyName !== "opacity") if (e.propertyName !== "opacity")
return; return;
timeout && clearTimeout(timeout), $container.style.pointerEvents = "none"; timeout && clearTimeout(timeout), e.target.style.pointerEvents = "none";
}, onTransitionEnd = (e) => { }, onTransitionEnd = (e) => {
if (e.propertyName !== "opacity") if (e.propertyName !== "opacity")
return; return;
if ($streamHud.style.left === "0px") const $streamHud = e.target.closest("#StreamHud");
if (!$streamHud)
return;
if ($streamHud.style.left === "0px") {
const $target = e.target;
timeout && clearTimeout(timeout), timeout = window.setTimeout(() => { timeout && clearTimeout(timeout), timeout = window.setTimeout(() => {
$container.style.pointerEvents = "auto"; $target.style.pointerEvents = "auto";
}, 100); }, 100);
}
}; };
$container.addEventListener("transitionstart", onTransitionStart), $container.addEventListener("transitionend", onTransitionEnd); $container.addEventListener("transitionstart", onTransitionStart), $container.addEventListener("transitionend", onTransitionEnd);
} }

View File

@ -16,8 +16,7 @@ export class StreamUiHandler {
private static observer: MutationObserver | undefined; private static observer: MutationObserver | undefined;
private static cloneStreamHudButton($btnOrg: HTMLElement, label: string, svgIcon: typeof BxIcon): HTMLElement | null { private static cloneStreamHudButton($btnOrg: HTMLElement, label: string, svgIcon: typeof BxIcon): HTMLElement | null {
const $streamHud = document.getElementById('StreamHud') as HTMLElement; if (!$btnOrg) {
if (!$streamHud || !$btnOrg) {
return null; return null;
} }
@ -32,7 +31,7 @@ export class StreamUiHandler {
} }
timeout && clearTimeout(timeout); timeout && clearTimeout(timeout);
$container.style.pointerEvents = 'none'; (e.target as HTMLElement).style.pointerEvents = 'none';
}; };
const onTransitionEnd = (e: TransitionEvent) => { const onTransitionEnd = (e: TransitionEvent) => {
@ -40,11 +39,17 @@ export class StreamUiHandler {
return; return;
} }
const $streamHud = (e.target as HTMLElement).closest('#StreamHud') as HTMLElement;
if (!$streamHud) {
return;
}
const left = $streamHud.style.left; const left = $streamHud.style.left;
if (left === '0px') { if (left === '0px') {
const $target = e.target as HTMLElement;
timeout && clearTimeout(timeout); timeout && clearTimeout(timeout);
timeout = window.setTimeout(() => { timeout = window.setTimeout(() => {
$container.style.pointerEvents = 'auto'; $target.style.pointerEvents = 'auto';
}, 100); }, 100);
} }
}; };