Skip to content

Commit a25a642

Browse files
author
Leo Vo
committed
Init project.
0 parents  commit a25a642

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

62 files changed

+3008
-0
lines changed

‎.angular-cli.json

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"project": {
4+
"name": "ngx-treeview"
5+
},
6+
"apps": [
7+
{
8+
"root": "src",
9+
"outDir": "dist/demo",
10+
"assets": [
11+
"assets",
12+
"favicon.ico"
13+
],
14+
"index": "index.html",
15+
"main": "main.ts",
16+
"polyfills": "polyfills.ts",
17+
"test": "test.ts",
18+
"tsconfig": "tsconfig.app.json",
19+
"testTsconfig": "tsconfig.spec.json",
20+
"prefix": "ngx",
21+
"styles": [
22+
"../node_modules/font-awesome/scss/font-awesome.scss",
23+
"../node_modules/bootstrap/scss/bootstrap.scss",
24+
"styles.scss"
25+
],
26+
"scripts": [],
27+
"environmentSource": "environments/environment.ts",
28+
"environments": {
29+
"dev": "environments/environment.ts",
30+
"prod": "environments/environment.prod.ts"
31+
}
32+
}
33+
],
34+
"e2e": {
35+
"protractor": {
36+
"config": "./protractor.conf.js"
37+
}
38+
},
39+
"lint": [
40+
{
41+
"project": "src/tsconfig.app.json"
42+
},
43+
{
44+
"project": "src/tsconfig.spec.json"
45+
},
46+
{
47+
"project": "e2e/tsconfig.e2e.json"
48+
}
49+
],
50+
"test": {
51+
"karma": {
52+
"config": "./karma.conf.js"
53+
}
54+
},
55+
"defaults": {
56+
"styleExt": "scss",
57+
"component": {}
58+
}
59+
}

‎.editorconfig

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# Editor configuration, see http://editorconfig.org
2+
root = true
3+
4+
[*]
5+
charset = utf-8
6+
indent_style = space
7+
indent_size = 2
8+
insert_final_newline = true
9+
trim_trailing_whitespace = true
10+
11+
[*.md]
12+
max_line_length = off
13+
trim_trailing_whitespace = false

