diff --git a/src/view-strategy.js b/src/view-strategy.js index 95cf15b..186e4f1 100644 --- a/src/view-strategy.js +++ b/src/view-strategy.js @@ -68,24 +68,24 @@ export class DefaultStrategy { insertBeforeNode(view, bottomBuffer); } - createTopBufferElement(scrollList, element) { - let elementName = scrollList.localName === 'ul' ? 'li' : 'div'; + createTopBufferElement(element) { + let elementName = element.parentElement.localName === 'ul' ? 'li' : 'div'; let buffer = document.createElement(elementName); buffer.setAttribute("style","height: 0px"); - scrollList.insertBefore(buffer, element); + element.parentElement.insertBefore(buffer, element); return buffer; } - createBottomBufferElement(scrollList, element) { - let elementName = scrollList.localName === 'ul' ? 'li' : 'div'; + createBottomBufferElement(element) { + let elementName = element.parentElement.localName === 'ul' ? 'li' : 'div'; let buffer = document.createElement(elementName); buffer.setAttribute("style","height: 0px"); element.parentNode.insertBefore(buffer, element.nextSibling); return buffer; } - removeBufferElements(scrollList, topBuffer, bottomBuffer) { - scrollList.removeChild(topBuffer); - scrollList.removeChild(bottomBuffer); + removeBufferElements(element, topBuffer, bottomBuffer) { + element.removeChild(topBuffer); + element.removeChild(bottomBuffer); } } diff --git a/src/virtual-repeat-strategy-locator.js b/src/virtual-repeat-strategy-locator.js index 64dd1be..025d526 100644 --- a/src/virtual-repeat-strategy-locator.js +++ b/src/virtual-repeat-strategy-locator.js @@ -1,4 +1,4 @@ -import {RepeatStrategyLocator} from 'aurelia-templating-resources'; +import {RepeatStrategyLocator} from 'aurelia-templating-resources/repeat-strategy-locator'; import {ArrayVirtualRepeatStrategy} from './array-virtual-repeat-strategy'; export class VirtualRepeatStrategyLocator extends RepeatStrategyLocator { diff --git a/src/virtual-repeat.js b/src/virtual-repeat.js index 3762d13..9499a97 100644 --- a/src/virtual-repeat.js +++ b/src/virtual-repeat.js @@ -71,10 +71,9 @@ export class VirtualRepeat { this._isAttached = true; let element = this.element; this.viewStrategy = this.viewStrategyLocator.getStrategy(element); - this.scrollList = this.viewStrategy.getScrollList(element); this.scrollContainer = this.viewStrategy.getScrollContainer(element); - this.topBuffer = this.viewStrategy.createTopBufferElement(this.scrollList, element); - this.bottomBuffer = this.viewStrategy.createBottomBufferElement(this.scrollList, element); + this.topBuffer = this.viewStrategy.createTopBufferElement(element); + this.bottomBuffer = this.viewStrategy.createBottomBufferElement(element); this.itemsChanged(); this.scrollListener = () => this._onScroll(); let containerStyle = this.scrollContainer.style; @@ -114,9 +113,8 @@ export class VirtualRepeat { this._switchedDirection = false; this._isAttached = false; this._ticking = false; - this.viewStrategy.removeBufferElements(this.scrollList, this.topBuffer, this.bottomBuffer); + this.viewStrategy.removeBufferElements(this.element, this.topBuffer, this.bottomBuffer); this.isLastIndex = false; - this.scrollList = null; this.scrollContainer = null; this.scrollContainerHeight = null; this.viewSlot.removeAll(true); @@ -124,7 +122,6 @@ export class VirtualRepeat { this.scrollHandler.dispose(); } this._unsubscribeCollection(); - } itemsChanged() { @@ -322,7 +319,6 @@ export class VirtualRepeat { let childrenLength = viewSlot.children.length; let viewIndex = this._scrollingDown ? 0 : childrenLength - 1; let items = this.items; - let scrollList = this.scrollList; let index = this._scrollingDown ? this._getIndexOfLastView() + 1 : this._getIndexOfFirstView() - 1; let i = 0; while(i < length && !isAtFirstOrLastIndex()) { @@ -351,9 +347,13 @@ export class VirtualRepeat { return; } this._itemsLength = this.items.length; - let listItems = this.scrollList.children; - this.itemHeight = calcOuterHeight(listItems[1]); + let firstViewElement = this.viewSlot.children[0].firstChild.nextElementSibling; + this.itemHeight = calcOuterHeight(firstViewElement); + if(this.itemHeight <= 0) { + throw new Error('Could not calculate item height'); + } this.scrollContainerHeight = this._fixedHeightContainer ? this._calcScrollHeight(this.scrollContainer) : document.documentElement.clientHeight - this.topBuffer.offsetTop; + this.elementsInView = Math.ceil(this.scrollContainerHeight / this.itemHeight) + 1; this._viewsLength = (this.elementsInView * 2) + this._bufferSize; this._bottomBufferHeight = this.itemHeight * this.items.length - this.itemHeight * this._viewsLength;