Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
let initialized = false;
// early init if possible.
if (typeof window !== 'undefined') {
init();
initialized = true;
}
function handler(e: StorageEvent) {
if (e.key === key) {
value.value = e.newValue ? parseValue(e.newValue) : null;
}
}
onMounted(() => {
if (!initialized) {
init();
}
window.addEventListener('storage', handler, true);
});
onUnmounted(() => {
localStorage.setItem(key, JSON.stringify(value.value));
window.removeEventListener('storage', handler);
});
return {
value
};
}
export function useDeviceOrientation() {
const isAbsolute = ref(false);
const alpha: Ref = ref(0);
const beta: Ref = ref(0);
const gamma: Ref = ref(0);
function handler(event: DeviceOrientationEvent) {
isAbsolute.value = event.absolute;
alpha.value = event.alpha;
beta.value = event.beta;
gamma.value = event.gamma;
}
onMounted(() => {
window.addEventListener('deviceorientation', handler);
});
onUnmounted(() => {
window.removeEventListener('deviceorientation', handler);
});
return {
isAbsolute,
alpha,
beta,
gamma
};
}
export function useIntersectionObserver(
target: Ref,
options: IntersectionObserverInit = { root: null, rootMargin: '0px' }
) {
const intersectionRatio = ref(0);
const isIntersecting = ref(false);
const isFullyInView = ref(false);
function observe() {
if (target.value) {
observer.observe(target.value);
}
}
let observer: IntersectionObserver;
onMounted(() => {
observer = new IntersectionObserver(([entry]) => {
intersectionRatio.value = entry.intersectionRatio;
if (entry.intersectionRatio > 0) {
isIntersecting.value = true;
isFullyInView.value = entry.intersectionRatio >= 1;
return;
}
isIntersecting.value = false;
}, options);
observe();
});
function unobserve() {
if (!observer) return;
export default function useEvent(el = ref(document), name, handler) {
el = unwrap(el)
const remove = () => el && el.removeEventListener(name, handler)
onMounted(() => el && el.addEventListener(name, handler))
onBeforeDestroy(remove)
return remove
}
function useEvent(el, name, listener, options) {
const element = wrap(el);
const remove = () => element.value.removeEventListener(name, listener);
compositionApi.onMounted(() => element.value.addEventListener(name, listener, options));
compositionApi.onUnmounted(remove);
return remove;
}
function useEvent(el, name, listener, options) {
const element = wrap(el);
const remove = () => element.value.removeEventListener(name, listener);
onMounted(() => element.value.addEventListener(name, listener, options));
onUnmounted(remove);
return remove;
}
const data: Ref = ref(null);
let worker: Worker;
const post: typeof worker.postMessage = function post(val: any) {
if (!worker) return;
worker.postMessage(val);
};
const terminate: typeof worker.terminate = function terminate() {
if (!worker) return;
worker.terminate();
};
onMounted(() => {
worker = new Worker(url);
worker.onmessage = (e: MessageEvent) => {
data.value = e.data;
};
});
onUnmounted(() => {
worker.terminate();
});
return {
data,
post,
terminate
};
downlinkMax.value = (window.navigator as any).connection.downlinkMax;
effectiveType.value = (window.navigator as any).connection.effectiveType;
saveData.value = (window.navigator as any).connection.saveData;
type.value = (window.navigator as any).connection.type;
}
const onOffline = () => {
isOnline.value = false;
offlineAt.value = Date.now();
};
const onOnline = () => {
isOnline.value = true;
};
onMounted(() => {
updateNetworkInformation();
window.addEventListener('offline', onOffline);
window.addEventListener('online', onOnline);
if ('connection' in window.navigator) {
(window.navigator as any).connection.addEventListener('change', updateNetworkInformation, false);
}
});
onUnmounted(() => {
window.removeEventListener('offline', onOffline);
window.removeEventListener('online', onOnline);
if ('connection' in window.navigator) {
(window.navigator as any).connection.removeEventListener('change', updateNetworkInformation, false);
}
});