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

[Code Style] Use prototypes in general UI bundle

Browse Source 
WTD-1482.
This commit is contained in:
Victor Woeltjen
2015-08-11 09:47:54 -07:00
parent be5cad212a
commit 140d767026
7 changed files with 299 additions and 317 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
platform/commonUI/general/src/controllers/BottomBarController.js
View File

@ -43,20 +43,18 @@ define(
}; };
} }
indicators = indicators.map(present); this.indicators = indicators.map(present);
}
return {
/** /**
* Get all indicators to display. * Get all indicators to display.
* @returns {Indicator[]} all indicators * @returns {Indicator[]} all indicators
* to display in the bottom bar. * to display in the bottom bar.
* @memberof platform/commonUI/general.BottomBarController# * @memberof platform/commonUI/general.BottomBarController#
*/ */
getIndicators: function () { BottomBarController.prototype.getIndicators = function () {
return indicators; return this.indicators;
}
}; };
}
return BottomBarController; return BottomBarController;
} }

76
platform/commonUI/general/src/controllers/ClickAwayController.js
View File

@ -37,68 +37,62 @@ define(
* @param $document the document element, injected by Angular * @param $document the document element, injected by Angular
*/ */
function ClickAwayController($scope, $document) { function ClickAwayController($scope, $document) {
var state = false, var self = this;
clickaway;
// Track state, but also attach and detach a listener for this.state = false;
// mouseup events on the document. this.$scope = $scope;
function deactivate() { this.$document = $document;
state = false;
$document.off("mouseup", clickaway);
}
function activate() {
state = true;
$document.on("mouseup", clickaway);
}
function changeState() {
if (state) {
deactivate();
} else {
activate();
}
}
// Callback used by the document listener. Deactivates; // Callback used by the document listener. Deactivates;
// note also $scope.$apply is invoked to indicate that // note also $scope.$apply is invoked to indicate that
// the state of this controller has changed. // the state of this controller has changed.
clickaway = function () { this.clickaway = function () {
deactivate(); self.deactivate();
$scope.$apply(); $scope.$apply();
return false; return false;
}; };
}
// Track state, but also attach and detach a listener for
// mouseup events on the document.
ClickAwayController.prototype.deactivate = function () {
this.state = false;
this.$document.off("mouseup", this.clickaway);
};
ClickAwayController.prototype.activate = function () {
this.state = true;
this.$document.on("mouseup", this.clickaway);
};
return {
/** /**
* Get the current state of the toggle. * Get the current state of the toggle.
* @return {boolean} true if active * @return {boolean} true if active
* @memberof platform/commonUI/general.ClickAwayController#
*/ */
isActive: function () { ClickAwayController.prototype.isActive =function () {
return state; return this.state;
}, };
/** /**
* Set a new state for the toggle. * Set a new state for the toggle.
* @return {boolean} true to activate * @return {boolean} true to activate
* @memberof platform/commonUI/general.ClickAwayController#
*/ */
setState: function (newState) { ClickAwayController.prototype.setState = function (newState) {
if (state !== newState) { if (this.state !== newState) {
changeState(); this.toggle();
}
},
/**
* Toggle the current state; activate if it is inactive,
* deactivate if it is active.
* @memberof platform/commonUI/general.ClickAwayController#
*/
toggle: function () {
changeState();
} }
}; };
/**
* Toggle the current state; activate if it is inactive,
* deactivate if it is active.
*/
ClickAwayController.prototype.toggle = function () {
if (this.state) {
this.deactivate();
} else {
this.activate();
} }
};
return ClickAwayController; return ClickAwayController;
} }

87
platform/commonUI/general/src/controllers/SelectorController.js
View File

