Merge pull request #57 from dhilt/first-visible

Adapter.firstVisible implementation
dhilt · Jul 25, 2018 · 5c6589e · 5c6589e
2 parents d51ed8a + ae3920a
commit 5c6589e
Show file tree

Hide file tree

Showing 25 changed files with 224 additions and 137 deletions.
diff --git a/demo/app/samples/test.component.html b/demo/app/samples/test.component.html
@@ -4,13 +4,22 @@
   <br>
   <small>ngx-ui-scroll version: {{datasource.adapter.version}}</small>
   <br>
-  <small>isLoading: {{datasource.adapter.isLoading}}</small>
+  <small>isLoading:
+    {{datasource.adapter.isLoading}}
+    ({{(datasource.adapter.isLoading$ | async)}})
+  </small>
+  <br>
+  <small>first visible:
+    {{datasource.adapter.firstVisible.$index}}
+    ({{(datasource.adapter.firstVisible$ | async)?.$index}})
+  </small>
   <br><br>
 </div>
 
 <div class="viewport" style="height: 600px">
-  <!--<div style="height: 100px">gap</div>-->
   <div *uiScroll="let item of datasource">
-    <app-samples-test-inner>{{item.text}}</app-samples-test-inner>
+    <app-samples-test-inner>
+      {{item.text}} {{item.id % 10 === 0 ? '**********' : ''}}
+    </app-samples-test-inner>
   </div>
 </div>
diff --git a/demo/app/samples/test.component.ts b/demo/app/samples/test.component.ts
@@ -1,10 +1,11 @@
 import { Component } from '@angular/core';
 import { Observable, Observer } from 'rxjs';
+import { switchMap } from 'rxjs/operators';
 
 import { Datasource } from '../../../public_api'; // from 'ngx-ui-scroll';
 
 const MAX = 500;
-const MIN = 1;
+const MIN = -1000;
 
 @Component({
   selector: 'app-samples-test-inner',
@@ -33,6 +34,10 @@ export class TestComponent {
         text: 'item #' + (i + MIN)
       });
     }
+    this.datasource.adapter.firstVisible$
+      .subscribe((value) => {
+        console.log('..............................first visible item:', value);
+      });
   }
 
   datasource = new Datasource({
@@ -48,7 +53,6 @@ export class TestComponent {
   });
 
   doReload() {
-    // this.data.forEach(item => item.text += '+');
     this.datasource.adapter.reload(this.reloadIndex);
   }
 

diff --git a/package-dist.json b/package-dist.json
@@ -1,6 +1,6 @@
 {
   "name": "ngx-ui-scroll",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "Infinite/virtual scroll for Angular",
   "main": "./bundles/ngx-ui-scroll.umd.js",
   "module": "./esm5/ngx-ui-scroll.js",