Tree Performance Fixes (#2353)

* Disable disclosure triangle transition

* Reduce number of times navigation path is calculated
This commit is contained in:
Andrew Henry
2019-04-05 09:44:38 -07:00
committed by Pegah Sarram
parent 8b275b206b
commit 517a40a32b
5 changed files with 17 additions and 15 deletions

View File

@@ -148,8 +148,6 @@ button {
display: block; display: block;
font-family: symbolsfont; font-family: symbolsfont;
font-size: 1rem * $s; font-size: 1rem * $s;
transform-origin: center;
transition: $transOut;
} }
} }

View File

@@ -59,7 +59,8 @@ export default {
default() { default() {
return []; return [];
} }
} },
navigateToPath: String
}, },
data() { data() {
return { return {

View File

@@ -211,7 +211,8 @@
return { return {
id: this.openmct.objects.makeKeyString(c.identifier), id: this.openmct.objects.makeKeyString(c.identifier),
object: c, object: c,
objectPath: [c] objectPath: [c],
navigateToParent: '/browse'
}; };
}); });
}); });

View File

@@ -7,7 +7,8 @@
v-model="expanded"> v-model="expanded">
</view-control> </view-control>
<object-label :domainObject="node.object" <object-label :domainObject="node.object"
:objectPath="node.objectPath"> :objectPath="node.objectPath"
:navigateToPath="navigateToPath">
</object-label> </object-label>
</div> </div>
<ul v-if="expanded" class="c-tree"> <ul v-if="expanded" class="c-tree">
@@ -36,13 +37,12 @@
node: Object node: Object
}, },
data() { data() {
this.pathToObject = this.buildPathString(this.node.objectPath); this.navigateToPath = this.buildPathString(this.node.navigateToParent)
return { return {
hasChildren: false, hasChildren: false,
isLoading: false, isLoading: false,
loaded: false, loaded: false,
isNavigated: this.pathToObject === this.openmct.router.currentLocation.path, isNavigated: this.navigateToPath === this.openmct.router.currentLocation.path,
children: [], children: [],
expanded: false expanded: false
} }
@@ -103,7 +103,8 @@
this.children.push({ this.children.push({
id: this.openmct.objects.makeKeyString(child.identifier), id: this.openmct.objects.makeKeyString(child.identifier),
object: child, object: child,
objectPath: [child].concat(this.node.objectPath) objectPath: [child].concat(this.node.objectPath),
navigateToParent: this.navigateToPath
}); });
}, },
removeChild(identifier) { removeChild(identifier) {
@@ -115,15 +116,13 @@
this.isLoading = false; this.isLoading = false;
this.loaded = true; this.loaded = true;
}, },
buildPathString(path) { buildPathString(parentPath) {
return '/browse/' + path.map(o => o && this.openmct.objects.makeKeyString(o.identifier)) return [parentPath, this.openmct.objects.makeKeyString(this.node.object.identifier)].join('/');
.reverse()
.join('/');
}, },
highlightIfNavigated(newPath, oldPath){ highlightIfNavigated(newPath, oldPath){
if (newPath === this.pathToObject) { if (newPath === this.navigateToPath) {
this.isNavigated = true; this.isNavigated = true;
} else if (oldPath === this.pathToObject) { } else if (oldPath === this.navigateToPath) {
this.isNavigated = false; this.isNavigated = false;
} }
} }

View File

@@ -13,6 +13,9 @@ export default {
if (!this.objectPath.length) { if (!this.objectPath.length) {
return; return;
} }
if (this.navigateToPath) {
return '#' + this.navigateToPath;
}
return '#/browse/' + this.objectPath return '#/browse/' + this.objectPath
.map(o => o && this.openmct.objects.makeKeyString(o.identifier)) .map(o => o && this.openmct.objects.makeKeyString(o.identifier))
.reverse() .reverse()