57 lines
1.2 KiB
TypeScript
57 lines
1.2 KiB
TypeScript
import { disableOpacity, enableOpacity } from '~/utils';
|
|
|
|
const OVERLAY_SELECTOR = '[data-slot="overlay"]';
|
|
|
|
export default defineNuxtPlugin(() => {
|
|
if (import.meta.server) {
|
|
return;
|
|
}
|
|
|
|
let observer: MutationObserver | null = null;
|
|
let isLocked = false;
|
|
|
|
const syncOverlayOpacity = (): void => {
|
|
const hasOverlay = document.querySelector(OVERLAY_SELECTOR) !== null;
|
|
|
|
if (hasOverlay && !isLocked) {
|
|
disableOpacity();
|
|
isLocked = true;
|
|
return;
|
|
}
|
|
|
|
if (!hasOverlay && isLocked) {
|
|
enableOpacity();
|
|
isLocked = false;
|
|
}
|
|
};
|
|
|
|
const startObserver = (): void => {
|
|
if (observer || !document.body) {
|
|
return;
|
|
}
|
|
|
|
observer = new MutationObserver(() => syncOverlayOpacity());
|
|
observer.observe(document.body, { childList: true, subtree: true });
|
|
syncOverlayOpacity();
|
|
};
|
|
|
|
if (document.readyState === 'loading') {
|
|
document.addEventListener('DOMContentLoaded', startObserver, { once: true });
|
|
} else {
|
|
startObserver();
|
|
}
|
|
|
|
window.addEventListener(
|
|
'beforeunload',
|
|
() => {
|
|
observer?.disconnect();
|
|
observer = null;
|
|
|
|
if (isLocked) {
|
|
enableOpacity();
|
|
isLocked = false;
|
|
}
|
|
},
|
|
{ once: true },
|
|
);
|
|
});
|