Handle changing amoutn of elements
This commit is contained in:
parent
636ac56070
commit
ea65ae01a9
@ -12,9 +12,11 @@ export default class HorizontalScroller extends Controller {
|
||||
|
||||
visibility: number[];
|
||||
|
||||
intersectionObservers: IntersectionObserver[];
|
||||
|
||||
connect() {
|
||||
this.visibility = this.elementTargets.map(() => 0);
|
||||
[0, 0.5, 0.9, 1].forEach((threshold) => {
|
||||
this.intersectionObservers = [0, 0.5, 0.9, 1].map((threshold) => {
|
||||
const observer = new IntersectionObserver(
|
||||
(events) => this.handleIntersection(events),
|
||||
{
|
||||
@ -23,12 +25,23 @@ export default class HorizontalScroller extends Controller {
|
||||
threshold,
|
||||
}
|
||||
);
|
||||
this.elementTargets.forEach((e) => observer.observe(e));
|
||||
return observer;
|
||||
});
|
||||
this.observe();
|
||||
|
||||
this.refreshMarkers();
|
||||
}
|
||||
|
||||
markerTargetConnected() {
|
||||
this.observe();
|
||||
}
|
||||
|
||||
observe() {
|
||||
this.intersectionObservers?.forEach((observer) =>
|
||||
this.elementTargets.forEach((e) => observer.observe(e))
|
||||
);
|
||||
}
|
||||
|
||||
handleIntersection(events: IntersectionObserverEntry[]) {
|
||||
events.forEach((event) => {
|
||||
const element_index = this.elementTargets.indexOf(
|
||||
|
Loading…
x
Reference in New Issue
Block a user