ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-04-15 15:06:47 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Common UI] Encapsulate TreeNodeController

Browse Source 
Reduce reliance on  from TreeNodeController,
clean up and better isolate node expansion behavior.
Part of transition of common UI elements, WTD-574.
This commit is contained in:
Victor Woeltjen 2014-11-24 10:30:45 -08:00
parent eff9747198
commit f6850ffc4f
4 changed files with 46 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
bundles.json
View File

@ -3,6 +3,7 @@
"platform/core",
"platform/representation",
"platform/commonUI/browse",
"platform/commonUI/edit",
"platform/commonUI/dialog",
"platform/commonUI/general",

3
platform/commonUI/general/res/templates/test.html
View File

@ -1,3 +0,0 @@
<b>
<div style="width: 400px; border: 4px green solid; text-align:right;">{{model.name}}</div>
</b>

45
platform/commonUI/general/res/templates/tree-item.html
View File

@ -1,23 +1,28 @@
<span ng-controller="ToggleController as toggle">
<span class="tree-item menus-to-left" ng-controller="TreeNodeController">
<span class='ui-symbol view-control'
ng-click="toggle.toggle()"
ng-if="model.composition !== undefined">
{{toggle.isActive() ? "v" : ">"}}
<span ng-controller="TreeNodeController as treeNode">
<span class="tree-item menus-to-left">
<span class='ui-symbol view-control'
ng-click="toggle.toggle(); treeNode.setNodeObject(domainObject)"
ng-if="model.composition !== undefined">
{{toggle.isActive() ? "v" : ">"}}
</span>
<mct-representation key="'label'"
mct-object="domainObject"
parameters="parameters"
ng-click="parameters.callback(domainObject)"
ng-class="{selected: treeNode.isNavigated()}">
</mct-representation>
</span>
<span class="tree-item-subtree"
ng-show="toggle.isActive()"
ng-if="model.composition !== undefined">
ID: {{treeNode.getNodeObject().getId()}}?
<mct-representation key="'tree'"
parameters="parameters"
mct-object="treeNode.getNodeObject()">
</mct-representation>
</span>
</span>
<mct-representation key="'label'"
mct-object="domainObject"
parameters="parameters"
ng-click="parameters.callback(domainObject)"
ng-class="{selected: node.isSelected}">
</mct-representation>
</span>
<span class="tree-item-subtree"
ng-show="toggle.isActive()"
ng-if="model.composition !== undefined">
<mct-representation key="'tree'"
parameters="parameters"
mct-object="node.domainObject">
</mct-representation>
</span>
</span>

38
platform/commonUI/general/src/TreeNodeController.js
View File

@ -13,7 +13,9 @@ define(
* @constructor
*/
function TreeNodeController($scope, navigationService) {
var navigatedObject = navigationService.getNavigation();
var navigatedObject = navigationService.getNavigation(),
isNavigated = false,
expandedObject;
function idsEqual(objA, objB) {
return objA && objB && (objA.getId() === objB.getId());
@ -58,14 +60,16 @@ define(
function checkNavigation() {
var nodeObject = $scope.domainObject;
$scope.node.isSelected =
isNavigated =
idsEqual(nodeObject, navigatedObject) &&
idsEqual(parentOf(nodeObject), parentOf(navigatedObject));
// Expand if necessary
if (!$scope.node.expanded &&
isOnNavigationPath(nodeObject, navigatedObject) &&
$scope.toggle !== undefined) {
if (isOnNavigationPath(nodeObject, navigatedObject) &&
$scope.toggle !== undefined &&
$scope.toggle.isActive()) {
$scope.toggle.toggle();
expandedObject = nodeObject;
}
}
@ -74,25 +78,23 @@ define(
checkNavigation();
}
// When the node is expanded, set "node.domainObject" in
// the scope; this is used to populate the subtree, which
// should only happen when first expanded (lazy loading)
function doExpand(state) {
if (state) {
$scope.node.domainObject = $scope.domainObject;
}
}
// Set up a little namespace for tree node properties
$scope.node = {};
navigationService.addListener(setNavigation);
$scope.$on("$destroy", function () {
navigationService.removeListener(setNavigation);
});
$scope.$watch("domainObject", checkNavigation);
$scope.$watch("toggle.isActive()", doExpand);
return {
setNodeObject: function (domainObject) {
expandedObject = domainObject;
},
getNodeObject: function () {
return expandedObject;
},
isNavigated: function () {
return isNavigated;
}
};
}
return TreeNodeController;