LP1840050 Anguar tree component realtime updates
[working/Evergreen.git] / Open-ILS / src / eg2 / src / app / share / tree / tree.component.ts
1 import {Component, OnInit, Input, Output, EventEmitter} from '@angular/core';
2 import {Tree, TreeNode} from './tree';
3
4 /*
5 Tree Widget:
6
7 <eg-tree
8     [tree]="myTree"
9     (nodeClicked)="nodeClicked($event)">
10 </eg-tree>
11
12 ----
13
14 constructor() {
15
16     const rootNode = new TreeNode({
17         id: 1,
18         label: 'Root',
19         children: [
20             new TreeNode({id: 2, label: 'Child'}),
21             new TreeNode({id: 3, label: 'Child2'})
22         ]
23     ]});
24
25     this.myTree = new Tree(rootNode);
26 }
27
28 nodeClicked(node: TreeNode) {
29     console.log('someone clicked on ' + node.label);
30 }
31 */
32
33 @Component({
34     selector: 'eg-tree',
35     templateUrl: 'tree.component.html',
36     styleUrls: ['tree.component.css']
37 })
38 export class TreeComponent implements OnInit {
39
40     _tree: Tree;
41     @Input() set tree(t: Tree) {
42         if (t) {
43             this._tree = t;
44             this._tree.nodeList(); // reindex nodes
45         }
46     }
47
48     get tree(): Tree {
49         return this._tree;
50     }
51
52     @Output() nodeClicked: EventEmitter<TreeNode>;
53
54     constructor() {
55         this.nodeClicked = new EventEmitter<TreeNode>();
56     }
57
58     ngOnInit() {}
59
60     displayNodes(): TreeNode[] {
61         if (!this.tree) { return []; }
62         return this.tree.nodeList(true);
63     }
64
65     handleNodeClick(node: TreeNode) {
66         this.tree.selectNode(node);
67         this.nodeClicked.emit(node);
68     }
69 }
70
71
72