From 6a6c9f6c1eb3e381c542ea2b3f5725f1fff007cd Mon Sep 17 00:00:00 2001 From: Oren Farhi Date: Wed, 19 Apr 2017 19:33:00 +0300 Subject: [PATCH] version 0.4.2 --- CHANGELOG.md | 5 + README.md | 5 +- old/.eslintrc.json | 43 ---- old/.travis.yml | 14 -- old/CHANGELOG.md | 27 --- old/LICENSE | 21 -- old/README.md | 148 -------------- old/angular2-infinite-scroll.ts | 17 -- old/config/helpers.js | 32 --- old/config/karma.conf.js | 73 ------- old/config/spec-bundle.js | 59 ------ old/config/testing-utils.js | 46 ----- old/config/webpack.test.js | 103 ---------- old/karma-test-shim.js | 147 -------------- old/karma.conf.js | 2 - old/make.js | 36 ---- old/package.json | 74 ------- old/src/axis-resolver.spec.ts | 47 ----- old/src/axis-resolver.ts | 22 --- old/src/index.ts | 20 -- old/src/infinite-scroll.spec.ts | 185 ------------------ old/src/infinite-scroll.ts | 109 ----------- old/src/models.ts | 31 --- old/src/position-resolver.spec.ts | 75 ------- old/src/position-resolver.ts | 116 ----------- old/src/scroll-register.spec.ts | 44 ----- old/src/scroll-register.ts | 33 ---- old/src/scroll-resolver.ts | 33 ---- old/src/tsconfig.json | 28 --- old/tsconfig.json | 47 ----- package.json | 4 +- ...scroll.ts => infinite-scroll.directive.ts} | 5 +- src/modules/ngx-infinite-scroll.module.ts | 2 +- src/ngx-infinite-scroll.ts | 2 +- ...c.ts => infinite-scroll.directive.spec.ts} | 2 +- tslint.json | 3 +- 36 files changed, 17 insertions(+), 1643 deletions(-) delete mode 100644 old/.eslintrc.json delete mode 100644 old/.travis.yml delete mode 100644 old/CHANGELOG.md delete mode 100644 old/LICENSE delete mode 100644 old/README.md delete mode 100644 old/angular2-infinite-scroll.ts delete mode 100644 old/config/helpers.js delete mode 100644 old/config/karma.conf.js delete mode 100644 old/config/spec-bundle.js delete mode 100644 old/config/testing-utils.js delete mode 100644 old/config/webpack.test.js delete mode 100644 old/karma-test-shim.js delete mode 100644 old/karma.conf.js delete mode 100644 old/make.js delete mode 100644 old/package.json delete mode 100644 old/src/axis-resolver.spec.ts delete mode 100644 old/src/axis-resolver.ts delete mode 100644 old/src/index.ts delete mode 100644 old/src/infinite-scroll.spec.ts delete mode 100644 old/src/infinite-scroll.ts delete mode 100644 old/src/models.ts delete mode 100644 old/src/position-resolver.spec.ts delete mode 100644 old/src/position-resolver.ts delete mode 100644 old/src/scroll-register.spec.ts delete mode 100644 old/src/scroll-register.ts delete mode 100644 old/src/scroll-resolver.ts delete mode 100644 old/src/tsconfig.json delete mode 100644 old/tsconfig.json rename src/modules/{infinite-scroll.ts => infinite-scroll.directive.ts} (97%) rename tests/modules/{infinite-scroll.spec.ts => infinite-scroll.directive.spec.ts} (99%) diff --git a/CHANGELOG.md b/CHANGELOG.md index 36b6b4a8..6d96546b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,8 @@ +## v 0.4.2 (2017/04/19) +* [NEW] - added **'[infiniteScroll]'** by [Angular's styleguide](https://angular.io/docs/ts/latest/guide/style-guide.html#!#02-06). **[infinite-scroll]** will be deprecated in future version. +* reduced bundle size with imports for RxJS Observable and Subscription objects #126. +* removed old code directory from repo + ## v 0.4.1 (2017/04/13) * Fixes #147 - (__InfiniteScrollModule is not an NgModule__) diff --git a/README.md b/README.md index db25d4b1..514438b7 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,11 @@ -[![Build Status](https://travis-ci.org/orizens/ngx-infinite-scroll.svg?branch=master)](https://travis-ci.org/orizens/angular2-infinite-scroll) +[![Build Status](https://travis-ci.org/orizens/ngx-infinite-scroll.svg?branch=master)](https://travis-ci.org/orizens/ngx-infinite-scroll) # Angular Infinite Scroll Inspired by [ng-infinite-scroll](https://github.com/sroze/ngInfiniteScroll) directive for angular (> 2, 4). ## Angular Support -Supports in Angular **> +2, 4 etc..** +Supports in Angular **> 4** +For Angular (<= 2.3.1), you can use ```npm i angular2-infinite-scroll``` (latest version is 0.3.42) - please notice **the angular2-infinite-scroll** package is deprecated ## Angular Consulting Services I'm a Senior Javascript Engineer & A Front End Consultant at [Orizens](http://orizens.com). diff --git a/old/.eslintrc.json b/old/.eslintrc.json deleted file mode 100644 index 39490024..00000000 --- a/old/.eslintrc.json +++ /dev/null @@ -1,43 +0,0 @@ -{ - "parserOptions": { - "sourceType": "module", - "ecmaVersion": 6, - "ecmaFeatures": { - "modules": true, - "arrowFunctions": true, - "blockBindings": true, - "destructuring": true, - "classes": true - } - }, - "rules": { - "indent": [ - "error", - 2 - ], - "quotes": [ - 2, - "single" - ], - "linebreak-style": [ - 2, - "unix" - ], - "semi": [ - 2, - "always" - ] - }, - "env": { - "es6": true, - "browser": true, - "jasmine": true, - "commonjs": true, - "node": true - }, - "globals": { - "inject": true, - "jasmine": true - }, - "extends": "eslint:recommended" -} diff --git a/old/.travis.yml b/old/.travis.yml deleted file mode 100644 index ac1c2de6..00000000 --- a/old/.travis.yml +++ /dev/null @@ -1,14 +0,0 @@ -language: node_js -sudo: false -node_js: -- '5.9.1' - -install: -- npm install - -after_script: -- process.exit() - -cache: - directories: - - $HOME/.nvm \ No newline at end of file diff --git a/old/CHANGELOG.md b/old/CHANGELOG.md deleted file mode 100644 index 49e8a5b2..00000000 --- a/old/CHANGELOG.md +++ /dev/null @@ -1,27 +0,0 @@ -## v 0.3.3 (2017/03/01) - -### Updates -* reverted the fix of #126 - -## v 0.3.2 (2017/03/01) - -### Updates -* fixes [#126](https://github.com/orizens/angular2-infinite-scroll/issues/126) - -## v 0.3.1 (2017/02/15) - -### Updates -* added custom scrollable container from [#108](https://github.com/orizens/angular2-infinite-scroll/pull/108/files) - -## v 0.3.0 (2017/01/31) - -### Updates -* refactored infinite scroller to smaller modules with composition -* added "models" - includes interfaces for development - -## v 0.2.9 (2017/01/13) - -### Updates -* added changelog.md -* ([refactor(scroll): replaces throttle with debounce](https://github.com/orizens/angular2-infinite-scroll/pull/82)) - diff --git a/old/LICENSE b/old/LICENSE deleted file mode 100644 index 5ef2594b..00000000 --- a/old/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -MIT License - -Copyright (c) 2016 Oren Farhi - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. diff --git a/old/README.md b/old/README.md deleted file mode 100644 index ecce7fe6..00000000 --- a/old/README.md +++ /dev/null @@ -1,148 +0,0 @@ -[![Build Status](https://travis-ci.org/orizens/angular2-infinite-scroll.svg?branch=master)](https://travis-ci.org/orizens/angular2-infinite-scroll) - -# Angular Infinite Scroll -Inspired by [ng-infinite-scroll](https://github.com/sroze/ngInfiniteScroll) directive for angular (> 2). - -## Angular Support -Supports in Angular **> +2, 4** - -## Angular Consulting Services -I'm a Senior Javascript Engineer & A Front End Consultant at [Orizens](http://orizens.com). -My services include: -- consulting to companies and startups on how to approach code in their projects and keep it maintainable. -- I provide project bootstrapping and development - while afterwards, I integrate it on site and guide the team on it. - -[Contact Me Here](http://orizens.com/contact) - -## Installation -``` -npm install angular2-infinite-scroll --save -``` - -## Supported API -Currently supported attributes: -* **infiniteScrollDistance**<_number_> - (optional, default: **2**) - should get a number, the number of viewport lenghts from the bottom of the page at which the event will be triggered. -* **infiniteScrollUpDistance**<_number_> - (optional, default: **1.5**) - should get a number -* **infiniteScrollThrottle**<_number_> - (optional, default: **300**) - should get a number of **milliseconds** for throttle. The event will be triggered this many milliseconds after the user *stops* scrolling. -* **infiniteScrollContainer**<_string|HTMLElement_> - (optional, default: null) - should get a html element or css selector for a scrollable element; window or current element will be used if this attribute is empty. -* **scrolled**<_function_> - this will callback if the distance threshold has been reached on a scroll down. -* **scrolledUp**<_function_> - (event: InfiniteScrollEvent) - this will callback if the distance threshold has been reached on a scroll up. -* **scrollWindow**<_boolean_> - (optional, default: **true**) - listens to the window scroll instead of the actual element scroll. this allows to invoke a callback function in the scope of the element while listenning to the window scroll. -* **immediateCheck**<_boolean_> - (optional, default: **false**) - invokes the handler immediately to check if a scroll event has been already triggred when the page has been loaded (i.e. - when you refresh a page that has been scrolled). -* **infiniteScrollDisabled**<_boolean_> - (optional, default: **false**) - doesn't invoke the handler if set to true - -## Behavior -By default, the directive listens to the **window scroll** event and invoked the callback. -**To trigger the callback when the actual element is scrolled**, these settings should be configured: -* [scrollWindow]="false" -* set an explict css "height" value to the element - -## DEMO -- [**Default Scroll** By Window - plunkr](https://plnkr.co/edit/DrEDetYnZkFxR7OWWrxS?p=preview) -- [Scroll On a **"Modal"** - plunkr](https://plnkr.co/edit/QnQOwE9SEapwJCCFII3L?p=preview) - -## Usage -First, import the InfiniteScrollModule to your module: - -```typescript -import { NgModule } from '@angular/core'; -import { BrowserModule } from '@angular/platform-browser'; -import { InfiniteScrollModule } from 'angular2-infinite-scroll'; -import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; -import { AppComponent } from './app'; - -@NgModule({ - imports:[ BrowserModule, InfiniteScrollModule ], - declarations: [ AppComponent, ], - bootstrap: [ AppComponent ] -}) -export class AppModule { } - -platformBrowserDynamic().bootstrapModule(AppModule); -``` - -In this example, the **onScroll** callback will be invoked when the window is scrolled down: - -```typescript -import { Component } from '@angular/core'; - -@Component({ - selector: 'app', - template: ` -
-
- ` -}) -export class AppComponent { - onScroll () { - console.log('scrolled!!') - } -} -``` -in this example, whenever the "search-results" is scrolled, the callback will be invoked: - -```typescript -import { Component } from '@angular/core'; - -@Component({ - selector: 'app', - styles: [ - `.search-results { - height: 20rem; - overflow: scroll; - }` - ], - template: ` -
-
- ` -}) -export class AppComponent { - onScroll () { - console.log('scrolled!!') - } -} -``` - -In this example, the **onScrollDown** callback will be invoked when the window is scrolled down and the **onScrollUp** callback will be invoked when the window is scrolled up: - -```typescript -import { Component } from '@angular/core'; -import { InfiniteScroll } from 'angular2-infinite-scroll'; - -@Component({ - selector: 'app', - directives: [ InfiniteScroll ], - template: ` -
-
- ` -}) -export class AppComponent { - onScrollDown () { - console.log('scrolled down!!') - } - - onScrollUp () { - console.log('scrolled up!!') - } -} -``` - -# Showcase Examples -* [Echoes Player Ng2 Version](http://orizens.github.io/echoes-ng2) ([github repo for echoes player](http://github.com/orizens/echoes-ng2)) diff --git a/old/angular2-infinite-scroll.ts b/old/angular2-infinite-scroll.ts deleted file mode 100644 index 8cfe63ef..00000000 --- a/old/angular2-infinite-scroll.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { InfiniteScroll } from './src/infinite-scroll'; -import { PositionResolver } from './src/position-resolver'; -import { AxisResolver } from './src/axis-resolver'; -import { ScrollRegister } from './src/scroll-register'; -import { ScrollResolver } from './src/scroll-resolver'; - -export { InfiniteScroll } from './src/infinite-scroll'; -export { PositionResolver, PositionResolverFactory } from './src/position-resolver'; -export { AxisResolver, AxisResolverFactory } from './src/axis-resolver'; -export { InfiniteScrollModule } from './src/index'; -export { ScrollRegister } from './src/scroll-register'; -export { ScrollResolver } from './src/scroll-resolver'; -export * from './src/models'; - -export default { - directives: [ InfiniteScroll, AxisResolver, PositionResolver ] -} \ No newline at end of file diff --git a/old/config/helpers.js b/old/config/helpers.js deleted file mode 100644 index 8bfb58e3..00000000 --- a/old/config/helpers.js +++ /dev/null @@ -1,32 +0,0 @@ -/** - * taken from angular2-webpack-starter - */ -var path = require('path'); - -// Helper functions -var ROOT = path.resolve(__dirname, '..'); - -function hasProcessFlag(flag) { - return process.argv.join('').indexOf(flag) > -1; -} - -function isWebpackDevServer() { - return process.argv[1] && !! (/webpack-dev-server$/.exec(process.argv[1])); -} - -function root(args) { - args = Array.prototype.slice.call(arguments, 0); - return path.join.apply(path, [ROOT].concat(args)); -} - -function checkNodeImport(context, request, cb) { - if (!path.isAbsolute(request) && request.charAt(0) !== '.') { - cb(null, 'commonjs ' + request); return; - } - cb(); -} - -exports.hasProcessFlag = hasProcessFlag; -exports.isWebpackDevServer = isWebpackDevServer; -exports.root = root; -exports.checkNodeImport = checkNodeImport; diff --git a/old/config/karma.conf.js b/old/config/karma.conf.js deleted file mode 100644 index e31ee97d..00000000 --- a/old/config/karma.conf.js +++ /dev/null @@ -1,73 +0,0 @@ -const singleRun = process.env.NODE_ENV !== 'bdd'; - -module.exports = function(config) { - var testWebpackConfig = require('./webpack.test.js'); - - var configuration = { - basePath: '', - - frameworks: ['jasmine'], - - // list of files to exclude - exclude: [ ], - - /* - * list of files / patterns to load in the browser - * - * we are building the test environment in ./spec-bundle.js - */ - files: [ { pattern: './config/spec-bundle.js', watched: false } ], - - preprocessors: { './config/spec-bundle.js': ['webpack', 'sourcemap'] }, - - // Webpack Config at ./webpack.test.js - webpack: testWebpackConfig, - - // coverageReporter: { - // dir : 'coverage/', - // reporters: [ - // { type: 'text-summary' }, - // { type: 'json' }, - // { type: 'html' } - // ] - // }, - - // Webpack please don't spam the console when running in karma! - webpackServer: { noInfo: true }, - - // reporters: [ 'mocha', 'coverage' ], - reporters: [ 'mocha' ], - - // web server port - port: 9876, - - colors: true, - - /* - * level of logging - * possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG - */ - logLevel: config.LOG_INFO, - - autoWatch: true, - - browsers: [ - 'PhantomJS' - ], - - // customLaunchers: { - // Chrome_travis_ci: { - // base: 'Chrome', - // flags: ['--no-sandbox'] - // } - // }, - - singleRun: singleRun - }; - - // if(process.env.TRAVIS){ - // configuration.browsers = ['Chrome_travis_ci']; - // } - - config.set(configuration); -}; diff --git a/old/config/spec-bundle.js b/old/config/spec-bundle.js deleted file mode 100644 index 9898ff97..00000000 --- a/old/config/spec-bundle.js +++ /dev/null @@ -1,59 +0,0 @@ -/* - * When testing with webpack and ES6, we have to do some extra - * things to get testing to work right. Because we are gonna write tests - * in ES6 too, we have to compile those as well. That's handled in - * karma.conf.js with the karma-webpack plugin. This is the entry - * file for webpack test. Just like webpack will create a bundle.js - * file for our client, when we run test, it will compile and bundle them - * all here! Crazy huh. So we need to do some setup - */ -Error.stackTraceLimit = Infinity; - -require('core-js/es6'); -require('core-js/es7/reflect'); - -// Typescript emit helpers polyfill -require('ts-helpers'); - -require('zone.js/dist/zone'); -require('zone.js/dist/long-stack-trace-zone'); -require('zone.js/dist/async-test'); -require('zone.js/dist/fake-async-test'); -require('zone.js/dist/sync-test'); -require('zone.js/dist/proxy'); // since zone.js 0.6.15 -require('zone.js/dist/jasmine-patch'); // put here since zone.js 0.6.14 - -// RxJS -require('rxjs/Rx'); - -var testing = require('@angular/core/testing'); -var browser = require('@angular/platform-browser-dynamic/testing'); - -testing.TestBed.initTestEnvironment( - browser.BrowserDynamicTestingModule, - browser.platformBrowserDynamicTesting() -); - -/* - * Ok, this is kinda crazy. We can use the context method on - * require that webpack created in order to tell webpack - * what files we actually want to require or import. - * Below, context will be a function/object with file names as keys. - * Using that regex we are saying look in ../src then find - * any file that ends with spec.ts and get its path. By passing in true - * we say do this recursively - */ -var testContext = require.context('../src', true, /\.spec\.ts/); -console.log(testContext); - -/* - * get all the files, for each file, call the context function - * that will require the file and load it up here. Context will - * loop and require those spec files here - */ -function requireAll(requireContext) { - return requireContext.keys().map(requireContext); -} - -// requires and returns all modules that match -var modules = requireAll(testContext); diff --git a/old/config/testing-utils.js b/old/config/testing-utils.js deleted file mode 100644 index 36856706..00000000 --- a/old/config/testing-utils.js +++ /dev/null @@ -1,46 +0,0 @@ -/// - -/* - Temporary fiile for referencing the TypeScript defs for Jasmine + some potentially - utils for testing. Will change/adjust this once I find a better way of doing - */ - -declare module jasmine { - interface Matchers { - toHaveText(text: string): boolean; - toContainText(text: string): boolean; - } -} - -beforeEach(() => { - jasmine.addMatchers({ - - toHaveText: function() { - return { - compare: function(actual, expectedText) { - var actualText = actual.textContent; - return { - pass: actualText === expectedText, - get message() { - return 'Expected ' + actualText + ' to equal ' + expectedText; - } - }; - } - }; - }, - - toContainText: function() { - return { - compare: function(actual, expectedText) { - var actualText = actual.textContent; - return { - pass: actualText.indexOf(expectedText) > -1, - get message() { - return 'Expected ' + actualText + ' to contain ' + expectedText; - } - }; - } - }; - } - }); -}); diff --git a/old/config/webpack.test.js b/old/config/webpack.test.js deleted file mode 100644 index be0bb069..00000000 --- a/old/config/webpack.test.js +++ /dev/null @@ -1,103 +0,0 @@ -/** - * Adapted from angular2-webpack-starter - */ - -const helpers = require('./helpers'); - -/** - * Webpack Plugins - */ -const ProvidePlugin = require('webpack/lib/ProvidePlugin'); -const DefinePlugin = require('webpack/lib/DefinePlugin'); - -const ENV = process.env.ENV = process.env.NODE_ENV = 'test'; - -module.exports = { - - /** - * Source map for Karma from the help of karma-sourcemap-loader & karma-webpack - * - * Do not change, leave as is or it wont work. - * See: https://github.com/webpack/karma-webpack#source-maps - */ - devtool: 'inline-source-map', - - - resolve: { - extensions: ['', '.ts', '.js'], - root: helpers.root('') - }, - - module: { - - preLoaders: [ - // { - // test: /\.ts$/, - // loader: 'tslint-loader', - // exclude: [helpers.root('node_modules')] - // }, - { - test: /\.js$/, - loader: 'source-map-loader', - exclude: [ - // these packages have problems with their sourcemaps - helpers.root('node_modules/rxjs'), - helpers.root('node_modules/@angular') - ] - } - ], - - loaders: [ - { - test: /\.ts$/, - loader: 'awesome-typescript-loader', - query: { - compilerOptions: { - - // Remove TypeScript helpers to be injected - // below by DefinePlugin - removeComments: true - } - }, - exclude: [/\.e2e\.ts$/] - } - ] - - // postLoaders: [ - // { - // test: /\.(js|ts)$/, loader: 'istanbul-instrumenter-loader', - // include: helpers.root('src'), - // exclude: [ - // /\.(e2e|spec)\.ts$/, - // /node_modules/ - // ] - // } - // ] - }, - - plugins: [ - new DefinePlugin({ - 'ENV': JSON.stringify(ENV), - 'process.env': { - 'ENV': JSON.stringify(ENV) - } - }) - ], - - tslint: { - emitErrors: false, - failOnHint: false, - resourcePath: 'src' - }, - - - node: { - global: 'window', - process: false, - crypto: 'empty', - module: false, - clearImmediate: false, - setImmediate: false - } - -}; diff --git a/old/karma-test-shim.js b/old/karma-test-shim.js deleted file mode 100644 index ac5f15c6..00000000 --- a/old/karma-test-shim.js +++ /dev/null @@ -1,147 +0,0 @@ -/*global jasmine, __karma__, window*/ -Error.stackTraceLimit = Infinity; -jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000; - -__karma__.loaded = function () { -}; - - -function isJsFile(path) { - return path.slice(-3) == '.js'; -} - -function isSpecFile(path) { - return path.slice(-8) == '.spec.js'; -} - -function isBuiltFile(path) { - var builtPath = '/base/src/'; - return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath); -} - -var allSpecFiles = Object.keys(window.__karma__.files) - .filter(isSpecFile) - .filter(isBuiltFile); - -// Load our SystemJS configuration. -System.config({ - baseURL: '/base' -}); - -System.config({ - map: { - 'rxjs': 'node_modules/rxjs', - '@angular': 'node_modules/@angular', - 'app': 'src' - }, - packages: { - 'app': { - main: 'main.js', - defaultExtension: 'js' - }, - '@angular/core': { - main: 'index.js', - defaultExtension: 'js' - }, - '@angular/compiler': { - main: 'index.js', - defaultExtension: 'js' - }, - '@angular/common': { - main: 'index.js', - defaultExtension: 'js' - }, - '@angular/platform-browser': { - main: 'index.js', - defaultExtension: 'js' - }, - '@angular/platform-browser-dynamic': { - main: 'index.js', - defaultExtension: 'js' - }, - // '@angular/router-deprecated': { - // main: 'index.js', - // defaultExtension: 'js' - // }, - // '@angular/router': { - // main: 'index.js', - // defaultExtension: 'js' - // }, - 'rxjs': { - defaultExtension: 'js' - } - } -}); -// -// Promise.all([ -// // System.import('@angular/core/testing'), -// System.import('@angular/platform-browser-dynamic/testing') -// ]).then(function (providers) { -// var testing = providers[0]; -// var testingBrowser = providers[1]; -// -// testing.setBaseTestProviders(testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, -// testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS); -// -// }).then(function() { -// // Finally, load all spec files. -// // This will run the tests directly. -// return Promise.all( -// allSpecFiles.map(function (moduleName) { -// return System.import(moduleName); -// })); -// }).then(__karma__.start, __karma__.error); - -// Tun on full stack traces in errors to help debugging -// Error.stackTraceLimit = Infinity; -// -// jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000; -// -// // // Cancel Karma's synchronous start, -// // // we will call `__karma__.start()` later, once all the specs are loaded. -// __karma__.loaded = function() {}; -// -// System.config({ -// packages: { -// 'base/dist': { -// defaultExtension: false, -// format: 'cjs', -// map: Object.keys(window.__karma__.files).filter(onlyAppFiles).reduce(createPathRecords, {}) -// } -// } -// }); - -System.import('@angular/core/testing') - // .then(function(browser_adapter) { browser_adapter.BrowserDomAdapter.makeCurrent(); }) - .then(function() { return Promise.all(resolveTestFiles()); }) - .then(function() { __karma__.start(); }, function(error) { __karma__.error(error.stack || error); }); - -// function createPathRecords(pathsMapping, appPath) { -// // creates local module name mapping to global path with karma's fingerprint in path, e.g.: -// // './vg-player/vg-player': -// // '/base/dist/vg-player/vg-player.js?f4523daf879cfb7310ef6242682ccf10b2041b3e' -// var pathParts = appPath.split('/'); -// var moduleName = './' + pathParts.slice(Math.max(pathParts.length - 2, 1)).join('/'); -// moduleName = moduleName.replace(/\.js$/, ''); -// pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]; -// return pathsMapping; -// } -// -// function onlyAppFiles(filePath) { -// return /\/base\/dist\/(?!.*\.spec\.js$).*\.js$/.test(filePath); -// } - -function onlySpecFiles(path) { - return /\.spec\.js$/.test(path); -} - -function resolveTestFiles() { - return Object.keys(window.__karma__.files) // All files served by Karma. - .filter(onlySpecFiles) - .filter(isBuiltFile) - .map(function(moduleName) { - // loads all spec files via their global module names (e.g. - // 'base/dist/vg-player/vg-player.spec') - return System.import(moduleName); - }); -} diff --git a/old/karma.conf.js b/old/karma.conf.js deleted file mode 100644 index 75eda637..00000000 --- a/old/karma.conf.js +++ /dev/null @@ -1,2 +0,0 @@ -// Look in ./config for karma.conf.js -module.exports = require('./config/karma.conf.js'); diff --git a/old/make.js b/old/make.js deleted file mode 100644 index a4e57ed8..00000000 --- a/old/make.js +++ /dev/null @@ -1,36 +0,0 @@ -var pkg = require('./package.json'); -var path = require('path'); -var Builder = require('systemjs-builder'); -var name = pkg.name; - -var builder = new Builder(); -var config = { - baseURL: '.', - transpiler: 'typescript', - typescriptOptions: { - module: 'cjs' - }, - map: { - typescript: './node_modules/typescript/lib/typescript.js', - '@angular': path.resolve('node_modules/@angular'), - rxjs: path.resolve('node_modules/rxjs') - }, - paths: { - '*': '*.js' - }, - meta: { - 'node_modules/@angular/*': { build: false }, - 'node_modules/rxjs/*': { build: false } - }, -}; - -builder.config(config); - -builder -.bundle(name, path.resolve(__dirname, 'bundles/', name + '.js')) -.then(function() { - console.log('Build complete.'); -}) -.catch(function(err) { - console.log('Error', err); -}); \ No newline at end of file diff --git a/old/package.json b/old/package.json deleted file mode 100644 index 5bcce568..00000000 --- a/old/package.json +++ /dev/null @@ -1,74 +0,0 @@ -{ - "name": "angular2-infinite-scroll", - "version": "0.3.4", - "description": "An infinite scroll directive for angular2", - "main": "angular2-infinite-scroll.js", - "typings": "./angular2-infinite-scroll.d.ts", - "repository": "orizens/angular2-infinite-scroll", - "scripts": { - "build:test": "tsc --project ./src", - "clean": "npm run clean:jsfiles && npm run clean:typefiles && npm run clean:metadata", - "clean:jsfiles": "rimraf src/*.js && rimraf ./*scroll.js", - "clean:typefiles": "rimraf src/*.d.ts && rimraf ./*scroll.d.ts", - "clean:node": "rimraf node_modules", - "clean:metadata": "rimraf ./*metadata.json && rimraf src/ngfactory && rimraf ./src/*.metadata.json", - "bdd": "NODE_ENV='bdd' karma start karma.conf.js", - "lite": "lite-server", - "postversion": "git push origin master", - "prepublish": "node ./node_modules/@angular/compiler-cli/src/main.js && node make.js", - "pretest": "npm run clean", - "preversion": "npm run clean && npm run prepublish && npm test", - "setup": "npm run typings -- install", - "start": "npm run build && npm run lite", - "test": "karma start karma.conf.js", - "version": "git add ./", - "watch": "tsc --project ./src --watch" - }, - "keywords": [ - "angular2", - "scroll", - "infinite" - ], - "author": "Oren Farhi", - "license": "MIT", - "devDependencies": { - "@angular/common": "2.3.1", - "@angular/compiler": "2.3.1", - "@angular/compiler-cli": "2.3.1", - "@angular/core": "2.3.1", - "@angular/platform-browser": "2.3.1", - "@angular/platform-browser-dynamic": "2.3.1", - "@types/core-js": "0.9.32", - "@types/jasmine": "2.2.33", - "@types/node": "6.0.38", - "autodts": "0.0.6", - "awesome-typescript-loader": "2.2.4", - "es6-promise": "3.0.2", - "es6-shim": "0.33.3", - "istanbul-instrumenter-loader": "^1.0.0", - "jasmine-core": "2.4.1", - "karma": "^0.13.22", - "karma-chrome-launcher": "^1.0.1", - "karma-cli": "^1.0.0", - "karma-jasmine": "^1.0.2", - "karma-mocha-reporter": "2.0.4", - "karma-phantomjs-launcher": "1.0.0", - "karma-sourcemap-loader": "^0.3.7", - "karma-webpack": "^1.8.0", - "lite-server": "2.2.0", - "path": "^0.12.7", - "phantomjs-prebuilt": "^2.1.7", - "reflect-metadata": "0.1.2", - "rimraf": "2.5.2", - "rxjs": "5.0.2", - "source-map-loader": "^0.1.5", - "systemjs": "0.19.31", - "systemjs-builder": "^0.15.16", - "ts-helpers": "^1.1.1", - "tslint": "^3.15.1", - "tslint-loader": "^2.1.5", - "typescript": "2.0.3", - "webpack": "2.1.0-beta.21", - "zone.js": "^0.6.17" - } -} diff --git a/old/src/axis-resolver.spec.ts b/old/src/axis-resolver.spec.ts deleted file mode 100644 index 355817cc..00000000 --- a/old/src/axis-resolver.spec.ts +++ /dev/null @@ -1,47 +0,0 @@ -import { - async, - inject -} from '@angular/core/testing'; - -import { InfiniteScroll } from './infinite-scroll'; -import { AxisResolver } from './axis-resolver'; -import { ElementRef } from '@angular/core'; - -describe('AxisResolver Class', () => { - const makeMockElement = - (): ElementRef => { return new ElementRef(document.createElement('div'));}; - - const base_names = ['clientHeight', 'offsetHeight', 'scrollHeight']; - - it('should create an instance of AxisResolver', () => { - const testResolver = new AxisResolver(); - - expect(testResolver).toEqual(jasmine.any(AxisResolver)); - }); - - it('should default constructor arg to true', () => { - const defaultResolver = new AxisResolver(); - const verticalResolver = new AxisResolver(true); - const actual = defaultResolver.topKey(); - const expected = verticalResolver.topKey(); - - expect(actual).toBe(expected); - }); - - it('should change topKey() to "left" if created "horizontal"', () => { - const horizontalResolver = new AxisResolver(false); - const actual = horizontalResolver.topKey(); - const expected = 'left'; - expect(actual).toBe(expected); - }); - - it('should make Height into Width if created "horizontal"', () => { - const horizontalResolver = new AxisResolver(false); - const methodNames = base_names.map( (name) => name + 'Key' ); - const results = methodNames.map( (mName) => horizontalResolver[mName]() ); - const are_widths = results.map( (result) => result.match(/Width/) ); - - expect( are_widths.every( (elt) => elt ) ).toBe(true); - }); - -}) diff --git a/old/src/axis-resolver.ts b/old/src/axis-resolver.ts deleted file mode 100644 index 7792aee0..00000000 --- a/old/src/axis-resolver.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { Injectable, Inject } from '@angular/core'; - -@Injectable() -export class AxisResolverFactory { - constructor() { } - - create(vertical: boolean = true) { - return new AxisResolver(vertical); - } -} - -export class AxisResolver { - constructor(private vertical: boolean = true) { - } - clientHeightKey() { return this.vertical ? 'clientHeight' : 'clientWidth'; } - offsetHeightKey() { return this.vertical ? 'offsetHeight' : 'offsetWidth'; } - scrollHeightKey() { return this.vertical ? 'scrollHeight' : 'scrollWidth'; } - pageYOffsetKey() { return this.vertical ? 'pageYOffset' : 'pageXOffset'; } - offsetTopKey() { return this.vertical ? 'offsetTop' : 'offsetLeft'; } - scrollTopKey() { return this.vertical ? 'scrollTop' : 'scrollLeft'; } - topKey() { return this.vertical ? 'top' : 'left'; } -} diff --git a/old/src/index.ts b/old/src/index.ts deleted file mode 100644 index a1621c35..00000000 --- a/old/src/index.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { NgModule } from '@angular/core'; - -import { InfiniteScroll } from './infinite-scroll'; -import { AxisResolverFactory } from './axis-resolver'; -import { PositionResolverFactory } from './position-resolver'; -import { ScrollRegister } from './scroll-register'; -import { ScrollResolver } from './scroll-resolver'; - -@NgModule({ - imports: [], - declarations: [InfiniteScroll], - exports: [InfiniteScroll], - providers: [ - AxisResolverFactory, - PositionResolverFactory, - ScrollRegister, - ScrollResolver - ] -}) -export class InfiniteScrollModule { } diff --git a/old/src/infinite-scroll.spec.ts b/old/src/infinite-scroll.spec.ts deleted file mode 100644 index a9e95f06..00000000 --- a/old/src/infinite-scroll.spec.ts +++ /dev/null @@ -1,185 +0,0 @@ -import { - async, - inject -} from '@angular/core/testing'; -import { InfiniteScroll } from './infinite-scroll'; -import { AxisResolverFactory } from './axis-resolver'; -import { PositionResolverFactory } from './position-resolver'; -import { ScrollRegister } from './scroll-register'; -import { ScrollResolver } from './scroll-resolver'; - -import { ElementRef, NgZone, SimpleChanges, SimpleChange } from '@angular/core'; - -describe('Infinite Scroll Directive', () => { - // const zone = new NgZone({ enableLongStackTrace: false }); - let isScrollingDown = true; - let zoneSpy: any, scrollResolverSpy: any, scrollRegisterSpy: any, positionResolverSpy: any; - const positionFactoryMock: any = { - create: () => positionResolverSpy - }; - const createMockElement = () => { - const mockedElement: ElementRef = new ElementRef(document.createElement('div')); - return mockedElement; - }; - const createInfiniteScroll = (mockedElement?: any) => { - mockedElement = mockedElement || createMockElement(); - return new InfiniteScroll( - mockedElement, - zoneSpy, - positionFactoryMock, - scrollRegisterSpy, - scrollResolverSpy - ); - }; - - beforeEach(() =>{ - zoneSpy = jasmine.createSpyObj('zone', ['run']); - scrollResolverSpy = { - getScrollStats: () => { - return { shouldScroll: true, isScrollingDown }; - } - }; - scrollRegisterSpy = jasmine.createSpyObj('register', ['attachEvent']) - positionResolverSpy = jasmine.createSpyObj('pos', ['create', 'container']); - }); - - it('should create an instance of the directive', () => { - const actual = createInfiniteScroll(); - expect(actual).toBeDefined(); - }); - - it('should have default @Input properties values', () => { - const directive = createInfiniteScroll(); - const expectedInputs: Object = { - _distanceDown: 2, - _distanceUp: 1.5, - _throttle: 300, - scrollWindow: true, - _immediate: false, - _horizontal: false, - _alwaysCallback: false, - _disabled: false, - _container: null - }; - - Object.keys(expectedInputs).forEach(input => - expect(directive[input]).toEqual(expectedInputs[input])); - }); - - it('should trigger the onScrollDown event when scroll has passed _distancedDown', () => { - const directive = createInfiniteScroll(); - const container = { - height: 0, - scrolledUntilNow: 0, - totalToScroll: 0, - } - spyOn(directive, 'onScrollDown'); - directive.ngOnInit(); - directive.handleOnScroll(container) - const actual = directive.onScrollDown; - expect(actual).toHaveBeenCalled(); - }); - - it('should trigger the onScrollUp event when scroll has passed _distanceUp', () => { - const directive = createInfiniteScroll(); - const container = { - height: 0, - scrolledUntilNow: 0, - totalToScroll: 0, - }; - spyOn(directive, 'onScrollUp'); - directive.ngOnInit(); - isScrollingDown = false; - directive.handleOnScroll(container); - const actual = directive.onScrollUp; - expect(actual).toHaveBeenCalled(); - }); - - it('should disable the scroller', () => { - const directive = createInfiniteScroll(); - const container = { - height: 0, - scrolledUntilNow: 0, - totalToScroll: 0, - } - spyOn(directive, 'onScrollDown'); - directive.ngOnInit(); - directive._disabled = true; - directive.handleOnScroll(container); - const actual = directive.onScrollDown; - expect(actual).not.toHaveBeenCalled(); - }); - - describe('resolving container', () => { - let directive: InfiniteScroll; - let mockedElement: ElementRef; - const container = { - height: 0, - scrolledUntilNow: 0, - totalToScroll: 0, - }; - - beforeEach(() => { - mockedElement = createMockElement(); - directive = createInfiniteScroll(mockedElement); - spyOn(positionFactoryMock, 'create').and.callThrough(); - }); - - describe('when container input is defined', () => { - describe('when css selector is used', () => { - beforeEach(() => { - spyOn(document, 'querySelector').and.returnValue(container); - directive._container = '.test'; - directive.ngOnInit(); - }); - - it('should find element in DOM', () => { - expect(document.querySelector).toHaveBeenCalledWith('.test'); - }); - - it('should return container', () => { - expect(positionFactoryMock.create) - .toHaveBeenCalledWith(jasmine.objectContaining({windowElement: container})); - }); - }); - - describe('when container is passed directly', () => { - beforeEach(() => { - directive._container = container; - directive.ngOnInit(); - }); - - it('should return container', () => { - expect(positionFactoryMock.create) - .toHaveBeenCalledWith(jasmine.objectContaining({windowElement: container})); - }); - }); - }); - - describe('when container input is not defined', () => { - describe('when scrollWindow is true', () => { - beforeEach(() => { - directive.scrollWindow = true; - directive.ngOnInit(); - }); - - it('should return window', () => { - expect(positionFactoryMock.create) - .toHaveBeenCalledWith(jasmine.objectContaining({windowElement: window})); - }); - }); - - describe('when scrollWindow is false', () => { - beforeEach(() => { - directive.scrollWindow = false; - directive.ngOnInit(); - }); - - it('should return current element', () => { - expect(positionFactoryMock.create) - .toHaveBeenCalledWith(jasmine.objectContaining({windowElement: mockedElement})); - }); - }); - }); - }); -}); diff --git a/old/src/infinite-scroll.ts b/old/src/infinite-scroll.ts deleted file mode 100644 index c3cde9a8..00000000 --- a/old/src/infinite-scroll.ts +++ /dev/null @@ -1,109 +0,0 @@ -import { InfiniteScrollEvent, ScrollStats, PositionStats } from './models'; -import { - Directive, ElementRef, Input, Output, - EventEmitter, OnDestroy, OnInit, - SimpleChanges, NgZone -} from '@angular/core'; -import { PositionResolverFactory } from './position-resolver'; -import { ScrollRegister, ScrollRegisterConfig } from './scroll-register'; -import { ScrollResolver } from './scroll-resolver'; -import { Subscription } from 'rxjs/Rx'; - - -@Directive({ - selector: '[infinite-scroll]' -}) -export class InfiniteScroll implements OnDestroy, OnInit { - @Output() scrolled = new EventEmitter(); - @Output() scrolledUp = new EventEmitter(); - - @Input('infiniteScrollDistance') _distanceDown: number = 2; - @Input('infiniteScrollUpDistance') _distanceUp: number = 1.5; - @Input('infiniteScrollThrottle') _throttle: number = 300; - @Input('infiniteScrollDisabled') _disabled: boolean = false; - @Input('infiniteScrollContainer') _container: any = null; - @Input('scrollWindow') scrollWindow: boolean = true; - @Input('immediateCheck') _immediate: boolean = false; - @Input('horizontal') _horizontal: boolean = false; - @Input('alwaysCallback') _alwaysCallback: boolean = false; - @Input() - set debounce(value: string | boolean) { - this.throttleType = value === '' || !!value ? 'debounce' : 'throttle'; - } - - private throttleType: string = 'throttle'; - private disposeScroller: Subscription; - - constructor( - private element: ElementRef, - private zone: NgZone, - private positionResolverFactory: PositionResolverFactory, - private scrollRegister: ScrollRegister, - private scrollerResolver: ScrollResolver - ) {} - - ngOnInit() { - if (typeof window !== 'undefined') { - const containerElement = this.resolveContainerElement(); - const positionResolver = this.positionResolverFactory.create({ - windowElement: containerElement, - horizontal: this._horizontal - }); - const options: ScrollRegisterConfig = { - container: positionResolver.container, - throttleType: this.throttleType, - throttleDuration: this._throttle, - filterBefore: () => !this._disabled, - mergeMap: () => positionResolver.calculatePoints(this.element), - scrollHandler: (container: PositionStats) => this.handleOnScroll(container) - }; - this.disposeScroller = this.scrollRegister.attachEvent(options); - } - } - - handleOnScroll(container: PositionStats) { - const scrollResolverConfig = { - distance: { - down: this._distanceDown, - up: this._distanceUp - } - }; - const scrollStats: ScrollStats = this.scrollerResolver.getScrollStats(container, scrollResolverConfig); - if (this.shouldTriggerEvents(scrollStats.shouldScroll)) { - const infiniteScrollEvent: InfiniteScrollEvent = { - currentScrollPosition: container.scrolledUntilNow - }; - if (scrollStats.isScrollingDown) { - this.onScrollDown(infiniteScrollEvent); - } else { - this.onScrollUp(infiniteScrollEvent); - } - } - } - - shouldTriggerEvents(shouldScroll: boolean) { - return (this._alwaysCallback || shouldScroll) && !this._disabled; - } - - ngOnDestroy () { - if (this.disposeScroller) { - this.disposeScroller.unsubscribe(); - } - } - - onScrollDown(data: InfiniteScrollEvent = { currentScrollPosition: 0 }) { - this.zone.run(() => this.scrolled.emit(data)); - } - - onScrollUp(data: InfiniteScrollEvent = { currentScrollPosition: 0 }) { - this.zone.run(() => this.scrolledUp.emit(data)); - } - - private resolveContainerElement(): any { - if (this._container) { - return typeof(this._container) === 'string' ? window.document.querySelector(this._container) : this._container; - } else { - return this.scrollWindow ? window : this.element; - } - } -} diff --git a/old/src/models.ts b/old/src/models.ts deleted file mode 100644 index c6ee43df..00000000 --- a/old/src/models.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { ElementRef } from '@angular/core'; - -export type ContainerRef = Window | ElementRef | any; - -export interface InfiniteScrollEvent { - currentScrollPosition: number; -}; - -export interface PositionElements { - windowElement: ContainerRef; - horizontal: boolean; -} - -export interface PositionStats { - height: number; - scrolledUntilNow: number; - totalToScroll: number; -} - -export interface ScrollerConfig { - distance: { - down: number; - up: number; - }; - scrollParent?: ContainerRef; -} - -export interface ScrollStats { - isScrollingDown: boolean; - shouldScroll: boolean -} diff --git a/old/src/position-resolver.spec.ts b/old/src/position-resolver.spec.ts deleted file mode 100644 index 5251241a..00000000 --- a/old/src/position-resolver.spec.ts +++ /dev/null @@ -1,75 +0,0 @@ -import { - async, - inject -} from '@angular/core/testing'; -import { PositionResolver } from './position-resolver'; -import { AxisResolver } from './axis-resolver'; -import { ElementRef } from '@angular/core'; - -describe('Position Resolver', () => { - let mockedElement: ElementRef; - let mockedContainer: ElementRef; - - const createMockDom = () => { - const container = document.createElement('section'); - container.setAttribute('style', 'height: 500px; overflow-y: scroll'); - const el = document.createElement('div'); - el.setAttribute('style', 'height: 1000px;'); - container.appendChild(el); - mockedElement = new ElementRef(el); - mockedContainer = new ElementRef(container); - return { element: mockedElement, container: mockedContainer }; - }; - - const createPositionResolver = (element: ElementRef, container: ElementRef) => { - const options = { - windowElement: element, - horizontal: true - }; - const axis: AxisResolver = new AxisResolver(); - return new PositionResolver(axis, options); - }; - - beforeEach(() =>{ - - }); - - it('should create an instance of position resolver', () => { - const mockDom = createMockDom(); - const actual = createPositionResolver(mockDom.element, mockDom.container); - expect(actual).toBeDefined(); - }); - - it('should calculate points', () => { - const mockDom = createMockDom(); - const service = createPositionResolver(mockDom.element, mockDom.container); - const actual = service.calculatePoints(mockDom.element); - expect(actual).toBeDefined(); - }); - - describe('creating instance for non-window element', () => { - let service: PositionResolver; - - describe('when nativeElement is present', () => { - beforeEach(() => { - const mockDom = createMockDom(); - service = createPositionResolver(mockDom.element, mockDom.container); - }); - - it('should use container as nativeElement', () => { - expect(service.container instanceof HTMLDivElement).toBeTruthy(); - }); - }); - - describe('when nativeElement is not present', () => { - beforeEach(() => { - const mockDom = createMockDom(); - service = createPositionResolver(mockDom.element, mockDom.container.nativeElement); - }); - - it('should use container as nativeElement', () => { - expect(service.container instanceof HTMLDivElement).toBeTruthy(); - }); - }); - }); -}); diff --git a/old/src/position-resolver.ts b/old/src/position-resolver.ts deleted file mode 100644 index 9c5aa9cb..00000000 --- a/old/src/position-resolver.ts +++ /dev/null @@ -1,116 +0,0 @@ -import { Injectable, ElementRef } from '@angular/core'; -import { AxisResolver, AxisResolverFactory } from './axis-resolver'; -import { ContainerRef, PositionElements, PositionStats } from './models'; - -@Injectable() -export class PositionResolverFactory { - - constructor(private axisResolver: AxisResolverFactory) { - } - - create (options: PositionElements) { - return new PositionResolver(this.axisResolver.create(!options.horizontal), options); - } -} - -export class PositionResolver { - private documentElement: ContainerRef; - private isContainerWindow: boolean; - public container: ContainerRef; - - constructor (private axis: AxisResolver, private options: PositionElements) { - this.resolveContainer(this.options.windowElement); - this.defineContainer(this.options.windowElement); - } - - defineContainer(windowElement: ContainerRef) { - if (this.resolveContainer(windowElement) || !windowElement.nativeElement) { - this.container = windowElement; - } else { - this.container = windowElement.nativeElement; - } - return this.container; - } - - resolveContainer(windowElement: ContainerRef): boolean { - const isContainerWindow = Object.prototype.toString.call(windowElement).includes('Window'); - this.isContainerWindow = isContainerWindow; - return isContainerWindow; - } - - getDocumentElement() { - return this.isContainerWindow - ? this.options.windowElement.document.documentElement - : null; - } - - calculatePoints (element: ElementRef) { - return this.isContainerWindow - ? this.calculatePointsForWindow(element) - : this.calculatePointsForElement(element); - } - - calculatePointsForWindow (element: ElementRef): PositionStats { - // container's height - const height = this.height(this.container); - // scrolled until now / current y point - const scrolledUntilNow = height + this.pageYOffset(this.getDocumentElement()); - // total height / most bottom y point - const totalToScroll = this.offsetTop(element.nativeElement) + this.height(element.nativeElement); - return { height, scrolledUntilNow, totalToScroll }; - } - - calculatePointsForElement (element: ElementRef) { - let scrollTop = this.axis.scrollTopKey(); - let scrollHeight = this.axis.scrollHeightKey(); - const container = this.container; - - const height = this.height(container); - // perhaps use this.container.offsetTop instead of 'scrollTop' - const scrolledUntilNow = container[scrollTop]; - let containerTopOffset = 0; - const offsetTop = this.offsetTop(container); - if (offsetTop !== void 0) { - containerTopOffset = offsetTop; - } - const totalToScroll = container[scrollHeight]; - return { height, scrolledUntilNow, totalToScroll }; - } - - private height (elem: any) { - let offsetHeight = this.axis.offsetHeightKey(); - let clientHeight = this.axis.clientHeightKey(); - - // elem = elem.nativeElement; - if (isNaN(elem[offsetHeight])) { - return this.getDocumentElement()[clientHeight]; - } else { - return elem[offsetHeight]; - } - } - - private offsetTop (elem: any) { - let top = this.axis.topKey(); - - // elem = elem.nativeElement; - if (!elem.getBoundingClientRect) { // || elem.css('none')) { - return; - } - return elem.getBoundingClientRect()[top] + this.pageYOffset(elem); - } - - pageYOffset (elem: any) { - let pageYOffset = this.axis.pageYOffsetKey(); - let scrollTop = this.axis.scrollTopKey(); - let offsetTop = this.axis.offsetTopKey(); - - // elem = elem.nativeElement; - if (isNaN(window[pageYOffset])) { - return this.getDocumentElement()[scrollTop]; - } else if (elem.ownerDocument) { - return elem.ownerDocument.defaultView[pageYOffset]; - } else { - return elem[offsetTop]; - } - } -} diff --git a/old/src/scroll-register.spec.ts b/old/src/scroll-register.spec.ts deleted file mode 100644 index 2df6153c..00000000 --- a/old/src/scroll-register.spec.ts +++ /dev/null @@ -1,44 +0,0 @@ -import { Subscription } from 'rxjs/Rx'; -import { - async, - inject -} from '@angular/core/testing'; -import { ScrollRegister, ScrollRegisterConfig } from './scroll-register'; -import { ElementRef } from '@angular/core'; - -describe('Scroll Regsiter', () => { - let mockedElement: ElementRef; - let mockedContainer: ElementRef; - let scrollRegister: ScrollRegister; - - const createMockDom = () => { - const container = document.createElement('section'); - container.setAttribute('style', 'height: 500px; overflow-y: scroll'); - const el = document.createElement('div'); - el.setAttribute('style', 'height: 1000px;'); - container.appendChild(el); - mockedElement = new ElementRef(el); - mockedContainer = new ElementRef(container); - return { element: mockedElement, container: mockedContainer }; - }; - - beforeEach(() =>{ - scrollRegister = new ScrollRegister(); - }); - - it('should create a Subscription of scroll observable', () => { - const mockDom = createMockDom(); - const scrollConfig: ScrollRegisterConfig = { - container: mockDom.container.nativeElement, - filterBefore: () => true, - mergeMap: (e: any) => e, - scrollHandler: (ev: any) => ev, - throttleDuration: 300, - throttleType: 'throttle' - - }; - const scroller$: Subscription = scrollRegister.attachEvent(scrollConfig); - const actual = scroller$; - expect(actual).toBeDefined(); - }); -}); diff --git a/old/src/scroll-register.ts b/old/src/scroll-register.ts deleted file mode 100644 index 00f4e36e..00000000 --- a/old/src/scroll-register.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { ContainerRef } from './models'; -import { Injectable, ElementRef } from '@angular/core'; -import { Observable } from 'rxjs/Observable'; -import { Subscription } from 'rxjs/Subscription'; -import 'rxjs/add/observable/fromEvent'; -import 'rxjs/add/observable/timer'; -import 'rxjs/add/observable/of'; -import 'rxjs/add/operator/debounce'; -import 'rxjs/add/operator/throttle'; -import 'rxjs/add/operator/filter'; -import 'rxjs/add/operator/mergeMap'; - - -export interface ScrollRegisterConfig { - container: ContainerRef; - throttleType: string; - throttleDuration: number; - filterBefore: Function; - mergeMap: Function; - scrollHandler: Function; -} - -@Injectable() -export class ScrollRegister { - attachEvent (options: ScrollRegisterConfig): Subscription { - const scroller$: Subscription = Observable.fromEvent(options.container, 'scroll') - [options.throttleType](() => Observable.timer(options.throttleDuration)) - .filter(options.filterBefore) - .mergeMap((ev: any) => Observable.of(options.mergeMap(ev))) - .subscribe(options.scrollHandler); - return scroller$; - } -} diff --git a/old/src/scroll-resolver.ts b/old/src/scroll-resolver.ts deleted file mode 100644 index 52f3a585..00000000 --- a/old/src/scroll-resolver.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { PositionStats, ScrollerConfig } from './models'; -import { Injectable } from '@angular/core'; - -@Injectable() -export class ScrollResolver { - public lastScrollPosition: number = 0; - - shouldScroll (container: PositionStats, config: ScrollerConfig, scrollingDown: boolean) { - const distance = config.distance; - let remaining: number; - let containerBreakpoint: number; - if (scrollingDown) { - remaining = container.totalToScroll - container.scrolledUntilNow; - containerBreakpoint = container.height * distance.down + 1; - } else { - remaining = container.scrolledUntilNow; - containerBreakpoint = container.height * distance.up + 1; - } - const shouldScroll: boolean = remaining <= containerBreakpoint; - this.lastScrollPosition = container.scrolledUntilNow; - return shouldScroll; - } - - isScrollingDown (container: PositionStats) { - return this.lastScrollPosition < container.scrolledUntilNow; - } - - getScrollStats (container: PositionStats, config: ScrollerConfig) { - const isScrollingDown = this.isScrollingDown(container); - const shouldScroll = this.shouldScroll(container, config, isScrollingDown); - return { isScrollingDown, shouldScroll }; - } -} diff --git a/old/src/tsconfig.json b/old/src/tsconfig.json deleted file mode 100644 index ee5a2915..00000000 --- a/old/src/tsconfig.json +++ /dev/null @@ -1,28 +0,0 @@ -{ - "compilerOptions": { - "target": "es5", - "module": "commonjs", - "moduleResolution": "node", - "inlineSourceMap": true, - "inlineSources": true, - "emitDecoratorMetadata": true, - "experimentalDecorators": true, - "removeComments": false, - "noImplicitAny": true, - "noEmitOnError": true, - "suppressImplicitAnyIndexErrors": true, - "types": [ - "core-js", - "jasmine", - "node" - ] - }, - "exclude": [ - "node_modules", - ".tmp" - ], - "awesomeTypescriptLoaderOptions": { - "forkChecker": true, - "useWebpackText": true - } -} diff --git a/old/tsconfig.json b/old/tsconfig.json deleted file mode 100644 index 65877efd..00000000 --- a/old/tsconfig.json +++ /dev/null @@ -1,47 +0,0 @@ -{ - "compilerOptions": { - "noImplicitAny": true, - "module": "commonjs", - "target": "es5", - "emitDecoratorMetadata": true, - "experimentalDecorators": true, - "inlineSourceMap": true, - "inlineSources": true, - "declaration": true, - "suppressImplicitAnyIndexErrors": true, - "moduleResolution": "node", - "lib": [ - "dom", - "es6" - ], - "types": [ - "jasmine", - "node" - ] - }, - "exclude": [ - "node_modules", - "bundles" - ], - "awesomeTypescriptLoaderOptions": { - "forkChecker": true, - "useWebpackText": true - }, - "files": [ - "./angular2-infinite-scroll.ts", - "./src/infinite-scroll.ts", - "./src/infinite-scroll.spec.ts", - "./src/axis-resolver.ts", - "./src/axis-resolver.spec.ts", - "./src/position-resolver.ts", - "./src/position-resolver.spec.ts", - "./src/scroll-resolver.ts", - "./src/scroll-register.ts", - "./src/models.ts", - "./src/index.ts" - ], - "angularCompilerOptions": { - "genDir": "./src/ngfactory", - "debug": false - } -} diff --git a/package.json b/package.json index 72939259..7ddad83b 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "ngx-infinite-scroll", - "version": "0.4.1", - "description": "Build an Angular library compatible with AoT compilation and Tree shaking", + "version": "0.4.2-1", + "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", diff --git a/src/modules/infinite-scroll.ts b/src/modules/infinite-scroll.directive.ts similarity index 97% rename from src/modules/infinite-scroll.ts rename to src/modules/infinite-scroll.directive.ts index 4a2b1257..4f903dd4 100644 --- a/src/modules/infinite-scroll.ts +++ b/src/modules/infinite-scroll.directive.ts @@ -7,11 +7,10 @@ import { import { PositionResolverFactory } from '../services/position-resolver'; import { ScrollRegister, ScrollRegisterConfig } from '../services/scroll-register'; import { ScrollResolver } from '../services/scroll-resolver'; -import { Subscription } from 'rxjs/Rx'; - +import { Subscription } from 'rxjs/Subscription'; @Directive({ - selector: '[infinite-scroll]' + selector: '[infiniteScroll],[infinite-scroll]' }) export class InfiniteScroll implements OnDestroy, OnInit { @Output() scrolled = new EventEmitter(); diff --git a/src/modules/ngx-infinite-scroll.module.ts b/src/modules/ngx-infinite-scroll.module.ts index 3bb91503..09b77707 100644 --- a/src/modules/ngx-infinite-scroll.module.ts +++ b/src/modules/ngx-infinite-scroll.module.ts @@ -1,6 +1,6 @@ import { NgModule } from '@angular/core'; -import { InfiniteScroll } from './infinite-scroll'; +import { InfiniteScroll } from './infinite-scroll.directive'; import { AxisResolverFactory } from '../services/axis-resolver'; import { PositionResolverFactory } from '../services/position-resolver'; import { ScrollRegister } from '../services/scroll-register'; diff --git a/src/ngx-infinite-scroll.ts b/src/ngx-infinite-scroll.ts index da0c0943..11bc4d45 100644 --- a/src/ngx-infinite-scroll.ts +++ b/src/ngx-infinite-scroll.ts @@ -1,5 +1,5 @@ // Public classes. -export { InfiniteScroll } from './modules/infinite-scroll'; +export { InfiniteScroll } from './modules/infinite-scroll.directive'; export { PositionResolver, PositionResolverFactory } from './services/position-resolver'; export { AxisResolver, AxisResolverFactory } from './services/axis-resolver'; export { ScrollRegister } from './services/scroll-register'; diff --git a/tests/modules/infinite-scroll.spec.ts b/tests/modules/infinite-scroll.directive.spec.ts similarity index 99% rename from tests/modules/infinite-scroll.spec.ts rename to tests/modules/infinite-scroll.directive.spec.ts index 039704b6..3bd29538 100644 --- a/tests/modules/infinite-scroll.spec.ts +++ b/tests/modules/infinite-scroll.directive.spec.ts @@ -2,7 +2,7 @@ import { async, inject } from '@angular/core/testing'; -import { InfiniteScroll } from '../../src/modules/infinite-scroll'; +import { InfiniteScroll } from '../../src/modules/infinite-scroll.directive'; import { AxisResolverFactory } from '../../src/services/axis-resolver'; import { PositionResolverFactory } from '../../src/services/position-resolver'; import { ScrollRegister } from '../../src/services/scroll-register'; diff --git a/tslint.json b/tslint.json index c0d7a7bf..46d25cdb 100644 --- a/tslint.json +++ b/tslint.json @@ -50,6 +50,7 @@ ], "trailing-comma": [ false - ] + ], + "member-access": [false, "check-accessor"] } } \ No newline at end of file