Skip to content

Commit 3247012

Browse files
committed
switch to threelist for field struct
Change-Id: Icc1abf64c271b8e24afe3cfe229b4981b89d5821
1 parent 9225960 commit 3247012

File tree

7 files changed

+90
-58
lines changed

7 files changed

+90
-58
lines changed

analysis/kernel/dashboard/frontend/src/controllers/heap.ts

+5-1
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,11 @@ export class Heap {
5454
await Fields.getRootNode(),
5555
await btf.getFieldsByStructName(struct),
5656
struct,
57-
kmalloc
57+
kmalloc,
58+
this.kmalloc_cache_name,
59+
this.kmalloc_cgroup_name,
60+
bits_offset,
61+
bits_end
5862
);
5963

6064
if (bits_offset && bits_end) {

analysis/kernel/dashboard/frontend/src/views/fields/fields.ts

+33-9
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,22 @@
11
import { View } from "../view";
22
import { Heap } from "../../controllers/heap";
33
import { FIELDS_RESULTS } from "../../types";
4-
import TreeView, { TreeViewItem } from "js-treeview";
4+
import ThreeView, { ThreeViewItem } from "../three/three";
55

66

77
export class Fields {
88
private static ROOT_NODE: HTMLDivElement | null = null;
99
private static ROOT_NODE_CLASS_NAME: string = 'fields-root-node';
1010

1111
static async getRootNode(): Promise<HTMLDivElement> {
12-
return Fields.ROOT_NODE = await View.getRootNode(Fields.ROOT_NODE, Fields.ROOT_NODE_CLASS_NAME);
12+
Fields.ROOT_NODE = await View.getRootNode(Fields.ROOT_NODE, Fields.ROOT_NODE_CLASS_NAME);
13+
Fields.ROOT_NODE.role = "tree";
14+
return Fields.ROOT_NODE;
1315
}
1416
constructor(private heap: Heap) { }
1517

16-
displayStructs(parentNode: HTMLDivElement, fieldResults: FIELDS_RESULTS[], struct: string, kmalloc: string) {
17-
let root = { name: '', children: [] } as TreeViewItem<FIELDS_RESULTS>;
18+
displayStructs(parentNode: HTMLDivElement, fieldResults: FIELDS_RESULTS[], struct: string, kmalloc: string, kmalloc_cache_name: string|undefined, kmalloc_cgroup_name: string|undefined, bits_offset: string, bits_end: string) {
19+
let root = { name: '', children: [] } as ThreeViewItem<FIELDS_RESULTS>;
1820
let fullName = false;
1921

2022
fieldResults.forEach(field => {
@@ -25,16 +27,18 @@ export class Fields {
2527
if (part == "") {
2628
part = `union`;
2729
}
28-
let nextLeaf: TreeViewItem<FIELDS_RESULTS> = leaf.children.find(e => e.name == part);
30+
let nextLeaf = leaf.children?.find(e => e.name == part);
2931
if (!nextLeaf) {
3032
nextLeaf = {
3133
expanded: true,
34+
selected: bits_offset == field.bits_offset && bits_end == field.bits_end,
3235
get name() {
3336
if (fullName) {
3437
return `[${this.data!.bits_offset}..${this.data!.bits_end}] ${part} (${this.data!.type})`;
3538
}
3639
return part;
3740
},
41+
label: part,
3842
children: [],
3943
data: {
4044
bits_offset: field.bits_offset,
@@ -44,9 +48,10 @@ export class Fields {
4448
type: part == 'union' ? '...' : 'struct'
4549
}
4650
};
47-
leaf.children.push(nextLeaf);
51+
leaf.children?.push(nextLeaf);
4852
} else if (parseInt(nextLeaf.data!.bits_end) < parseInt(field.bits_end)) {
49-
nextLeaf.data!.bits_end = field.bits_end
53+
nextLeaf.data!.bits_end = field.bits_end;
54+
nextLeaf.selected = bits_offset == nextLeaf.data!.bits_offset && bits_end == field.bits_end;
5055
}
5156
if (index == pathParts.length - 1) {
5257
nextLeaf.data!.type = field.type;
@@ -59,10 +64,29 @@ export class Fields {
5964
});
6065
fullName = true;
6166
parentNode.replaceChildren();
62-
const treeview = new TreeView<FIELDS_RESULTS>(root.children, parentNode);
67+
const treeview = new ThreeView<FIELDS_RESULTS>(root.children, parentNode);
6368
treeview.on('select', e => {
6469
let field = e.data.data!;
65-
location.hash = `!heap/${kmalloc}/${struct}/${field.bits_offset}..${field.bits_end}`;
70+
history.pushState(null, '', `#!heap/${kmalloc}/${struct}/${field.bits_offset}..${field.bits_end}`);
71+
this.heap.displayAccess(
72+
Number(field.bits_offset),
73+
Number(field.bits_end),
74+
struct,
75+
kmalloc,
76+
kmalloc_cache_name,
77+
kmalloc_cgroup_name,
78+
0);
6679
});
80+
let sel = treeview.getSelected();
81+
switch(sel?.length) {
82+
case undefined:
83+
case 0:
84+
treeview.focus(treeview.getFirst());
85+
break;
86+
case 1:
87+
break;
88+
default:
89+
treeview.select(sel![0]);
90+
}
6791
}
6892
}
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
1-
<a class="struct-alloc-cache" href> </a>
2-
<div class="struct-alloc-call"> </div>
3-
<a class="struct-alloc-link" title href> </a>
4-
<div class="struct-alloc-metadata">
5-
(<span class="struct-alloc-syscalls-num"> </span> syscalls)
1+
<div class="struct-alloc-container" role="row">
2+
<div class="struct-alloc-cache" role="cell"><a href> </a></div>
3+
<div class="struct-alloc-call" role="cell"> </div>
4+
<div class="struct-alloc-link" role="cell"><a title href> </a></div>
5+
<div class="struct-alloc-metadata" role="cell">
6+
(<span class="struct-alloc-syscalls-num"> </span> syscalls)
7+
</div>
68
</div>
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
<label class="struct-entry">
2-
<a class="struct-name" href> </a>
3-
<div class="struct-metadata">
4-
(<span class="struct-alloc-num"> </span> allocations)
1+
<label class="struct-entry" role="row">
2+
<div class="struct-entry-container" role="rowheader" aria-rowspan>
3+
<div class="struct-name"><a href> </a></div>
4+
<div class="struct-metadata">
5+
(<span class="struct-alloc-num"> </span> allocations)
6+
</div>
57
</div>
6-
<input type="checkbox" checked>
78
</label>
89
<div class="struct-alloc"></div>
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<div class="struct-list"></div>
1+
<div class="struct-list" role="table"></div>

analysis/kernel/dashboard/frontend/src/views/struct/struct.css

+27-27
Original file line numberDiff line numberDiff line change
@@ -54,44 +54,44 @@
5454
}
5555

5656
.struct-entry {
57-
display: grid;
58-
grid-template-columns: auto 1fr;
5957
grid-column: 1 / 5;
6058

61-
column-gap: 1ex;
62-
margin: 20px 0 0 0;
63-
padding: 1ex;
64-
6559
box-shadow: 0 0 0.5em #999;
6660
background: hsla(24, 20%, 50%,.4);
61+
.struct-entry-container {
62+
display: grid;
63+
grid-template-columns: auto 1fr;
6764

68-
& input {
69-
visibility: hidden;
70-
position: absolute;
71-
}
72-
&:not(:has(:checked)) + .struct-alloc {
73-
visibility: hidden;
74-
height: 0;
65+
column-gap: 1ex;
66+
padding: 1ex;
7567
}
7668
}
7769
.struct-alloc {
78-
display: grid;
7970
grid-column: 1 / 5;
71+
72+
display: grid;
8073
grid-template-columns: subgrid;
8174

82-
& > * {
83-
padding: 1ex;
84-
border-bottom: 1px dashed #ccc;
85-
}
86-
.struct-alloc-cache {
87-
margin-left: 3em;
88-
white-space: nowrap;
89-
}
90-
.struct-alloc-call {
91-
text-align: end;
92-
}
93-
.struct-alloc-metadata {
94-
white-space: nowrap;
75+
margin-bottom: 20px;
76+
77+
.struct-alloc-container {
78+
display: grid;
79+
grid-column: 1 / 5;
80+
grid-template-columns: subgrid;
81+
& > * {
82+
padding: 1ex;
83+
border-bottom: 1px dashed #ccc;
84+
}
85+
.struct-alloc-cache {
86+
margin-left: 3em;
87+
white-space: nowrap;
88+
}
89+
.struct-alloc-call {
90+
text-align: end;
91+
}
92+
.struct-alloc-metadata {
93+
white-space: nowrap;
94+
}
9595
}
9696
}
9797
}

analysis/kernel/dashboard/frontend/src/views/struct/struct.ts

+11-10
Original file line numberDiff line numberDiff line change
@@ -31,9 +31,10 @@ export class Struct {
3131
return map;
3232
}, new Map<string, Set<STRUCT_RESULTS>>).forEach((allocs, struct_name) => {
3333
let structEntryFragment = interpolateHtml(structEntryHtml, new Map([
34-
[`//a[@class="struct-name"]/@href`, `#!heap/${kmalloc}/${struct_name}`],
35-
[`//a[@class="struct-name"]/text()`, struct_name],
36-
[`//span[@class="struct-alloc-num"]/text()`, String(allocs.size)]
34+
[`//*[@class="struct-entry-container"]/@aria-rowspan`, `${allocs.size + 1}`],
35+
[`//*[@class="struct-name"]/a/@href`, `#!heap/${kmalloc}/${struct_name}`],
36+
[`//*[@class="struct-name"]/a/text()`, struct_name],
37+
[`//*[@class="struct-alloc-num"]/text()`, `${allocs.size}`]
3738
]));
3839
let structEntry = structEntryFragment.querySelector('.struct-entry');
3940
let structAlloc = structEntryFragment.querySelector('.struct-alloc');
@@ -47,13 +48,13 @@ export class Struct {
4748
alloc.kmalloc_dyn?"-dyn":""
4849
}`;
4950
let structAllocFragment = interpolateHtml(structAllocHtml, new Map([
50-
[`//a[@class="struct-alloc-cache"]/@href`, `#!heap/${kmalloc}/${struct}`],
51-
[`//a[@class="struct-alloc-cache"]/text()`, kmalloc],
52-
[`//div[@class="struct-alloc-call"]/text()`, `${alloc.call_value}`],
53-
[`//a[@class="struct-alloc-link"]/@href`, `#${alloc.call_uri}:${alloc.function_start_line}:${alloc.function_end_line}`],
54-
[`//a[@class="struct-alloc-link"]/text()`, `${alloc.call_uri}#${alloc.call_startLine}`],
55-
[`//a[@class="struct-alloc-link"]/@title`, `${alloc.function}`],
56-
[`//span[@class="struct-alloc-syscalls-num"]/text()`, `${alloc.syscalls_num}`]
51+
[`//*[@class="struct-alloc-cache"]/a/@href`, `#!heap/${kmalloc}/${struct}`],
52+
[`//*[@class="struct-alloc-cache"]/a/text()`, kmalloc],
53+
[`//*[@class="struct-alloc-call"]/text()`, `${alloc.call_value}`],
54+
[`//*[@class="struct-alloc-link"]/a/@href`, `#${alloc.call_uri}:${alloc.function_start_line}:${alloc.function_end_line}`],
55+
[`//*[@class="struct-alloc-link"]/a/text()`, `${alloc.call_uri}#${alloc.call_startLine}`],
56+
[`//*[@class="struct-alloc-link"]/a/@title`, `${alloc.function}`],
57+
[`//*[@class="struct-alloc-syscalls-num"]/text()`, `${alloc.syscalls_num}`]
5758
]));
5859
structAlloc!.appendChild(structAllocFragment);
5960
});

0 commit comments

Comments
 (0)