@ -39,28 +39,17 @@ define(
function SelectorController(objectService, $scope) { function SelectorController(objectService, $scope) {
var treeModel = {}, var treeModel = {},
listModel = {}, listModel = {},
selectedObjects = [], previousSelected,
rootObject, self = this;
previousSelected;
// For watch; look at the user's selection in the tree // For watch; look at the user's selection in the tree
function getTreeSelection() { function getTreeSelection() {
return treeModel.selectedObject; return treeModel.selectedObject;
} }
// Get the value of the field being edited
function getField() {
return $scope.ngModel[$scope.field] || [];
}
// Get the value of the field being edited
function setField(value) {
$scope.ngModel[$scope.field] = value;
}
// Store root object for subsequent exposure to template // Store root object for subsequent exposure to template
function storeRoot(objects) { function storeRoot(objects) {
rootObject = objects[ROOT_ID]; self.rootObject = objects[ROOT_ID];
} }
// Check that a selection is of the valid type // Check that a selection is of the valid type
@ -83,7 +72,8 @@ define(
function updateSelectedObjects(objects) { function updateSelectedObjects(objects) {
// Look up from the // Look up from the
function getObject(id) { return objects[id]; } function getObject(id) { return objects[id]; }
selectedObjects = ids.filter(getObject).map(getObject); self.selectedObjects =
ids.filter(getObject).map(getObject);
} }
// Look up objects by id, then populate right-hand list // Look up objects by id, then populate right-hand list
@ -94,66 +84,83 @@ define(
$scope.$watch(getTreeSelection, validateTreeSelection); $scope.$watch(getTreeSelection, validateTreeSelection);
// Make sure right-hand list matches underlying model // Make sure right-hand list matches underlying model
$scope.$watchCollection(getField, updateList); $scope.$watchCollection(function () {
return self.getField();
}, updateList);
// Look up root object, then store it // Look up root object, then store it
objectService.getObjects([ROOT_ID]).then(storeRoot); objectService.getObjects([ROOT_ID]).then(storeRoot);
return { this.$scope = $scope;
this.selectedObjects = [];
// Expose tree/list model for use in template directly
this.treeModel = treeModel;
this.listModel = listModel;
}
// Set the value of the field being edited
SelectorController.prototype.setField = function (value) {
this.$scope.ngModel[this.$scope.field] = value;
};
// Get the value of the field being edited
SelectorController.prototype.getField = function () {
return this.$scope.ngModel[this.$scope.field] || [];
};
/** /**
* Get the root object to show in the left-hand tree. * Get the root object to show in the left-hand tree.
* @returns {DomainObject} the root object * @returns {DomainObject} the root object
* @memberof platform/commonUI/general.SelectorController#
*/ */
root: function () { SelectorController.prototype.root = function () {
return rootObject; return this.rootObject;
}, };
/** /**
* Add a domain object to the list of selected objects. * Add a domain object to the list of selected objects.
* @param {DomainObject} the domain object to select * @param {DomainObject} the domain object to select
* @memberof platform/commonUI/general.SelectorController#
*/ */
select: function (domainObject) { SelectorController.prototype.select = function (domainObject) {
var id = domainObject && domainObject.getId(), var id = domainObject && domainObject.getId(),
list = getField() || []; list = this.getField() || [];
// Only select if we have a valid id, // Only select if we have a valid id,
// and it isn't already selected // and it isn't already selected
if (id && list.indexOf(id) === -1) { if (id && list.indexOf(id) === -1) {
setField(list.concat([id])); this.setField(list.concat([id]));
} }
}, };
/** /**
* Remove a domain object from the list of selected objects. * Remove a domain object from the list of selected objects.
* @param {DomainObject} the domain object to select * @param {DomainObject} the domain object to select
* @memberof platform/commonUI/general.SelectorController#
*/ */
deselect: function (domainObject) { SelectorController.prototype.deselect = function (domainObject) {
var id = domainObject && domainObject.getId(), var id = domainObject && domainObject.getId(),
list = getField() || []; list = this.getField() || [];
// Only change if this was a valid id, // Only change if this was a valid id,
// for an object which was already selected // for an object which was already selected
if (id && list.indexOf(id) !== -1) { if (id && list.indexOf(id) !== -1) {
// Filter it out of the current field // Filter it out of the current field
setField(list.filter(function (otherId) { this.setField(list.filter(function (otherId) {
return otherId !== id; return otherId !== id;
})); }));
// Clear the current list selection // Clear the current list selection
delete listModel.selectedObject; delete this.listModel.selectedObject;
} }
}, };
/** /**
* Get the currently-selected domain objects. * Get the currently-selected domain objects.
* @returns {DomainObject[]} the current selection * @returns {DomainObject[]} the current selection
* @memberof platform/commonUI/general.SelectorController#
*/ */
selected: function () { SelectorController.prototype.selected = function () {
return selectedObjects; return this.selectedObjects;
},
// Expose tree/list model for use in template directly
treeModel: treeModel,
listModel: listModel
}; };
}
return SelectorController; return SelectorController;

41
platform/commonUI/general/src/controllers/SplitPaneController.js
View File

@ -36,58 +36,53 @@ define(
* @constructor * @constructor
*/ */
function SplitPaneController() { function SplitPaneController() {
var current = 200, this.current = 200;
start = 200, this.start = 200;
assigned = false; this.assigned = false;
}
return {
/** /**
* Get the current position of the splitter, in pixels * Get the current position of the splitter, in pixels
* from the left edge. * from the left edge.
* @returns {number} position of the splitter, in pixels * @returns {number} position of the splitter, in pixels
* @memberof platform/commonUI/general.SplitPaneController#
*/ */
state: function (defaultState) { SplitPaneController.prototype.state = function (defaultState) {
// Set the state to the desired default, if we don't have a // Set the state to the desired default, if we don't have a
// "real" current state yet. // "real" current state yet.
if (arguments.length > 0 && !assigned) { if (arguments.length > 0 && !this.assigned) {
current = defaultState; this.current = defaultState;
assigned = true; this.assigned = true;
} }
return current; return this.current;
}, };
/** /**
* Begin moving the splitter; this will note the splitter's * Begin moving the splitter; this will note the splitter's
* current position, which is necessary for correct * current position, which is necessary for correct
* interpretation of deltas provided by mct-drag. * interpretation of deltas provided by mct-drag.
* @memberof platform/commonUI/general.SplitPaneController#
*/ */
startMove: function () { SplitPaneController.prototype.startMove = function () {
start = current; this.start = this.current;
}, };
/** /**
* Move the splitter a number of pixels to the right * Move the splitter a number of pixels to the right
* (negative numbers move the splitter to the left.) * (negative numbers move the splitter to the left.)
* This movement is relative to the position of the * This movement is relative to the position of the
* splitter when startMove was last invoked. * splitter when startMove was last invoked.
* @param {number} delta number of pixels to move * @param {number} delta number of pixels to move
* @memberof platform/commonUI/general.SplitPaneController#
*/ */
move: function (delta, minimum, maximum) { SplitPaneController.prototype.move = function (delta, minimum, maximum) {
// Ensure defaults for minimum/maximum // Ensure defaults for minimum/maximum
maximum = isNaN(maximum) ? DEFAULT_MAXIMUM : maximum; maximum = isNaN(maximum) ? DEFAULT_MAXIMUM : maximum;
minimum = isNaN(minimum) ? DEFAULT_MINIMUM : minimum; minimum = isNaN(minimum) ? DEFAULT_MINIMUM : minimum;
// Update current splitter state // Update current splitter state
current = Math.min( this.current = Math.min(
maximum, maximum,
Math.max(minimum, start + delta) Math.max(minimum, this.start + delta)
); );
//console.log(current + "; minimum: " + minimum + "; max: " + maximum);
}
}; };
}
return SplitPaneController; return SplitPaneController;
} }

28
platform/commonUI/general/src/controllers/ToggleController.js
View File

@ -34,37 +34,33 @@ define(
* @constructor * @constructor
*/ */
function ToggleController() { function ToggleController() {
var state = false; this.state = false;
}
return {
/** /**
* Get the current state of the toggle. * Get the current state of the toggle.
* @return {boolean} true if active * @return {boolean} true if active
* @memberof platform/commonUI/general.ToggleController#
*/ */
isActive: function () { ToggleController.prototype.isActive = function () {
return state; return this.state;
}, };
/** /**
* Set a new state for the toggle. * Set a new state for the toggle.
* @return {boolean} true to activate * @return {boolean} true to activate
* @memberof platform/commonUI/general.ToggleController#
*/ */
setState: function (newState) { ToggleController.prototype.setState = function (newState) {
state = newState; this.state = newState;
}, };
/** /**
* Toggle the current state; activate if it is inactive, * Toggle the current state; activate if it is inactive,
* deactivate if it is active. * deactivate if it is active.
* @memberof platform/commonUI/general.ToggleController#
*/ */
toggle: function () { ToggleController.prototype.toggle = function () {
state = !state; this.state = !this.state;
}
}; };
}
return ToggleController; return ToggleController;
} }
); );

