Skip to content

Commit

Permalink
Merge pull request #300 from dhilt/v3-infrastructure
Browse files Browse the repository at this point in the history
v3.0.0
  • Loading branch information
dhilt committed Apr 10, 2022
2 parents e23059a + 29b34db commit 09a3e20
Show file tree
Hide file tree
Showing 107 changed files with 16,873 additions and 8,689 deletions.
3 changes: 3 additions & 0 deletions .editorconfig
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,9 @@ indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true

[*.ts]
quote_type = single

[*.md]
max_line_length = off
trim_trailing_whitespace = false
2 changes: 1 addition & 1 deletion .github/stale.yml
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
# Number of days of inactivity before an issue becomes stale
daysUntilStale: 90
daysUntilStale: 60
# Number of days of inactivity before a stale issue is closed
daysUntilClose: 7
# Issues with these labels will never be considered stale
Expand Down
18 changes: 8 additions & 10 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,6 @@ on:
push:
branches:
- "**"
pull_request:
branches: [ master ]
workflow_dispatch:
inputs:
cause:
Expand All @@ -18,7 +16,7 @@ jobs:
runs-on: ubuntu-latest
strategy:
matrix:
node-version: [14.x]
node-version: [16.x]
steps:
- name: Dispatched?
if: ${{ github.event_name == 'workflow_dispatch' }}
Expand All @@ -36,13 +34,13 @@ jobs:

- run: npm install
- run: npm test
- run: npm run build
- run: npm run build-app
- run: npm run build:lib
- run: npm run build:demo

- uses: actions/upload-artifact@master
with:
name: my-dist
path: dist-app
name: demo-dist
path: dist/demo

deploy:
needs: build
Expand Down Expand Up @@ -72,12 +70,12 @@ jobs:
if: env.NEED == 'true'
uses: actions/download-artifact@master
with:
name: my-dist
path: dist-app
name: demo-dist
path: dist-demo-app

- name: Deploy
if: env.NEED == 'true'
uses: JamesIves/github-pages-deploy-action@4.1.0
with:
branch: gh-pages
folder: dist-app
folder: dist-demo-app
7 changes: 4 additions & 3 deletions .github/workflows/deploy-manual.yml
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
name: ngx-ui-scroll demo app manual deploy
name: ngx-ui-scroll demo app manual deployment

on:
workflow_dispatch:
Expand All @@ -18,9 +18,10 @@ jobs:
- name: Install and Build 🔧
run: |
npm install
npm run build-app
npm run build:lib
npm run build:demo
- name: Deploy 🚀
uses: JamesIves/github-pages-deploy-action@4.1.0
with:
branch: gh-pages
folder: dist-app
folder: dist/demo
11 changes: 3 additions & 8 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
/dist
/dist-app
*scroll-*.tgz
debug.log

# dependencies
/node_modules
Expand All @@ -17,18 +16,16 @@ debug.log
*.launch
.settings/
*.sublime-workspace

