Skip to content

Commit 90bc4b1

Browse files
David Martínez RosDavid Martínez Ros
authored andcommitted
add the left image and make the moveToParent of a node and make a root node in the tree
1 parent 0d0ed9d commit 90bc4b1

File tree

5 files changed

+205
-101
lines changed

5 files changed

+205
-101
lines changed

src/app/node-tree/node-tree.component.html

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,9 @@
1717
<div class="text" title="His parent is: {{ getParentName() }} with id: {{ getParentId() }}">
1818
<b>{{ node.name }}</b>
1919
</div>
20-
<img *ngIf="!node.firstNode" src="./assets/up.png" (click)="upNode()"/>
21-
<img *ngIf="!node.lastNode" src="./assets/down.png" (click)="downNode()"/>
20+
<img *ngIf="hasParent()" src="./assets/left.png" title="Move to parent node" (click)="moveToParent()"/>
21+
<img *ngIf="!node.firstNode" src="./assets/up.png" title="Swap up node" (click)="upNode()"/>
22+
<img *ngIf="!node.lastNode" src="./assets/down.png" title="Swap down node" (click)="downNode()"/>
2223
<div class="description">
2324
{{ node.description }}
2425
</div>

src/app/node-tree/node-tree.component.ts

Lines changed: 83 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,10 @@ export class NodeTreeComponent implements OnInit {
3131
return ((this.node.childs != null) && (this.node.childs.length > 0));
3232
}
3333

34+
hasParent(): boolean {
35+
return ((this.node.ancestors != null) && (this.node.ancestors.length > 1));
36+
}
37+
3438
getParentId(): number {
3539
if(this.node.ancestors != null && this.node.ancestors.length > 0) {
3640
return this.node.ancestors[this.node.ancestors.length-1].id;
@@ -43,7 +47,7 @@ export class NodeTreeComponent implements OnInit {
4347
if(this.node.ancestors != null && this.node.ancestors.length > 0) {
4448
return this.node.ancestors[this.node.ancestors.length-1].name;
4549
} else {
46-
return "root";
50+
return "rootParent";
4751
}
4852
}
4953

@@ -163,4 +167,82 @@ export class NodeTreeComponent implements OnInit {
163167
}
164168
}
165169

170+
moveToParent() {
171+
console.log('nodeToParent');
172+
173+
let grandParentTree: Node;
174+
let parentTree: Node;
175+
176+
if(this.node.ancestors != null && this.node.ancestors.length > 0) {
177+
parentTree = this.node.ancestors[this.node.ancestors.length-1];
178+
}
179+
180+
if(this.node.ancestors != null && this.node.ancestors.length > 1) {
181+
grandParentTree = this.node.ancestors[this.node.ancestors.length-2];
182+
}
183+
184+
if(parentTree != null && grandParentTree != null) {
185+
const nodeIndex = parentTree.childs.indexOf(this.node);
186+
const siblingIndex = grandParentTree.childs.indexOf(this.parent) + 1;
187+
188+
console.log('nodeIndex:' + nodeIndex);
189+
console.log('siblingIndex:' + siblingIndex);
190+
console.log('parentTree.childs.length:' + parentTree.childs.length);
191+
192+
let firstNode = false;
193+
let lastNode = false;
194+
if(nodeIndex === 0) {
195+
firstNode = true;
196+
}
197+
if(nodeIndex === parentTree.childs.length-1) {
198+
lastNode = true;
199+
}
200+
201+
let firstNodeSibling = false;
202+
let lastNodeSibling = false;
203+
if(siblingIndex === 0) {
204+
firstNodeSibling = true;
205+
}
206+
if(siblingIndex === parentTree.childs.length-1) {
207+
lastNodeSibling = true;
208+
}
209+
210+
this.node.firstNode = firstNodeSibling;
211+
this.node.lastNode = lastNodeSibling;
212+
213+
let ancestorsSecondLevel: Node[] = grandParentTree.childs;
214+
let childsSecondLevel: Node[] = [];
215+
for(let ancestor of ancestorsSecondLevel) {
216+
childsSecondLevel.push(ancestor);
217+
if(ancestor === parentTree) {
218+
ancestor.firstNode = firstNode;
219+
ancestor.lastNode = lastNode;
220+
childsSecondLevel.push(this.node);
221+
}
222+
}
223+
grandParentTree.childs = childsSecondLevel;
224+
225+
let ancestorsFirstLevel: Node[] = parentTree.childs;
226+
let childsFirstLevel: Node[] = [];
227+
for(let ancestor of ancestorsFirstLevel) {
228+
if(!(ancestor === this.node)) {
229+
childsFirstLevel.push(ancestor);
230+
}
231+
}
232+
parentTree.childs = childsFirstLevel;
233+
234+
let ancestors: Node[] = [];
235+
for(let ancestor of this.node.ancestors) {
236+
if(!(ancestor === parentTree)) {
237+
ancestors.push(ancestor);
238+
}
239+
}
240+
this.node.ancestors = ancestors;
241+
242+
//this.node.removeParentInChilds(parentTree);
243+
244+
}
245+
246+
}
247+
166248
}