‎.gitignore

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
# See http://help.github.com/ignore-files/ for more about ignoring files.
2+
3+
# compiled output
4+
/dist
5+
/tmp
6+
/out-tsc
7+
8+
# dependencies
9+
/node_modules
10+
11+
# IDEs and editors
12+
/.idea
13+
.project
14+
.classpath
15+
.c9/
16+
*.launch
17+
.settings/
18+
*.sublime-workspace
19+
20+
# IDE - VSCode
21+
.vscode/*
22+
!.vscode/settings.json
23+
!.vscode/tasks.json
24+
!.vscode/launch.json
25+
!.vscode/extensions.json
26+
27+
# misc
28+
/.sass-cache
29+
/connect.lock
30+
/coverage
31+
/libpeerconnection.log
32+
npm-debug.log
33+
testem.log
34+
/typings
35+
36+
# e2e
37+
/e2e/*.js
38+
/e2e/*.map
39+
40+
# System Files
41+
.DS_Store
42+
Thumbs.db
43+
44+
# Binary files
45+
*.tgz

‎.travis.yml

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
sudo: required
2+
dist: trusty
3+
addons:
4+
apt:
5+
sources:
6+
- google-chrome
7+
packages:
8+
- google-chrome-stable
9+
language: node_js
10+
node_js:
11+
- 6
12+
before_script:
13+
- export DISPLAY=:99.0
14+
- sh -e /etc/init.d/xvfb start
15+
install:
16+
- npm install
17+
script:
18+
- npm run lint
19+
- npm run test-ci
20+
- npm run e2e

‎CHANGELOG.md

Whitespace-only changes.

‎DEVELOPER.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
There are a few npm scripts provided with [ngx-cli-library-seed](https://github.com/isaacplmann/ngx-cli-library-seed).
2+
3+
- `start`: Run the demo
4+
- `build`: Build the demo and the library
5+
- `build:demo`: Build the demo. Using [live-server](https://www.npmjs.com/package/live-server) to run demo.
6+
- `build:lib`: Build the library
7+
- `test`: Run all unit tests
8+
- `e2e`: Run all e2e tests
9+
- `pub`: Publish the demo and the library
10+
- `pub:demo`: Build and deploy the demo to github pages
11+
- `pub:lib`: Build and publish the library to npm
12+
- `pack:lib`: Build and pack a local `*.tgz` file of the library

‎LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2015-2017
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in
13+
all copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21+
THE SOFTWARE.

‎README.md

Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
# ngx-treeview [![Build Status](https://travis-ci.org/leovo2708/ngx-treeview.svg?branch=master)](https://travis-ci.org/leovo2708/ngx-treeview) [![npm version](https://img.shields.io/npm/v/ngx-treeview.svg)](https://www.npmjs.com/package/ngx-treeview)
2+
3+
An Angular treeview component with checkbox
4+
5+
## Dependencies
6+
7+
* [Angular](https://angular.io)
8+
* [Lodash](https://lodash.com)
9+
* [Bootstrap 4 alpha 6](https://v4-alpha.getbootstrap.com)
10+
* [Font Awesome 4](http://fontawesome.io)
11+
12+
You can customize CSS yourself to break down dependencies to Bootstrap & Font Awesome.
13+
14+
## Features
15+
16+
* Unlimited tree level
17+
* State: disabled / collapse, expand
18+
* Filtering
19+
* Internationalization (i18n) support
20+
* Template
21+
22+
## Demo
23+
24+
https://leovo2708.github.io/ngx-treeview/
25+
26+
## Installation
27+
28+
After install the above dependencies, install `ngx-treeview` via:
29+
```shell
30+
npm install --save ngx-treeview
31+
```
32+
Once installed you need to import our main module in your application module:
33+
```js
34+
import { TreeviewModule } from 'ngx-treeview';
35+
36+
@NgModule({
37+
declarations: [AppComponent, ...],
38+
imports: [TreeviewModule.forRoot(), ...],
39+
bootstrap: [AppComponent]
40+
})
41+
export class AppModule {
42+
}
43+
```
44+
45+
## Usage
46+
47+
#### Treeview:
48+
```html
49+
<ngx-treeview
50+
[config]="config"
51+
[items]="items"
52+
(selectedChange)="onSelectedChange($event)">
53+
</ngx-treeview>
54+
```
55+
56+
#### Treeview with dropdown:
57+
```html
58+
<ngx-dropdown-treeview
59+
[config]="config"
60+
[items]="items"
61+
(selectedChange)="onSelectedChange($event)">
62+
</ngx-dropdown-treeview>
63+
```
64+
65+
`config` is optional. This is the default configuration:
66+
```js
67+
{
68+
isShowAllCheckBox: true,
69+
isShowFilter: false,
70+
isShowCollapseExpand: false,
71+
maxHeight: 500
72+
}
73+
```
74+
You can change default configuration easily because TreeviewConfig is injectable.
75+
76+
#### Pipe `ngxTreeview`:
77+
To map your JSON objects to TreeItem objects.
78+
```html
79+
<ngx-dropdown-treeview
80+
[config]="config"
81+
[items]="items | ngxTreeview:'textField'"
82+
(selectedChange)="onSelectedChange($event)">
83+
</ngx-dropdown-treeview>
84+
```
85+
86+
#### Create a TreeviewItem:
87+
```js
88+
const itCategory = new TreeviewItem({
89+
text: 'IT', value: 9, children: [
90+
{
91+
text: 'Programming', value: 91, children: [{
92+
text: 'Frontend', value: 911, children: [
93+
{ text: 'Angular 1', value: 9111 },
94+
{ text: 'Angular 2', value: 9112 },
95+
{ text: 'ReactJS', value: 9113 }
96+
]
97+
}, {
98+
text: 'Backend', value: 912, children: [
99+
{ text: 'C#', value: 9121 },
100+
{ text: 'Java', value: 9122 },
101+
{ text: 'Python', value: 9123, checked: false }
102+
]
103+
}]
104+
},
105+
{
106+
text: 'Networking', value: 92, children: [
107+
{ text: 'Internet', value: 921 },
108+
{ text: 'Security', value: 922 }
109+
]
110+
}
111+
]
112+
});
113+
```
114+
115+
You can pass the second paramater 'autoCorrectChecked' with value=true (default is false) in constructor of TreeviewItem to correct checked value of it and all of its descendants. In some cases, you need to push or pop children flexibly, checked of parent may be not correct. Then you need to call function correctChecked() to help to correct from root to its descendants.
116+
```js
117+
const vegetableCategory = new TreeviewItem({
118+
text: 'Vegetable', value: 2, children: [
119+
{ text: 'Salad', value: 21 },
120+
{ text: 'Potato', value: 22 }
121+
]
122+
});
123+
vegetableCategory.children.push(new TreeviewItem({ text: 'Mushroom', value: 23, checked: false }));
124+
vegetableCategory.correctChecked(); // need this to make 'Vegetable' node to change checked value from true to false
125+
```
126+
127+
#### TreeviewEventParser:
128+
Extract data from list of checked TreeviewItem and send it in parameter of event selectedChange. Some built-in TreeviewEventParser:
129+
* DefaultTreeviewEventParser: return values of checked items.
130+
* DownlineTreeviewEventParser: return list of checked items in orginal order with their ancestors.
131+
* OrderDownlineTreeviewEventParser: return list of checked items in checked order with their ancestors. Note that: value of a leaf must be different from value of other leaves.
132+
133+
#### TreeviewItem Template:
134+
See example 4.
135+
136+
## Contributing
137+
138+
I am very appreciate for your ideas, proposals and found bugs which you can leave in github issues. Thanks in advance!

‎e2e/app.e2e-spec.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { NgxTreeviewPage } from './app.po';
2+
3+
describe('ngx-treeview App', () => {
4+
let page: NgxTreeviewPage;
5+
6+
beforeEach(() => {
7+
page = new NgxTreeviewPage();
8+
});
9+
10+
it('should display message saying "Angular ngx-treeview component demo"', () => {
11+
page.navigateTo();
12+
expect(page.getParagraphText()).toEqual('Angular ngx-treeview component demo');
13+
});
14+
});

‎e2e/app.po.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { browser, element, by } from 'protractor';
2+
3+
export class NgxTreeviewPage {
4+
navigateTo() {
5+
return browser.get('/');
6+
}
7+
8+
getParagraphText() {
9+
return element(by.css('ngx-app h2')).getText();
10+
}
11+
}

‎e2e/tsconfig.e2e.json

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"extends": "../tsconfig.json",
3+
"compilerOptions": {
4+
"outDir": "../out-tsc/e2e",
5+
"module": "commonjs",
6+
"target": "es5",
7+
"types":[
8+
"jasmine",
9+
"node"
10+
]
11+
}
12+
}

0 commit comments

Comments
 (0)