mejorado el algoritmo de busqueda asincrona

src/defaults/default-listable.ts

@@ -1,18 +1,21 @@
+import { LoadingController } from 'ionic-angular';
 import { IListable } from '../interfaces/listable-interface';
+import filter from 'async/filter';
 
 export abstract class DefaultListable<T> implements IListable<T> {
 
     private _search: boolean;
     private _elements: Array<T>;
-    private _elementsAux: Array<T>;
+    private _findedElements: Array<T>;
     private _visibleElements: Array<T>;
     private _visibleRange: [number, number] = [0, 20];
 
     constructor(
+        public loadingCtrl: LoadingController
     ) {
         this._search = false;
         this._elements = [];
-        this._elementsAux = [];
+        this._findedElements = [];
         this._visibleElements = [];
     }
 
@@ -31,6 +34,20 @@ export abstract class DefaultListable<T> implements IListable<T> {
         return this._elements;
     }
 
+    /**
+     *
+     */
+    set findedElements(_findedElements: Array<T>) {
+        this._findedElements = _findedElements;
+    }
+
+    /**
+     *
+     */
+    get findedElements() {
+        return this._findedElements;
+    }
+
     /**
      *
      */
@@ -58,7 +75,12 @@ export abstract class DefaultListable<T> implements IListable<T> {
     remove(T: any): void {
         let index = this.elements.indexOf(T);
 
-        this._elements.splice(index, 1);
+        if (this.isSearchMode()) {
+            this.findedElements.splice(index, 1);
+        } else {
+            this.elements.splice(index, 1);
+        }
+        
         this._visibleElements.splice(index, 1);
     }
 
@@ -81,18 +103,28 @@ export abstract class DefaultListable<T> implements IListable<T> {
      *
      */
     search(event: any): void {
+        let loading = this.loadingCtrl.create({
+            content: "Buscando, espere"
+        });
+        loading.present();
+
         let value: string = event.target.value;
 
-        if (!value) {
+        if (!value || value.length < 3) {
+            loading.dismiss();
             return;
         }
 
-        if (value.length < 3) {
-            return;
-        }
+        filter(this.elements, (item, cb) => {
+            if (item.name.toLowerCase().indexOf(value.toLowerCase()) > -1) {
+                return cb(null, true);
+            }
+            cb(null, false);
+        }, (error, results) => {
+            this.findedElements = results;
+            this.visibleElements = this.findedElements.slice(this._visibleRange[0], this._visibleRange[1]);
 
-        this.visibleElements = this.elements.filter(item => {
-            return (item as any).name.toLowerCase().indexOf(value.toLowerCase()) > -1;
+            loading.dismiss();
         });
     }
 
@@ -101,11 +133,11 @@ export abstract class DefaultListable<T> implements IListable<T> {
      */
     toggleSearch(): void {
         this._search = !this._search;
+        this._visibleRange = [0, 20];
 
-        if (this._search) {
-            this._elementsAux = this.visibleElements;
-        } else {
-            this.visibleElements = this._elementsAux;
+        if (!this._search) {
+            this.findedElements = [];
+            this.visibleElements = this.elements.slice(this._visibleRange[0], this._visibleRange[1]);
         }
     }
 
@@ -123,15 +155,18 @@ export abstract class DefaultListable<T> implements IListable<T> {
         this._visibleRange[0] = this._visibleRange[1];
         this._visibleRange[1] = this._visibleRange[1] + 20;
 
-        this._visibleElements = this._visibleElements.concat(this._elements.slice(this._visibleRange[0], this._visibleRange[1]));
-        console.info("seeking");
+        if (this.isSearchMode()) {
+            this._visibleElements = this._visibleElements.concat(this._findedElements.slice(this._visibleRange[0], this._visibleRange[1]));
+        } else {
+            this._visibleElements = this._visibleElements.concat(this._elements.slice(this._visibleRange[0], this._visibleRange[1]));
+        }    
     }
 
     /**
      *
      */
     isToSeek(): boolean {
-        return this._visibleRange[1] >= this.elements.length;
+        return this.isSearchMode() ? this._visibleRange[1] >= this.elements.length : this._visibleRange[1] >= this.elements.length;
     }
 
     /**

src/pages/product-list/product-list.ts

@@ -6,8 +6,6 @@ import { Product } from '../../models/product';
 import { ProductDetailsPage } from '../product-details/product-details';
 import { ProductOptions } from './product-options';
 import { DataProvider } from '../../providers/data-provider';
-import filter from 'async/filter';
-
 
 @Component({
     selector: 'page-product-list',
@@ -22,10 +20,10 @@ export class ProductListPage extends DefaultListable<Product> implements INaviga
         public alertCtrl: AlertController,
         public toastCtrl: ToastController,
         public dataProvider: DataProvider,
-        public loadingController: LoadingController,
+        public loadingCtrl: LoadingController,
         public popoverCtrl: PopoverController
     ){
-        super();
+        super(loadingCtrl);
     }
     
     ionViewDidLoad() {
@@ -36,7 +34,7 @@ export class ProductListPage extends DefaultListable<Product> implements INaviga
      * Initialize data list
      */
     initialize(): void {
-        let loader = this.loadingController.create({
+        let loader = this.loadingCtrl.create({
             content: "Cargando productos, espere..."
         });