refactor(all): rename virtual-repeat-next to infinite-scroll-next

BREAKING CHANGE: Renamed `virtual-repeat-next` to
`infinite-scroll-next` to provide more meaning to the attribute.

Author: AStoker

README.md

@@ -89,7 +89,7 @@ If you are running the plugin in the `skeleton-naviagion` project, make sure to
 #### infinite scroll
 ```html
 <template>
-  <div virtual-repeat.for="item of items" virtual-repeat-next="getMore">
+  <div virtual-repeat.for="item of items" infinite-scroll-next="getMore">
     ${$index} ${item}
   </div>
 </template>
@@ -108,7 +108,7 @@ export class MyVirtualList {
 Or to use an expression, use `.call` as shown below.
 ```html
 <template>
-  <div virtual-repeat.for="item of items" virtual-repeat-next.call="getMore($scrollContext)">
+  <div virtual-repeat.for="item of items" infinite-scroll-next.call="getMore($scrollContext)">
     ${$index} ${item}
   </div>
 </template>
@@ -124,7 +124,7 @@ export class MyVirtualList {
 }
 ```  
 
-The `virtual-repeat-next` attribute can accept a function, a promise, or a function that returns a promise.  
+The `infinite-scroll-next` attribute can accept a function, a promise, or a function that returns a promise.  
 The bound function will be called when the scroll container has reached a point where there are no more items to move into the DOM (i.e. when it reaches the end of a list, either from the top or the bottom).  
 There are three parameters that are passed to the function (`getMore(topIndex, isAtBottom, isAtTop)`) which helps determine the behavior or amount of items to get during scrolling.    
 1. `topIndex` - A integer value that represents the current item that exists at the top of the rendered items in the DOM.  

package.json

@@ -124,7 +124,7 @@
     "build": {
       "resources": [
         "virtual-repeat",
-        "virtual-repeat-next"
+        "infinite-scroll-next"
       ]
     },
     "documentation": {

src/aurelia-ui-virtualization.js

@@ -1,14 +1,14 @@
 import {VirtualRepeat} from './virtual-repeat';
-import {VirtualRepeatNext} from './virtual-repeat-next';
+import {InfiniteScrollNext} from './infinite-scroll-next';
 
 export function configure(config) {
   config.globalResources(
     './virtual-repeat',
-    './virtual-repeat-next'
+    './infinite-scroll-next'
   );
 }
 
 export {
   VirtualRepeat,
-  VirtualRepeatNext
+  InfiniteScrollNext
 };

src/virtual-repeat-next.js renamed to src/infinite-scroll-next.js

@@ -2,8 +2,8 @@ import {customAttribute} from 'aurelia-templating';
 
 //Placeholder attribute to prohibit use of this attribute name in other places
 
-@customAttribute('virtual-repeat-next')
-export class VirtualRepeatNext {
+@customAttribute('infinite-scroll-next')
+export class InfiniteScrollNext {
 
   constructor() {}
 

src/virtual-repeat.js

@@ -273,7 +273,7 @@ export class VirtualRepeat extends AbstractRepeater {
       if (!this._calledGetMore) {
         let executeGetMore = () => {
           this._calledGetMore = true;
-          let func = (this.view(0) && this.view(0).firstChild.au) ? this.view(0).firstChild.au['virtual-repeat-next'].instruction.attributes['virtual-repeat-next'] : undefined;
+          let func = (this.view(0) && this.view(0).firstChild.au) ? this.view(0).firstChild.au['infinite-scroll-next'].instruction.attributes['infinite-scroll-next'] : undefined;
           let topIndex = this._first;
           let isAtBottom = this._bottomBufferHeight === 0;
           let isAtTop = this._isAtTop;
@@ -288,7 +288,7 @@ export class VirtualRepeat extends AbstractRepeater {
           if (func === undefined) {
             return null;
           } else if (typeof func === 'string') {
-            let getMoreFuncName = this.view(0).firstChild.getAttribute('virtual-repeat-next');
+            let getMoreFuncName = this.view(0).firstChild.getAttribute('infinite-scroll-next');
             let funcCall = this.scope.overrideContext.bindingContext[getMoreFuncName];
 
             if (typeof funcCall === 'function') {
@@ -301,13 +301,13 @@ export class VirtualRepeat extends AbstractRepeater {
                 });
               }
             } else {
-              throw new Error("'virtual-repeat-next' must be a function or evaluate to one");
+              throw new Error("'infinite-scroll-next' must be a function or evaluate to one");
             }
           } else if (func.sourceExpression) {
             this._calledGetMore = false; //Reset for the next time
             return func.sourceExpression.evaluate(this.scope);
           } else {
-            throw new Error("'virtual-repeat-next' must be a function or evaluate to one");
+            throw new Error("'infinite-scroll-next' must be a function or evaluate to one");
           }
           return null;
         };

test/virtual-repeat-integration.spec.js

@@ -450,21 +450,21 @@ describe('VirtualRepeat Integration', () => {
       spyOn(nestedVm, 'getNextPage').and.callThrough();
 
       component = StageComponent
-        .withResources(['src/virtual-repeat', 'src/virtual-repeat-next'])
+        .withResources(['src/virtual-repeat', 'src/infinite-scroll-next'])
         .inView(`<div id="scrollContainer" style="height: 500px; overflow-y: scroll">
-                      <div style="height: ${itemHeight}px;" virtual-repeat.for="item of items" virtual-repeat-next="getNextPage">\${item}</div>
+                      <div style="height: ${itemHeight}px;" virtual-repeat.for="item of items" infinite-scroll-next="getNextPage">\${item}</div>
                   </div>`)
         .boundTo(vm);
       nestedComponent = StageComponent
-        .withResources(['src/virtual-repeat', 'src/virtual-repeat-next'])
+        .withResources(['src/virtual-repeat', 'src/infinite-scroll-next'])
         .inView(`<div id="scrollContainerNested" style="height: 500px; overflow-y: scroll" repeat.for="foo of bar">
-                      <div style="height: ${itemHeight}px;" virtual-repeat.for="item of items" virtual-repeat-next.call="$parent.getNextPage($scrollContext)">\${item}</div>
+                      <div style="height: ${itemHeight}px;" virtual-repeat.for="item of items" infinite-scroll-next.call="$parent.getNextPage($scrollContext)">\${item}</div>
                   </div>`)
         .boundTo(nestedVm);
       promisedComponent = StageComponent
-        .withResources(['src/virtual-repeat', 'src/virtual-repeat-next'])
+        .withResources(['src/virtual-repeat', 'src/infinite-scroll-next'])
         .inView(`<div id="scrollContainerPromise" style="height: 500px; overflow-y: scroll">
-                      <div style="height: ${itemHeight}px;" virtual-repeat.for="item of items" virtual-repeat-next="getNextPage">\${item}</div>
+                      <div style="height: ${itemHeight}px;" virtual-repeat.for="item of items" infinite-scroll-next="getNextPage">\${item}</div>
                   </div>`)
         .boundTo(promisedVm);