62
platform/commonUI/general/src/controllers/TreeNodeController.js
View File

@ -51,10 +51,9 @@ define(
* @memberof platform/commonUI/general * @memberof platform/commonUI/general
* @constructor * @constructor
*/ */
function TreeNodeController($scope, $timeout, $rootScope) { function TreeNodeController($scope, $timeout) {
var selectedObject = ($scope.ngModel || {}).selectedObject, var self = this,
isSelected = false, selectedObject = ($scope.ngModel || {}).selectedObject;
hasBeenExpanded = false;
// Look up the id for a domain object. A convenience // Look up the id for a domain object. A convenience
// for mapping; additionally does some undefined-checking. // for mapping; additionally does some undefined-checking.
@ -77,17 +76,6 @@ define(
checkPath(nodePath, navPath, index + 1)); checkPath(nodePath, navPath, index + 1));
} }
// Track that a node has been expanded, either by the
// user or automatically to show a selection.
function trackExpansion() {
if (!hasBeenExpanded) {
// Run on a timeout; if a lot of expansion needs to
// occur (e.g. if the selection is several nodes deep) we
// want this to be spread across multiple digest cycles.
$timeout(function () { hasBeenExpanded = true; }, 0);
}
}
// Consider the currently-navigated object and update // Consider the currently-navigated object and update
// parameters which support display. // parameters which support display.
function checkSelection() { function checkSelection() {
@ -102,7 +90,7 @@ define(
// Deselect; we will reselect below, iff we are // Deselect; we will reselect below, iff we are
// exactly at the end of the path. // exactly at the end of the path.
isSelected = false; self.isSelectedFlag = false;
// Expand if necessary (if the navigated object will // Expand if necessary (if the navigated object will
// be in this node's subtree) // be in this node's subtree)
@ -121,12 +109,12 @@ define(
// at the end of the path, highlight; // at the end of the path, highlight;
// otherwise, expand. // otherwise, expand.
if (nodePath.length === navPath.length) { if (nodePath.length === navPath.length) {
isSelected = true; self.isSelectedFlag = true;
} else { // node path is shorter: Expand! } else { // node path is shorter: Expand!
if ($scope.toggle) { if ($scope.toggle) {
$scope.toggle.setState(true); $scope.toggle.setState(true);
} }
trackExpansion(); self.trackExpansion();
} }
} }
@ -140,39 +128,53 @@ define(
checkSelection(); checkSelection();
} }
this.isSelectedFlag = false;
this.hasBeenExpandedFlag = false;
this.$timeout = $timeout;
// Listen for changes which will effect display parameters // Listen for changes which will effect display parameters
$scope.$watch("ngModel.selectedObject", setSelection); $scope.$watch("ngModel.selectedObject", setSelection);
$scope.$watch("domainObject", checkSelection); $scope.$watch("domainObject", checkSelection);
return {
}
/** /**
* This method should be called when a node is expanded * This method should be called when a node is expanded
* to record that this has occurred, to support one-time * to record that this has occurred, to support one-time
* lazy loading of the node's subtree. * lazy loading of the node's subtree.
* @memberof platform/commonUI/general.TreeNodeController#
*/ */
trackExpansion: trackExpansion, TreeNodeController.prototype.trackExpansion = function () {
var self = this;
if (!self.hasBeenExpanded()) {
// Run on a timeout; if a lot of expansion needs to
// occur (e.g. if the selection is several nodes deep) we
// want this to be spread across multiple digest cycles.
self.$timeout(function () {
self.hasBeenExpandedFlag = true;
}, 0);
}
};
/** /**
* Check if this not has ever been expanded. * Check if this not has ever been expanded.
* @returns true if it has been expanded * @returns true if it has been expanded
* @memberof platform/commonUI/general.TreeNodeController#
*/ */
hasBeenExpanded: function () { TreeNodeController.prototype.hasBeenExpanded = function () {
return hasBeenExpanded; return this.hasBeenExpandedFlag;
}, };
/** /**
* Check whether or not the domain object represented by * Check whether or not the domain object represented by
* this tree node should be highlighted. * this tree node should be highlighted.
* An object will be highlighted if it matches * An object will be highlighted if it matches
* ngModel.selectedObject * ngModel.selectedObject
* @returns true if this should be highlighted * @returns true if this should be highlighted
* @memberof platform/commonUI/general.TreeNodeController#
*/ */
isSelected: function () { TreeNodeController.prototype.isSelected = function () {
return isSelected; return this.isSelectedFlag;
}
}; };
}
return TreeNodeController; return TreeNodeController;
} }