src/app/node.class.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,4 +12,17 @@ export class Node {
1212

1313
ancestors: Node[];
1414

15+
/*removeParentInChilds(parent: Node) {
16+
let ans: Node[] = [];
17+
for(let a of this.ancestors) {
18+
if(!(a === parent)) {
19+
ans.push(a);
20+
}
21+
}
22+
this.ancestors = ans;
23+
for(let child of this.childs) {
24+
child.removeParentInChilds(parent);
25+
}
26+
}*/
27+
1528
}

src/assets/left.png

211 Bytes
Loading

src/data/tree.json

Lines changed: 106 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -1,130 +1,138 @@
11
[
22
{
3-
"id": 1,
4-
"name": "Node 1",
5-
"description": "Desc Node 1",
3+
"id": 0,
4+
"name": "root",
5+
"description": "Desc Root",
66
"childs":
77
[
88
{
9-
"id": 11,
10-
"name": "Node 1.1",
11-
"description": "Desc Node 1.1"
12-
},
13-
{
14-
"id": 12,
15-
"name": "Node 1.2",
16-
"description": "Desc Node 1.2",
9+
"id": 1,
10+
"name": "Node 1",
11+
"description": "Desc Node 1",
1712
"childs":
1813
[
1914
{
20-
"id": 121,
21-
"name": "Node 1.2.1",
22-
"description": "Desc Node 1.2.1"
23-
}
24-
]
25-
},
26-
{
27-
"id": 13,
28-
"name": "Node 1.3",
29-
"description": "Desc Node 1.3"
30-
}
31-
]
32-
},
33-
{
34-
"id": 2,
35-
"name": "Node 2",
36-
"description": "Desc Node 2",
37-
"childs":
38-
[
39-
{
40-
"id": 21,
41-
"name": "Node 2.1",
42-
"description": "Desc Node 2.1"
43-
},
44-
{
45-
"id": 22,
46-
"name": "Node 2.2",
47-
"description": "Desc Node 2.2",
48-
"childs":
49-
[
15+
"id": 11,
16+
"name": "Node 1.1",
17+
"description": "Desc Node 1.1"
18+
},
19+
{
20+
"id": 12,
21+
"name": "Node 1.2",
22+
"description": "Desc Node 1.2",
23+
"childs":
24+
[
25+
{
26+
"id": 121,
27+
"name": "Node 1.2.1",
28+
"description": "Desc Node 1.2.1"
29+
}
30+
]
31+
},
5032
{
51-
"id": 221,
52-
"name": "Node 2.2.1",
53-
"description": "Desc Node 2.2.1"
33+
"id": 13,
34+
"name": "Node 1.3",
35+
"description": "Desc Node 1.3"
5436
}
5537
]
5638
},
5739
{
58-
"id": 23,
59-
"name": "Node 2.3",
60-
"description": "Desc Node 2.3"
61-
},
62-
{
63-
"id": 24,
64-
"name": "Node 2.4",
65-
"description": "Desc Node 2.4"
66-
},
67-
{
68-
"id": 25,
69-
"name": "Node 2.5",
70-
"description": "Desc Node 2.5"
71-
}
72-
]
73-
},
74-
{
75-
"id": 3,
76-
"name": "Node 3",
77-
"description": "Desc Node 3",
78-
"childs":
79-
[
80-
{
81-
"id": 31,
82-
"name": "Node 3.1",
83-
"description": "Desc Node 3.1"
84-
},
85-
{
86-
"id": 32,
87-
"name": "Node 3.2",
88-
"description": "Desc Node 3.2",
40+
"id": 2,
41+
"name": "Node 2",
42+
"description": "Desc Node 2",
8943
"childs":
9044
[
9145
{
92-
"id": 321,
93-
"name": "Node 3.2.1",
94-
"description": "Desc Node 3.2.1"
46+
"id": 21,
47+
"name": "Node 2.1",
48+
"description": "Desc Node 2.1"
49+
},
50+
{
51+
"id": 22,
52+
"name": "Node 2.2",
53+
"description": "Desc Node 2.2",
54+
"childs":
55+
[
56+
{
57+
"id": 221,
58+
"name": "Node 2.2.1",
59+
"description": "Desc Node 2.2.1"
60+
}
61+
]
62+
},
63+
{
64+
"id": 23,
65+
"name": "Node 2.3",
66+
"description": "Desc Node 2.3"
67+
},
68+
{
69+
"id": 24,
70+
"name": "Node 2.4",
71+
"description": "Desc Node 2.4"
72+
},
73+
{
74+
"id": 25,
75+
"name": "Node 2.5",
76+
"description": "Desc Node 2.5"
9577
}
9678
]
9779
},
9880
{
99-
"id": 33,
100-
"name": "Node 3.3",
101-
"description": "Desc Node 3.3"
102-
},
103-
{
104-
"id": 34,
105-
"name": "Node 3.4",
106-
"description": "Desc Node 3.4",
81+
"id": 3,
82+
"name": "Node 3",
83+
"description": "Desc Node 3",
10784
"childs":
10885
[
10986
{
110-
"id": 341,
111-
"name": "Node 3.4.1",
112-
"description": "Desc Node 3.4.1"
87+
"id": 31,
88+
"name": "Node 3.1",
89+
"description": "Desc Node 3.1"
11390
},
11491
{
115-
"id": 342,
116-
"name": "Node 3.4.2",
117-
"description": "Desc Node 3.4.2"
92+
"id": 32,
93+
"name": "Node 3.2",
94+
"description": "Desc Node 3.2",
95+
"childs":
96+
[
97+
{
98+
"id": 321,
99+
"name": "Node 3.2.1",
100+
"description": "Desc Node 3.2.1"
101+
}
102+
]
118103
},
119104
{
120-
"id": 343,
121-
"name": "Node 3.4.3",
122-
"description": "Desc Node 3.4.3"
105+
"id": 33,
106+
"name": "Node 3.3",
107+
"description": "Desc Node 3.3"
123108
},
124109
{
125-
"id": 344,
126-
"name": "Node 3.4.4",
127-
"description": "Desc Node 3.4.4"
110+
"id": 34,
111+
"name": "Node 3.4",
112+
"description": "Desc Node 3.4",
113+
"childs":
114+
[
115+
{
116+
"id": 341,
117+
"name": "Node 3.4.1",
118+
"description": "Desc Node 3.4.1"
119+
},
120+
{
121+
"id": 342,
122+
"name": "Node 3.4.2",
123+
"description": "Desc Node 3.4.2"
124+
},
125+
{
126+
"id": 343,
127+
"name": "Node 3.4.3",
128+
"description": "Desc Node 3.4.3"
129+
},
130+
{
131+
"id": 344,
132+
"name": "Node 3.4.4",
133+
"description": "Desc Node 3.4.4"
134+
}
135+
]
128136
}
129137
]
130138
}

0 commit comments

Comments
 (0)