2022-05-25 12:06:35 +03:00
|
|
|
import Modifier from 'ember-modifier';
|
|
|
|
import {action} from '@ember/object';
|
2022-08-02 11:23:43 +03:00
|
|
|
import {registerDestructor} from '@ember/destroyable';
|
2022-05-25 12:06:35 +03:00
|
|
|
|
|
|
|
export default class OnScrollModifier extends Modifier {
|
2022-08-02 11:23:43 +03:00
|
|
|
constructor(owner, args) {
|
|
|
|
super(owner, args);
|
|
|
|
registerDestructor(this, this.cleanup);
|
2022-05-25 12:06:35 +03:00
|
|
|
}
|
|
|
|
|
2022-08-02 11:23:43 +03:00
|
|
|
modify(element, [callback], named) {
|
|
|
|
this.elem = element;
|
|
|
|
this.callback = callback;
|
|
|
|
this.scrollContainer = element;
|
2022-05-25 12:06:35 +03:00
|
|
|
|
2022-08-02 11:23:43 +03:00
|
|
|
if (named.scrollContainer) {
|
|
|
|
this.scrollContainer = element.closest(named.scrollContainer);
|
2022-05-25 12:06:35 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
this.scrollContainer?.addEventListener('scroll', this.onScroll, {passive: true});
|
|
|
|
}
|
|
|
|
|
2022-08-02 11:23:43 +03:00
|
|
|
cleanup = () => {
|
2022-05-25 12:06:35 +03:00
|
|
|
this.scrollContainer?.removeEventListener('scroll', this.onScroll, {passive: true});
|
2022-08-02 11:23:43 +03:00
|
|
|
};
|
|
|
|
|
|
|
|
@action
|
|
|
|
onScroll(event) {
|
|
|
|
this.callback(this.elem, this.scrollContainer, event);
|
2022-05-25 12:06:35 +03:00
|
|
|
}
|
|
|
|
}
|