From 81616aef925e92162d9f7a34194c825decb5154c Mon Sep 17 00:00:00 2001 From: Oren Farhi Date: Mon, 27 Nov 2017 21:04:31 +0200 Subject: [PATCH] version 0.7.0 --- CHANGELOG.md | 6 ++++++ example/bs-config.json | 13 ++++++++++--- example/src/main.ts | 5 +++-- example/src/test.inner.ts | 12 +++++++----- example/src/test.ts | 18 ++++++++++++------ example/style.css | 4 ++++ package.json | 13 ++++++++----- src/modules/infinite-scroll.directive.ts | 1 - src/services/scroll-register.ts | 4 ---- tests/services/scroll-register.spec.ts | 1 - 10 files changed, 50 insertions(+), 27 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 75396f00..93b70c2c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,9 @@ +## v 0.7.0 (2017/11/27) +* [ADD] - watch changes for: infiniteScrollDisabled - fix #196 +* [ADD] - watch changes for: infiniteScrollDistance - fix #202 +* [FIX] - fix for IE11 - fix #203 +* [REFACTOR] - "disable" now removes the scroll listener instead of rxjs/filter + ## v 0.6.1 (2017/10/20) * [REFACTOR] - updated code to be functional based * [FIX] - fix #67, fix #191, fix #190 diff --git a/example/bs-config.json b/example/bs-config.json index 4cfec2fa..57403291 100644 --- a/example/bs-config.json +++ b/example/bs-config.json @@ -1,5 +1,12 @@ { "port": 8000, - "files": ["./example**/*.{html,htm,css,js,ts,map}"], - "server": ["./example", "./dist/bundles"] -} + "files": [ + "./example**/*.{html,htm,css,js,ts,map}", + "./example/src/**/*.{html,htm,css,js,ts,map}", + "./dist/bundles**/*.{html,htm,css,js,ts,map}" + ], + "server": [ + "./example", + "./dist/bundles" + ] +} \ No newline at end of file diff --git a/example/src/main.ts b/example/src/main.ts index c17c3d91..752dd63c 100644 --- a/example/src/main.ts +++ b/example/src/main.ts @@ -1,6 +1,7 @@ // main entry point import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; +import { FormsModule } from '@angular/forms'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { InfiniteScrollModule } from 'ngx-infinite-scroll'; @@ -10,9 +11,9 @@ import { TestInnerComponent } from './test.inner'; @NgModule({ declarations: [AppComponent, TestComponent, TestInnerComponent], - imports: [BrowserModule, InfiniteScrollModule], + imports: [BrowserModule, InfiniteScrollModule, FormsModule], bootstrap: [AppComponent] }) -export class AppModule {} +export class AppModule { } platformBrowserDynamic().bootstrapModule(AppModule); diff --git a/example/src/test.inner.ts b/example/src/test.inner.ts index 7b12ceef..16e0b23e 100644 --- a/example/src/test.inner.ts +++ b/example/src/test.inner.ts @@ -17,7 +17,8 @@ import { ListMaker } from './list.service'; [infiniteScrollThrottle]="throttle" (scrolled)="onScrollDown()" (scrolledUp)="onUp()"> -

{{ className }}{{ info }}

+

{{ className }}, {{ info }}

+

{{ info }}

