diff --git a/ionic/components/list/list.ts b/ionic/components/list/list.ts index 84bf9aee6b..0089a5285f 100644 --- a/ionic/components/list/list.ts +++ b/ionic/components/list/list.ts @@ -1,19 +1,21 @@ -import {Directive, ElementRef, Renderer, Attribute, NgZone, Input} from 'angular2/core'; +import {Directive, ElementRef, Renderer, Attribute, NgZone} from 'angular2/core'; import {Ion} from '../ion'; -import {ListVirtualScroll} from './virtual'; import {ItemSlidingGesture} from '../item/item-sliding-gesture'; import {isDefined} from '../../util'; /** - * The List is a widely used interface element in almost any mobile app, and can include - * content ranging from basic text all the way to buttons, toggles, icons, and thumbnails. + * The List is a widely used interface element in almost any mobile app, + * and can include content ranging from basic text all the way to + * buttons, toggles, icons, and thumbnails. * - * Both the list, which contains items, and the list items themselves can be any HTML - * element. + * Both the list, which contains items, and the list items themselves + * can be any HTML element. * * Using the List and Item components make it easy to support various - * interaction modes such as swipe to edit, drag to reorder, and removing items. + * interaction modes such as swipe to edit, drag to reorder, and + * removing items. + * * @demo /docs/v2/demos/list/ * @see {@link /docs/v2/components#lists List Component Docs} * @@ -23,80 +25,28 @@ import {isDefined} from '../../util'; }) export class List extends Ion { private _enableSliding: boolean = false; - private _virtualScrollingManager: ListVirtualScroll; /** * @private */ ele: HTMLElement; - /** - * @private - */ - itemTemplate: any; - /** * @private */ slidingGesture: ItemSlidingGesture; - - /** - * @private - */ - @Input() items; - - /** - * @private - */ - @Input() virtual; - - /** - * @private - */ - @Input() content; - constructor(elementRef: ElementRef, private _zone: NgZone) { super(elementRef); this.ele = elementRef.nativeElement; } - /** - * @private - */ - ngOnInit() { - if (isDefined(this.virtual)) { - console.debug('Content', this.content); - console.debug('Virtual?', this.virtual); - console.debug('Items?', this.items.length, 'of \'em'); - this._initVirtualScrolling(); - } - } - /** * @private */ ngOnDestroy() { - this.ele = null; - this.slidingGesture && this.slidingGesture.unlisten(); - } - - /** - * @private - */ - _initVirtualScrolling() { - if(!this.content) { - return; - } - - this._virtualScrollingManager = new ListVirtualScroll(this); - } - - /** - * @private - */ - setItemTemplate(item: any) { - this.itemTemplate = item; + this.slidingGesture && this.slidingGesture.destroy(); + this.ele = this.slidingGesture = null; } /** diff --git a/ionic/components/list/test/infinite/index.ts b/ionic/components/list/test/infinite/index.ts deleted file mode 100644 index 709b974f1d..0000000000 --- a/ionic/components/list/test/infinite/index.ts +++ /dev/null @@ -1,9 +0,0 @@ -import {App} from 'ionic-angular'; - - -@App({ - templateUrl: 'main.html' -}) -class E2EApp { - // TODO -} diff --git a/ionic/components/list/test/infinite/main.html b/ionic/components/list/test/infinite/main.html deleted file mode 100644 index 0b680180a1..0000000000 --- a/ionic/components/list/test/infinite/main.html +++ /dev/null @@ -1,7 +0,0 @@ -Infinite List - - - -TODO - - diff --git a/ionic/components/list/virtual.ts b/ionic/components/list/virtual.ts deleted file mode 100644 index c4d829d4bb..0000000000 --- a/ionic/components/list/virtual.ts +++ /dev/null @@ -1,119 +0,0 @@ -import {List} from './list'; - - -export class ListVirtualScroll { - content; - viewContainer; - viewportHeight; - virtualHeight; - viewportScrollHeight; - itemsPerScreen; - list: List; - itemHeight: number = 60; - shownItems = {}; - enteringItems = []; - leavingItems = []; - - constructor(list: List) { - this.list = list; - this.content = this.list.content; - - this.viewportHeight = this.content.height(); - - this.viewContainer = this.list.itemTemplate.viewContainer; - - // Compute the initial sizes - setTimeout(() => { - this.resize(); - - // Simulate the first event to start layout - this._handleVirtualScroll({ - target: this.content.scrollElement - }); - }) - - this.content.addScrollEventListener((event) => { - this._handleVirtualScroll(event); - }); - } - - resize() { - this.viewportHeight = this.content.height(); - this.viewportScrollHeight = this.content.scrollElement.scrollHeight; - - this.virtualHeight = this.list.items.length * this.itemHeight; - this.itemsPerScreen = this.viewportHeight / this.itemHeight; - - console.debug('VIRTUAL: resize(viewportHeight:', this.viewportHeight, - 'viewportScrollHeight:', this.viewportScrollHeight, 'virtualHeight:', this.virtualHeight, - ', itemsPerScreen:', this.itemsPerScreen, ')'); - } - - _handleVirtualScroll(event) { - let item; - let shownItemRef; - - let st = event.target.scrollTop; - let sh = event.target.scrollHeight; - - let topIndex = Math.floor(st / this.itemHeight); - let bottomIndex = Math.floor((st / this.itemHeight) + this.itemsPerScreen); - - let items = this.list.items; - - // Key iterate the shown items map - // and compare the index to our index range, - // pushing the items to remove to our leaving - // list if they're ouside this range. - for (let i in this.shownItems) { - if (i < topIndex || i > bottomIndex) { - this.leavingItems.push(this.shownItems[i]); - delete this.shownItems[i]; - } - } - - let realIndex = 0; - // Iterate the set of items that will be rendered, using the - // index from the actual items list as the map for the - // virtual items we draw - for (let i = topIndex, realIndex = 0; i < bottomIndex && i < items.length; i++, realIndex++) { - item = items[i]; - console.debug('Drawing item', i, item.title); - - shownItemRef = this.shownItems[i]; - - // Is this a new item? - if (!shownItemRef) { - let itemView = this.viewContainer.create(this.list.itemTemplate.protoViewRef, realIndex); - - itemView.setLocal('\$implicit', item); - itemView.setLocal('\$item', item); - - shownItemRef = new VirtualItemRef(item, i, realIndex, itemView); - - this.shownItems[i] = shownItemRef; - this.enteringItems.push(shownItemRef); - } - - //tuple.view = viewContainer.create(protoViewRef, tuple.record.currentIndex); - } - - while (this.leavingItems.length) { - let itemRef = this.leavingItems.pop(); - console.debug('Removing item', itemRef.item, itemRef.realIndex); - this.viewContainer.remove(itemRef.realIndex); - } - - console.debug('VIRTUAL SCROLL: scroll(scrollTop:', st, 'topIndex:', topIndex, 'bottomIndex:', bottomIndex, ')'); - console.debug('Container has', this.list.getNativeElement().children.length, 'children'); - } - - cellAtIndex(index) { - - } - -} - -class VirtualItemRef { - constructor(public item, public index, public realIndex, public view) {} -}