# IDE - VSCode
.vscode/*

# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
testem.log
/typings
.angular
*.log
temp

# System Files
.DS_Store
Expand All @@ -41,5 +38,3 @@ firebase.json

# environment
.env

temp
2 changes: 1 addition & 1 deletion LICENSE
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
MIT License

Copyright (c) 2021 Denis Hilt (https://github.com/dhilt)
Copyright (c) 2022 Denis Hilt (https://github.com/dhilt)

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
Expand Down
1 change: 0 additions & 1 deletion Procfile

This file was deleted.

21 changes: 10 additions & 11 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
[![ngx-ui-scroll CI](https://github.com/dhilt/ngx-ui-scroll/actions/workflows/ci.yml/badge.svg)](https://github.com/dhilt/ngx-ui-scroll/actions/workflows/ci.yml)
[![npm version](https://badge.fury.io/js/ngx-ui-scroll.svg)](https://www.npmjs.com/package/ngx-ui-scroll)

# NgxUiScroll
# ngx-ui-scroll

Unlimited bidirectional virtual scrolling over limited viewport. A directive for [Angular](https://angular.io/) framework. Built with [angular-library-starter](https://github.com/robisim74/angular-library-starter). Inspired by [angular-ui-scroll](https://github.com/angular-ui/ui-scroll) (AngularJS, since 2013). Demo is available at [dhilt.github.io/ngx-ui-scroll](https://dhilt.github.io/ngx-ui-scroll/). Since v2.0.0, the core of the ngx-ui-scroll library lives and develops as a separate zero-dependency npm package [vscroll](https://github.com/dhilt/vscroll).
A directive for [Angular](https://angular.io/) framework to provide unlimited bidirectional virtual scrolling over limited viewport. Built on top of [vscroll](https://github.com/dhilt/vscroll) native virtual scrolling engine. Demo is available at [dhilt.github.io/ngx-ui-scroll](https://dhilt.github.io/ngx-ui-scroll/).

<p dir="rtl">
<sub>can donate? go <b><a href="https://github.com/dhilt/ngx-ui-scroll?sponsor=1">here</a></b></sub><sub> 👉 <br>make open-source world better</sub></p>
Expand All @@ -16,20 +16,20 @@ Unlimited bidirectional virtual scrolling over limited viewport. A directive for
- [Settings](#settings)
- [Adapter API](#adapter-api)
- [Development](#development)

<br>

<a name="compatibility" id="compatibility"></a>
### Compatibility

The ngx-ui-scroll library has no breaking changes in its API, but there are inevitable changes in how it is built and distributed to the host app depending on the version of the Angular.

|ngx-ui-scroll|Angular|compiled|support|notes|
|:--|:--|:--|:--|:--|
|v1|5-12|View Engine|no|no dependencies (vscroll is not extracted)|
|v2|5-12|View Engine|maintenance|vscroll is a bundle-dependency|
|v3|12+|Ivy|active|vscroll is a peer-dependency|

So if the consumer app is view-engine compatible, you should use v2 which is in maintenance mode and under [v2-legacy](https://github.com/dhilt/ngx-ui-scroll/tree/v2-legacy) branch.

So if the consumer app is view-engine compatible, you should use ngx-ui-scroll v2 which is in maintenance mode and under [v2-legacy](https://github.com/dhilt/ngx-ui-scroll/tree/v2-legacy) branch.

### Motivation

Expand Down Expand Up @@ -100,7 +100,7 @@ where the viewport is a scrollable area of finite height:

If the height of the viewport is not constrained, it will pull the entire content of the datasource and no scrollbar will appear.

\*uiScroll acts like \*ngFor, but the datasource is an object of special type (IDatasource). It implements method _get_ to be used by the \*uiScroll directive to access the data by _index_ and _count_ parameters. The directive calls `Datasource.get` method each time a user scrolls to the edge of visible element list. That's the API provided by the \*uiScroll directive.
\*uiScroll acts like \*ngFor in its simplest form, where the datasource is an object of special type (IDatasource), which implements the _get_ method used by the \*uiScroll directive to access data by _index_ and _count_ parameters. The directive calls the `Datasource.get` method each time the user scrolls the list of visible elements to the edge.

```javascript
import { IDatasource } from 'ngx-ui-scroll';
Expand Down Expand Up @@ -244,9 +244,8 @@ There are some npm scripts available from package.json:

- `npm start` to run demo App on port 4200
- `npm test` to run Karma tests
- `npm run build` to build the ngx-ui-scroll module into the ./dist folder
- `npm run pack:install` to build tar-gzipped version of package and install it locally into ./node_modules
- `npm run build-app` to build demo App into the ./dist-app folder
- `npm run build:lib` to build the ngx-ui-scroll module into the ./dist/scroller folder
- `npm run build:demo` to build the demo App into the ./dist/demo folder

Along with settings object the datasource implementation may include also devSettings object:

Expand All @@ -269,13 +268,13 @@ The development settings are not documented. Information about it can be taken d
Below is the quick guide for vscroll/ngx-ui-scroll integrated development (this is relevant since ngx-ui-scroll v2 depends on vscroll):

- clone both ngx-ui-scroll and [vscroll](https://github.com/dhilt/vscroll) repositories into the same folder
- replace "vscroll" import with local sources [here](https://github.com/dhilt/ngx-ui-scroll/blob/v2.0.0-rc.10/src/vscroll.ts#L17) and [here](https://github.com/dhilt/ngx-ui-scroll/blob/v2.0.0-rc.10/tests/miscellaneous/vscroll.ts#L16).
- replace "vscroll" import with local sources [here](https://github.com/dhilt/ngx-ui-scroll/blob/v3.0.0-rc.1/src/vscroll.ts#L19) and [here](https://github.com/dhilt/ngx-ui-scroll/blob/v3.0.0-rc.1/tests/miscellaneous/vscroll.ts#L17).

Also, there are some environment variables for additional customization of the dev process. In accordance with [dotenv](https://www.npmjs.com/package/dotenv) approach, the `.env` file should be placed in the root folder, and it may contain the following variables.

|Name|Value|Description|
|:--|:----|:----------|
|DEV_SERVER_PORT|4200|Port the dev server (webpack) will use. Need to run `npm run start-env` instead of `npm run` to make this setting work.|
|DEV_SERVER_PORT|4200|Port the dev server (webpack) will use. Need to run `npm run start:env` instead of `npm run` to make this setting work.|
|TEST_BROWSER|default&nbsp;&#124; chrome&nbsp;&#124; firefox|Platform for running tests. By default a headless chrome is used; "chrome" or "firefox" are for running tests in real (chrome/ff) browser |
|TEST_SERVER_PORT|9876|Port that will be used by non-default testing browser |

Expand Down
122 changes: 76 additions & 46 deletions angular.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,83 +3,113 @@
"version": 1,
"newProjectRoot": "projects",
"projects": {
"ngx-ui-scroll-demo-app": {
"root": "",
"sourceRoot": "./",
"scroller": {
"projectType": "library",
"root": "scroller",
"sourceRoot": "scroller/src",
"prefix": "lib",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:ng-packagr",
"options": {
"project": "scroller/ng-package.json"
},
"configurations": {
"production": {
"tsConfig": "scroller/tsconfig.lib.prod.json"
},
"development": {
"tsConfig": "scroller/tsconfig.lib.json"
}
},
"defaultConfiguration": "production"
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "tests/_index.ts",
"tsConfig": "tests/tsconfig.spec.json",
"karmaConfig": "tests/karma.conf.js"
}
}
}
},
"demo": {
"projectType": "application",
"schematics": {
"@schematics/angular:application": {
"strict": true
}
},
"root": "demo",
"sourceRoot": "demo",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist-app",
"outputPath": "dist/demo",
"index": "demo/index.html",
"main": "demo/main.ts",
"tsConfig": "demo/tsconfig.app.json",
"polyfills": "demo/polyfills.ts",
"tsConfig": "demo/tsconfig.app.json",
"assets": [
"demo/assets",
"demo/favicon.ico"
"demo/favicon.ico",
"demo/assets"
],
"styles": [
"demo/styles.css"
],
"scripts": [],
"aot": false,
"vendorChunk": true,
"extractLicenses": false,
"buildOptimizer": false,
"sourceMap": true,
"optimization": false,
"namedChunks": true
"scripts": []
},
"configurations": {
"production": {
"optimization": true,
"outputHashing": "all",
"sourceMap": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "1mb",
"maximumError": "2mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kb",
"maximumError": "4kb"
}
],
"fileReplacements": [
{
"replace": "demo/environments/environment.ts",
"with": "demo/environments/environment.prod.ts"
}
]
],
"outputHashing": "all",
"sourceMap": true
},
"development": {
"buildOptimizer": false,
"optimization": false,
"vendorChunk": true,
"extractLicenses": false,
"sourceMap": true,
"namedChunks": true
}
},
"defaultConfiguration": ""
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "ngx-ui-scroll-demo-app:build"
},
"configurations": {
"production": {
"browserTarget": "ngx-ui-scroll-demo-app:build:production"
"browserTarget": "demo:build:production"
},
"development": {
"browserTarget": "demo:build:development"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "ngx-ui-scroll-demo-app:build"
}
},
"defaultConfiguration": "development"
}
}
}
},
"defaultProject": "ngx-ui-scroll-demo-app",
"schematics": {
"@schematics/angular:component": {
"prefix": "app",
"styleext": "css"
},
"@schematics/angular:directive": {
"prefix": "app"
}
}
"defaultProject": "scroller"
}
Loading

0 comments on commit 09a3e20

Please sign in to comment.