{{ i }} @@ -34,21 +35,22 @@ export class TestInnerComponent { @Input() info = ''; array = this.listMaker.array; - throttle = 300; + throttle = 20; scrollDistance = 1; scrollUpDistance = 2; - constructor(public listMaker: ListMaker) {} + constructor(public listMaker: ListMaker) { } onScrollDown(ev) { - console.log('scrolled down!!', ev); + console.log(`scrolled down, from ${this.className} ${this.info}`); this.listMaker.setDirectionDown(); } onUp(ev) { - console.log('scrolled up!', ev); + console.log(`scrolled up, from ${this.className} ${this.info}`); this.listMaker.setDirectionUp(); } + generateWord() { return chance.word(); } diff --git a/example/src/test.ts b/example/src/test.ts index 7c06fc24..77e7bc09 100644 --- a/example/src/test.ts +++ b/example/src/test.ts @@ -12,12 +12,16 @@ import { ListMaker } from './list.service'; data-infinite-scroll [infiniteScrollContainer]="selector" [fromRoot]="fromRoot" + [infiniteScrollDisabled]="disableScroll" [infiniteScrollDistance]="scrollDistance" [infiniteScrollUpDistance]="scrollUpDistance" [infiniteScrollThrottle]="throttle" (scrolled)="onScrollDown()" (scrolledUp)="onUp()"> -

{{ className }}{{info}}

+

+ {{ className }}, {{info}} + +

{{ i }}

@@ -31,20 +35,22 @@ export class TestComponent { @Input() fromRoot = false; @Input() info = ''; + disableScroll = false; + array = this.listMaker.array; - throttle = 300; - scrollDistance = 1; + throttle = 20; + scrollDistance = 3; scrollUpDistance = 2; - constructor(public listMaker: ListMaker) {} + constructor(public listMaker: ListMaker) { } onScrollDown(ev) { - console.log('scrolled down!!', ev); + console.log(`scrolled down, from ${this.className} ${this.info}`); this.listMaker.setDirectionDown(); } onUp(ev) { - console.log('scrolled up!', ev); + console.log(`scrolled up, from ${this.className} ${this.info}`); this.listMaker.setDirectionUp(); } generateWord() { diff --git a/example/style.css b/example/style.css index c1e644a4..c6e14ddf 100644 --- a/example/style.css +++ b/example/style.css @@ -18,6 +18,10 @@ overflow: scroll; display: block; position: fixed; + transition: width .3s ease-out; +} +.fixed:hover { + width: 350px; } .fixed .info { position: fixed; diff --git a/package.json b/package.json index 1317a962..ff31204d 100644 --- a/package.json +++ b/package.json @@ -1,8 +1,7 @@ { "name": "ngx-infinite-scroll", - "version": "0.6.1", - "description": - "An infinite scroll directive for Angular compatible with AoT compilation and Tree shaking", + "version": "0.7.0", + "description": "An infinite scroll directive for Angular compatible with AoT compilation and Tree shaking", "main": "./bundles/ngx-infinite-scroll.umd.js", "module": "./modules/ngx-infinite-scroll.es5.js", "es2015": "./modules/ngx-infinite-scroll.js", @@ -28,7 +27,11 @@ "url": "https://github.com/orizens/ngx-infinite-scroll/issues" }, "homepage": "https://github.com/orizens/ngx-infinite-scroll", - "keywords": ["angular", "javascript", "typescript"], + "keywords": [ + "angular", + "javascript", + "typescript" + ], "license": "MIT", "peerDependencies": { "@angular/common": ">= 4.0.0", @@ -70,4 +73,4 @@ "sorcery": "0.10.0", "yargs": "7.0.2" } -} +} \ No newline at end of file diff --git a/src/modules/infinite-scroll.directive.ts b/src/modules/infinite-scroll.directive.ts index f2f3bacb..3fd6d615 100644 --- a/src/modules/infinite-scroll.directive.ts +++ b/src/modules/infinite-scroll.directive.ts @@ -75,7 +75,6 @@ export class InfiniteScrollDirective // tslint:disable-next-line:arrow-parens up: event => this.zone.run(() => this.scrolledUp.emit(event)) }, - filterBefore: () => !this.infiniteScrollDisabled, horizontal: this.horizontal, scrollContainer: this.infiniteScrollContainer, scrollWindow: this.scrollWindow, diff --git a/src/services/scroll-register.ts b/src/services/scroll-register.ts index 68a0aae4..e2234e9f 100644 --- a/src/services/scroll-register.ts +++ b/src/services/scroll-register.ts @@ -18,7 +18,6 @@ import { getScrollStats, updateScrollPosition } from './scroll-resolver'; export interface IScrollRegisterConfig { container: ContainerRef; throttleDuration: number; - filterBefore: () => boolean; mergeMap: Function; scrollHandler: (value: any) => void; } @@ -31,7 +30,6 @@ export interface IScroller { scrollWindow: boolean; element: ElementRef; scrollContainer: string | ElementRef; - filterBefore: () => boolean; alwaysCallback: boolean; downDistance: number; upDistance: number; @@ -46,7 +44,6 @@ export function attachScrollEvent( ): Subscription { return Observable.fromEvent(options.container, 'scroll') .sampleTime(options.throttleDuration) - .filter(options.filterBefore) .mergeMap((ev: any) => Observable.of(options.mergeMap(ev))) .subscribe(options.scrollHandler); } @@ -68,7 +65,6 @@ export function createScroller(config: IScroller): Subscription { }; const options: IScrollRegisterConfig = { container: resolver.container, - filterBefore: config.filterBefore, mergeMap: () => calculatePoints(config.element, resolver), scrollHandler: (positionStats: IPositionStats) => handleOnScroll(scrollPosition, positionStats, config), diff --git a/tests/services/scroll-register.spec.ts b/tests/services/scroll-register.spec.ts index 6ed6362b..4fd2dac7 100644 --- a/tests/services/scroll-register.spec.ts +++ b/tests/services/scroll-register.spec.ts @@ -31,7 +31,6 @@ describe('Scroll Regsiter', () => { const mockDom = createMockDom(); const scrollConfig: IScrollRegisterConfig = { container: mockDom.container.nativeElement, - filterBefore: () => true, mergeMap: (e: any) => e, scrollHandler: (ev: any) => ev, throttleDuration: 300,