60
platform/commonUI/general/src/services/UrlService.js
View File

@ -36,61 +36,51 @@ define(
* @memberof platform/commonUI/general * @memberof platform/commonUI/general
*/ */
function UrlService($location) { function UrlService($location) {
// Returns the url for the mode wanted this.$location = $location;
// and the domainObject passed in. A path }
// is returned. The view is defaulted to
// the current location's (current object's) /**
// view set. * Returns the Url path for a specific domain object
function urlForLocation(mode, domainObject) { * without the index.html path and the view path
* @param {string} mode value of browse or edit mode
* for the path
* @param {DomainObject} value of the domain object
* to get the path of
* @returns {string} URL for the domain object
*/
UrlService.prototype.urlForLocation = function (mode, domainObject) {
var context = domainObject && var context = domainObject &&
domainObject.getCapability('context'), domainObject.getCapability('context'),
objectPath = context ? context.getPath() : [], objectPath = context ? context.getPath() : [],
ids = objectPath.map(function (domainObject) { ids = objectPath.map(function (domainObject) {
return domainObject.getId(); return domainObject.getId();
}), });
// Parses the path together. Starts with the // Parses the path together. Starts with the
// default index.html file, then the mode passed // default index.html file, then the mode passed
// into the service, followed by ids in the url // into the service, followed by ids in the url
// joined by '/', and lastly the view path from // joined by '/', and lastly the view path from
// the current location // the current location
path = mode + "/" + ids.slice(1).join("/"); return mode + "/" + ids.slice(1).join("/");
return path; };
}
// Uses the Url for the current location
// from the urlForLocation function and
// includes the view and the index path
function urlForNewTab(mode, domainObject) {
var viewPath = "?view=" + $location.search().view,
newTabPath =
"index.html#" + urlForLocation(mode, domainObject) + viewPath;
return newTabPath;
}
return {
/**
* Returns the Url path for a specific domain object
* without the index.html path and the view path
* @param {value} value of the browse or edit mode
* for the path
* @param {DomainObject} value of the domain object
* to get the path of
* @memberof platform/commonUI/general.UrlService#
*/
urlForNewTab: urlForNewTab,
/** /**
* Returns the Url path for a specific domain object * Returns the Url path for a specific domain object
* including the index.html path and the view path * including the index.html path and the view path
* allowing a new tab to hold the correct characteristics * allowing a new tab to hold the correct characteristics
* @param {value} value of the browse or edit mode * @param {string} mode value of browse or edit mode
* for the path * for the path
* @param {DomainObject} value of the domain object * @param {DomainObject} value of the domain object
* to get the path of * to get the path of
* @memberof platform/commonUI/general.UrlService# * @returns {string} URL for the domain object
*/ */
urlForLocation: urlForLocation UrlService.prototype.urlForNewTab = function (mode, domainObject) {
var viewPath = "?view=" + this.$location.search().view,
newTabPath =
"index.html#" + this.urlForLocation(mode, domainObject) +
viewPath;
return newTabPath;
}; };
}
return UrlService; return UrlService;
} }