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

persist user preference width for MCTSplitPanes

Browse Source
This commit is contained in:
Deep Tailor
2017-08-01 12:00:21 -07:00
parent 34c3763421
commit 5a7fdf82ac
3 changed files with 19 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
platform/commonUI/browse/res/templates/browse.html
View File

@ -26,7 +26,7 @@
ng-controller="PaneController as modelPaneTree" ng-controller="PaneController as modelPaneTree"
ng-class="modelPaneTree.visible() ? 'pane-tree-showing' : 'pane-tree-hidden'"> ng-class="modelPaneTree.visible() ? 'pane-tree-showing' : 'pane-tree-hidden'">
<mct-split-pane class='abs contents' <mct-split-pane class='abs contents'
anchor='left'> anchor='left' saveUserWidthPreference='true'>
<div class='split-pane-component treeview pane left'> <div class='split-pane-component treeview pane left'>
<div class="abs holder l-flex-col holder-treeview-elements"> <div class="abs holder l-flex-col holder-treeview-elements">
<mct-representation key="'create-button'" <mct-representation key="'create-button'"
@ -60,7 +60,7 @@
ng-controller="InspectorPaneController as modelPaneInspect" ng-controller="InspectorPaneController as modelPaneInspect"
ng-class="modelPaneInspect.visible() ? 'pane-inspect-showing' : 'pane-inspect-hidden'"> ng-class="modelPaneInspect.visible() ? 'pane-inspect-showing' : 'pane-inspect-hidden'">
<mct-split-pane class='l-object-and-inspector contents abs' anchor='right'> <mct-split-pane class='l-object-and-inspector contents abs' anchor='right' saveUserWidthPreference="true">
<div class='split-pane-component t-object pane primary-pane left'> <div class='split-pane-component t-object pane primary-pane left'>
<mct-representation mct-object="navigatedObject" <mct-representation mct-object="navigatedObject"
key="navigatedObject.getCapability('status').get('editing') ? 'edit-object' : 'browse-object'" key="navigatedObject.getCapability('status').get('editing') ? 'edit-object' : 'browse-object'"
@ -87,4 +87,3 @@
</div> </div>
<mct-include key="'bottombar'"></mct-include> <mct-include key="'bottombar'"></mct-include>
</div> </div>

15
platform/commonUI/general/src/directives/MCTSplitPane.js
View File

@ -94,6 +94,7 @@ define(
* @constructor * @constructor
*/ */
function MCTSplitPane($parse, $log, $interval) { function MCTSplitPane($parse, $log, $interval) {
var splitPaneNumber = 1;
function controller($scope, $element, $attrs) { function controller($scope, $element, $attrs) {
var anchorKey = $attrs.anchor || DEFAULT_ANCHOR, var anchorKey = $attrs.anchor || DEFAULT_ANCHOR,
anchor, anchor,
@ -101,6 +102,10 @@ define(
positionParsed = $parse($attrs.position), positionParsed = $parse($attrs.position),
position; // Start undefined, until explicitly set position; // Start undefined, until explicitly set
// create unique alias for every instance of MCTSplitPane
var mctSplitPaneAlias = "mctSplitPaneAlias" + splitPaneNumber;
splitPaneNumber += 1;
// Get relevant size (height or width) of DOM element // Get relevant size (height or width) of DOM element
function getSize(domElement) { function getSize(domElement) {
return (anchor.orientation === 'vertical' ? return (anchor.orientation === 'vertical' ?
@ -148,8 +153,10 @@ define(
// Enforce minimum/maximum positions // Enforce minimum/maximum positions
function enforceExtrema() { function enforceExtrema() {
// Check for user preference on splitPane width
var userWidthPreference = window.localStorage[mctSplitPaneAlias];
position = Math.max(position, 0); position = Math.max(position, 0);
position = Math.min(position, getSize($element[0])); position = Math.min(position,(userWidthPreference || getSize($element[0])));
} }
// Getter-setter for the pixel offset of the splitter, // Getter-setter for the pixel offset of the splitter,
@ -208,7 +215,9 @@ define(
toggleClass: toggleClass, toggleClass: toggleClass,
anchor: function () { anchor: function () {
return anchor; return anchor;
} },
saveUserWidthPreference: $attrs.saveuserwidthpreference,
mctSplitPaneAlias: mctSplitPaneAlias
}; };
} }
@ -219,9 +228,7 @@ define(
controller: ['$scope', '$element', '$attrs', controller] controller: ['$scope', '$element', '$attrs', controller]
}; };
} }
return MCTSplitPane; return MCTSplitPane;
} }
); );

7
platform/commonUI/general/src/directives/MCTSplitter.js
View File

@ -56,6 +56,12 @@ define(
// Update the position of this splitter // Update the position of this splitter
mctSplitPane.position(initialPosition + pixelDelta); mctSplitPane.position(initialPosition + pixelDelta);
// Save user width preference to local storage if selected
if (mctSplitPane.saveUserWidthPreference === 'true') {
var myStorage = window.localStorage;
myStorage.setItem(mctSplitPane.mctSplitPaneAlias, initialPosition + pixelDelta);
}
}, },
// Grab the event when the user is done moving // Grab the event when the user is done moving
// the splitter and pass it on // the splitter and pass it on
@ -83,4 +89,3 @@ define(
} }
); );