33 lines
979 B
JavaScript
33 lines
979 B
JavaScript
let observer;
|
|
const AUTO_SCROLL_EVENTS = ['scroll', 'mousewheel', 'touchmove'];
|
|
let events_handlers = [];
|
|
|
|
export default defineNuxtPlugin((nuxtApp) => {
|
|
nuxtApp.vueApp.directive('autoscroll', {
|
|
mounted: async el => {
|
|
let scrolledToBottom = true;
|
|
|
|
AUTO_SCROLL_EVENTS.forEach((ev, index) => {
|
|
events_handlers[index] = () => {
|
|
scrolledToBottom = (el.scrollHeight - el.scrollTop) - el.clientHeight <= 80;
|
|
}
|
|
el.addEventListener(ev, events_handlers[index], { passive: true });
|
|
});
|
|
|
|
observer = new MutationObserver(_ => {
|
|
if (false === scrolledToBottom) {
|
|
return;
|
|
}
|
|
el.scrollTop = el.scrollHeight;
|
|
});
|
|
|
|
observer.observe(el, { childList: true, subtree: true });
|
|
},
|
|
unmounted: el => {
|
|
AUTO_SCROLL_EVENTS.forEach((ev, index) => {
|
|
el.removeEventListener(ev, events_handlers[index], { passive: true });
|
|
});
|
|
observer.disconnect();
|
|
},
|
|
})
|
|
});
|