ng-virtual-list 14.0.2 → 14.0.4

package/fesm2020/ng-virtual-list.mjs

@@ -552,10 +552,10 @@ class TrackBox extends CacheMap {
         const displayItems = this.generateDisplayCollection(items, stickyMap, metrics);
         return { displayItems, totalSize: metrics.totalSize, delta: metrics.delta };
     }
-    getElementNumToEnd(i, collection, map, typicalItemSize, size, isVertical) {
+    getElementNumToEnd(i, collection, map, typicalItemSize, size, isVertical, indexOffset = 0) {
         const sizeProperty = isVertical ? HEIGHT_PROP_NAME : WIDTH_PROP_NAME;
         let offset = 0, num = 0;
-        for (let j = collection.length - 1; j >= i; j--) {
+        for (let j = collection.length - indexOffset - 1; j >= i; j--) {
             const item = collection[j];
             let itemSize = 0;
             if (map.has(item.id)) {
@@ -578,13 +578,13 @@ class TrackBox extends CacheMap {
      */
     recalculateMetrics(options) {
         const { fromItemId, bounds, collection, dynamicSize, isVertical, itemSize, itemsOffset, scrollSize, snap, stickyMap } = options;
-        const { width, height } = bounds, sizeProperty = isVertical ? HEIGHT_PROP_NAME : WIDTH_PROP_NAME, size = isVertical ? height : width, totalLength = collection.length, typicalItemSize = itemSize, w = isVertical ? width : typicalItemSize, h = isVertical ? typicalItemSize : height, snippedPos = Math.floor(scrollSize), leftItemsWeights = [], isFromId = fromItemId !== undefined && (typeof fromItemId === 'number' && fromItemId > -1)
+        const { width, height } = bounds, sizeProperty = isVertical ? HEIGHT_PROP_NAME : WIDTH_PROP_NAME, size = isVertical ? height : width, totalLength = collection.length, typicalItemSize = itemSize, w = isVertical ? width : typicalItemSize, h = isVertical ? typicalItemSize : height, map = this._map, checkOverscrollItemsLimit = Math.ceil(size / typicalItemSize), snippedPos = Math.floor(scrollSize), leftItemsWeights = [], isFromId = fromItemId !== undefined && (typeof fromItemId === 'number' && fromItemId > -1)
             || (typeof fromItemId === 'string' && fromItemId > '-1');
-        let itemsFromStartToScrollEnd = -1, itemsFromDisplayEndToOffsetEnd = 0, itemsFromStartToDisplayEnd = -1, leftItemLength = 0, rightItemLength = 0, leftItemsWeight = 0, rightItemsWeight = 0, leftHiddenItemsWeight = 0, totalItemsToDisplayEndWeight = 0, itemById = undefined, itemByIdPos = 0, lastDisplayItemId = undefined, actualScrollSize = itemByIdPos, totalSize = 0, startIndex;
+        let itemsFromStartToScrollEnd = -1, itemsFromDisplayEndToOffsetEnd = 0, itemsFromStartToDisplayEnd = -1, leftItemLength = 0, rightItemLength = 0, leftItemsWeight = 0, rightItemsWeight = 0, leftHiddenItemsWeight = 0, totalItemsToDisplayEndWeight = 0, itemById = undefined, itemByIdPos = 0, targetDisplayItemIndex = -1, isTargetInOverscroll = false, actualScrollSize = itemByIdPos, totalSize = 0, startIndex;
         if (dynamicSize) {
             let y = 0, stickyCollectionItem = undefined, stickyComponentSize = 0;
             for (let i = 0, l = collection.length; i < l; i++) {
-                const ii = i + 1, collectionItem = collection[i], map = this._map;
+                const ii = i + 1, collectionItem = collection[i];
                 let componentSize = 0;
                 if (map.has(collectionItem.id)) {
                     const bounds = map.get(collectionItem.id);
@@ -601,9 +601,11 @@ class TrackBox extends CacheMap {
                             stickyCollectionItem = collectionItem;
                         }
                         if (collectionItem.id === fromItemId) {
+                            targetDisplayItemIndex = i;
                             if (stickyCollectionItem && stickyMap && stickyMap[stickyCollectionItem.id] > 0) {
                                 const { num } = this.getElementNumToEnd(i, collection, map, typicalItemSize, size, isVertical);
                                 if (num > 0) {
+                                    isTargetInOverscroll = true;
                                     y -= size - componentSize;
                                 }
                                 else {
@@ -627,12 +629,10 @@ class TrackBox extends CacheMap {
                     itemsFromStartToScrollEnd = ii;
                 }
                 if (isFromId) {
-                    if (!lastDisplayItemId) {
-                        if (itemById === undefined || y < itemByIdPos + size + componentSize) {
-                            itemsFromStartToDisplayEnd = ii;
-                            totalItemsToDisplayEndWeight += componentSize;
-                            itemsFromDisplayEndToOffsetEnd = itemsFromStartToDisplayEnd + itemsOffset;
-                        }
+                    if (itemById === undefined || y < itemByIdPos + size + componentSize) {
+                        itemsFromStartToDisplayEnd = ii;
+                        totalItemsToDisplayEndWeight += componentSize;
+                        itemsFromDisplayEndToOffsetEnd = itemsFromStartToDisplayEnd + itemsOffset;
                     }
                 }
                 else if (y < scrollSize + size + componentSize) {
@@ -645,10 +645,16 @@ class TrackBox extends CacheMap {
                 }
                 y += componentSize;
             }
-            if (itemsFromStartToScrollEnd === -1) {
+            if (isTargetInOverscroll) {
+                const { num } = this.getElementNumToEnd(collection.length - (checkOverscrollItemsLimit < 0 ? 0 : collection.length - checkOverscrollItemsLimit), collection, map, typicalItemSize, size, isVertical, collection.length - (collection.length - (targetDisplayItemIndex + 1)));
+                if (num > 0) {
+                    itemsFromStartToScrollEnd -= num;
+                }
+            }
+            if (itemsFromStartToScrollEnd <= -1) {
                 itemsFromStartToScrollEnd = 0;
             }
-            if (itemsFromStartToDisplayEnd === -1) {
+            if (itemsFromStartToDisplayEnd <= -1) {
                 itemsFromStartToDisplayEnd = 0;
             }
             actualScrollSize = isFromId ? itemByIdPos : scrollSize;
@@ -879,6 +885,38 @@ class TrackBox extends CacheMap {
     }
 }
 
+class ScrollEvent {
+    constructor(direction, container, list, delta, isVertical) {
+        this._direction = 1;
+        this._scrollSize = 0;
+        this._scrollWeight = 0;
+        this._isVertical = true;
+        this._listSize = 0;
+        this._size = 0;
+        this._isStart = true;
+        this._isEnd = false;
+        this._delta = 0;
+        this._direction = direction;
+        this._isVertical = isVertical;
+        this._scrollSize = isVertical ? container.scrollTop : container.scrollLeft;
+        this._scrollWeight = isVertical ? container.scrollHeight : container.scrollWidth;
+        this._listSize = isVertical ? list.offsetHeight : list.offsetWidth;
+        this._size = isVertical ? container.offsetHeight : container.offsetWidth;
+        this._isEnd = (this._scrollSize + this._size) === this._scrollWeight;
+        this._delta = delta;
+        this._isStart = this._scrollSize === 0;
+    }
+    get direction() { return this._direction; }
+    get scrollSize() { return this._scrollSize; }
+    get scrollWeight() { return this._scrollWeight; }
+    get isVertical() { return this._isVertical; }
+    get listSize() { return this._listSize; }
+    get size() { return this._size; }
+    get isStart() { return this._isStart; }
+    get isEnd() { return this._isEnd; }
+    get delta() { return this._delta; }
+}
+
 /**
  * Base disposable component
  * @link https://github.com/DjonnyX/ng-virtual-list/blob/14.x/projects/ng-virtual-list/src/lib/utils/disposableComponent.ts
@@ -961,10 +999,11 @@ class NgVirtualListComponent extends DisposableComponent {
             this._$bounds.next(this._container?.nativeElement?.getBoundingClientRect() ?? null);
         };
         this._onScrollHandler = (e) => {
+            this.clearScrollToRepeatExecutionTimeout();
             const container = this._container?.nativeElement;
             if (container) {
                 const dynamicSize = this.dynamicSize, delta = this._trackBox.delta, scrollSize = (this._isVertical ? container.scrollTop : container.scrollLeft), previouseScrollSize = this._$scrollSize.getValue();
-                let actualScrollSize = scrollSize;
+                let actualScrollSize = scrollSize, isImmediateScroll = false;
                 this._trackBox.deltaDirection = previouseScrollSize > scrollSize ? -1 : 1;
                 if (dynamicSize && delta !== 0) {
                     actualScrollSize = scrollSize + delta;
@@ -974,12 +1013,19 @@ class NgVirtualListComponent extends DisposableComponent {
                     };
                     const container = this._container;
                     if (container) {
-                        this.scrollImmediately(container, params);
+                        isImmediateScroll = true;
+                        this.scrollImmediately(container, params, () => {
+                            const event = new ScrollEvent(this._trackBox.scrollDirection, container.nativeElement, this._list.nativeElement, delta, this._isVertical);
+                            this.onScroll.emit(event);
+                        });
                         this._trackBox.clearDelta();
                     }
                 }
                 this._$scrollSize.next(actualScrollSize);
-                this.onScroll.emit({ scrollSize: actualScrollSize, direction: this._trackBox.scrollDirection });
+                if (!isImmediateScroll) {
+                    const event = new ScrollEvent(this._trackBox.scrollDirection, container, this._list.nativeElement, delta, this._isVertical);
+                    this.onScroll.emit(event);
+                }
             }
         };
         this._scrollImmediatelyHandler = undefined;
@@ -990,6 +1036,7 @@ class NgVirtualListComponent extends DisposableComponent {
                 this._trackBox.clearDeltaDirection();
                 const itemSize = this.itemSize, snapToItem = this.snapToItem, dynamicSize = this.dynamicSize, delta = this._trackBox.delta, scrollSize = (this._isVertical ? container.nativeElement.scrollTop : container.nativeElement.scrollLeft);
                 let actualScrollSize = scrollSize;
+                const event = new ScrollEvent(this._trackBox.scrollDirection, container.nativeElement, this._list.nativeElement, delta, this._isVertical);
                 if (dynamicSize && delta !== 0) {
                     actualScrollSize = scrollSize + delta;
                     if (scrollSize !== actualScrollSize) {
@@ -1014,7 +1061,7 @@ class NgVirtualListComponent extends DisposableComponent {
                     }
                 }
                 this._$scrollSize.next(actualScrollSize);
-                this.onScroll.emit({ scrollSize: actualScrollSize, direction: this._trackBox.scrollDirection });
+                this.onScrollEnd.emit(event);
             }
         };
         this._$initialized = new BehaviorSubject(false);
@@ -1176,13 +1223,16 @@ class NgVirtualListComponent extends DisposableComponent {
     }
     ;
     get itemsOffset() { return this._$itemsOffset.getValue(); }
-    scrollImmediately(container, params) {
+    scrollImmediately(container, params, cb) {
         this.clearScrollImmediately();
         container.nativeElement.removeEventListener(SCROLL_END, this._onScrollEndHandler);
         const handler = () => {
             if (container) {
                 container.nativeElement.removeEventListener(SCROLL_END, handler);
                 container.nativeElement.scroll(params);
+                if (cb !== undefined) {
+                    cb();
+                }
                 container.nativeElement.addEventListener(SCROLL_END, this._onScrollEndHandler);
             }
         };
@@ -1312,7 +1362,8 @@ class NgVirtualListComponent extends DisposableComponent {
                             }
                             else {
                                 this._$scrollSize.next(scrollSize);
-                                this.onScroll.emit({ scrollSize, direction: this._trackBox.scrollDirection });
+                                const event = new ScrollEvent(this._trackBox.scrollDirection, container.nativeElement, this._list.nativeElement, this._trackBox.delta, this._isVertical);
+                                this.onScroll.emit(event);
                                 container.nativeElement.addEventListener(SCROLL, this._onScrollHandler);
                                 container.nativeElement.addEventListener(SCROLL_END, this._onScrollEndHandler);
                             }