fix(occlusion): wire up onScroll and onScrolledToBottom

adopted-ember-addons · Nov 24, 2017 · ee30bb8 · ee30bb8
1 parent b93f067
commit ee30bb8
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 5 deletions.
diff --git a/addon/components/lt-body.js b/addon/components/lt-body.js
@@ -484,6 +484,24 @@ export default Component.extend({
      */
     onScrolledToBottom() {
       this.sendAction('onScrolledToBottom');
+    },
+
+    firstVisibleChanged(item, index /* , key */) {
+      const estimateScrollOffset = index * this.get('sharedOptions.estimatedRowHeight');
+      this.sendAction('onScroll', estimateScrollOffset, null);
+    },
+
+    lastVisibleChanged(/* item, index, key */) {
+      this.sendAction('lastVisibleChanged', ...arguments);
+    },
+
+    firstReached(/* item, index, key */) {
+      this.sendAction('firstReached', ...arguments);
+    },
+
+    lastReached(/* item, index, key */) {
+      this.sendAction('lastReached', ...arguments);
+      this.sendAction('onScrolledToBottom');
     }
   }
 });
diff --git a/addon/templates/components/lt-body.hbs b/addon/templates/components/lt-body.hbs
@@ -85,6 +85,10 @@
               estimateHeight=sharedOptions.estimatedRowHeight
               bufferSize=scrollBufferRows
               containerSelector='.lt-scrollable'
+              firstVisibleChanged=(action 'firstVisibleChanged')
+              lastVisibleChanged=(action 'lastVisibleChanged')
+              firstReached=(action 'firstReached')
+              lastReached=(action 'lastReached')
              as |row index|
           }}
             {{lt.row row columns
@@ -114,11 +118,6 @@
         </tbody>
       </table>
 
-      {{!--#if onScrolledToBottom}} TODO figure out how to use the scrollbuffer property for infinite loading
-                                           lastReached=onScrolledToBottom
-        {{lt.infinity rows=rows onScrolledToBottom=onScrolledToBottom scrollBuffer=scrollBuffer}}
-      {{/if --}}
-
       <div id="{{concat tableId '_inline_foot'}}" class="lt-inline lt-foot"></div>
     </div>
   {{/unless}}