mirror of
https://github.com/nasa/openmct.git
synced 2025-06-19 23:53:49 +00:00
Fluid layouts 2 electric boogaloo (#2047)
* [Frontend] Viewport metatag updated Fixes #2008 - Added shrink-to-fit=no; * [Frontend] Fix to Time Conductor for Safari Fixes #2008 - CSS mod for gradient blockers in TC * [Frontend] Remove data visualization element in TC Fixes #2008 - Note: this element holds the TOI indicator! * [Frontend] Hide TC ticks when on mobile Fixes #2008 - Added class `mobile-hide` to <conductor-axis> * [Frontend] Significant mobile fixes for panes and viewport Fixes #2008 Fixes #1770 Fixes #1928 - Left and right panes now positioning properly in mobile; - Fixed body overflow problem for #2008 "viewport" issue; * fixes multiple issues related to 2008 context menu firing too often - fixed by setting a isDragging flag Add and Remove respective classes on mobile orientation change by using mathMedia Close tree pane when navigating in mobile portrait only * [Frontend] Various Fixes #2008 - Always show Timeline zoom controls; - Prevent inline editing of object names in the main view when in mobile; * Add touch functionality to mct-drag it allows users to use the splitter in mobile and include appropriate tests * remove couchdb and reinstall localStorage * [Frontend] Mods to imagery CSS Fixes #2008 - Reduced size of image thumbnails; - Changed min-heights of image and thumbnail holders for .mobile.phone * [Frontend] Add Advanced CSS property to Display Layouts - WIP! - Add property to bundle; - Add CSS for column, row and fit-all classes; * [Frontend] Grid holder and class prefixing - WIP! - Edit grid-holder set to position: absolute - Added "fl-" prefix to fluid layout class names; * [Frontend] More CSS tweaks - WIP! * [Frontend] Added .drag-vertical - For use in Elements pool; - Applied in elements.html; * fix: check if stats is present before reseting zoom (#2029) * [Timer] Fix regression in timer visual indication and add tests * [TimeConductor] Fixes Issue #925 (#2020) * [TimeConductor] Fixes Issue #925` - Pressing enter in date field will update bounds properly in Safari * [Copyright] Update copyright year across platform code references Fixes #2034. * fixes issue #1999 - Use Object name as default export filename (#2001) * fixes issue #1999 add dynamic name(object name) to exportAsCSV filename * make requested changes * [Frontend] Add Advanced CSS property to Display Layouts - WIP! - Add property to bundle; - Add CSS for column, row and fit-all classes; * [Frontend] Grid holder and class prefixing - WIP! - Edit grid-holder set to position: absolute - Added "fl-" prefix to fluid layout class names; * [Frontend] More CSS tweaks - WIP! * [Frontend] Added .drag-vertical - For use in Elements pool; - Applied in elements.html; * [Frontend] More CSS tweaks - WIP! - Added .fl-phone-best-fit * working drag and switch, need to mutate * fix conflict * add ability to rearrange composition using drag gestures * add maxHeight and maxWidth to layout frames * [Frontend] Added fl-mobile-best-fit * [Frontend] Allow editor to set mins dimensions for fluid layout - Cleanups in CSS; - Mod to LayoutController.js to use minWidth and minHeight; * [Frontend] Styles for reordering in Elements pool - Changed class "dragging" to "reordering"; - Visual styling WIP; - TODO: style "reorder-actor" when implemented; * add reorder-actor class to draggable item in elements pool when selected and remove class when dropped * stacked plots reload on composition change * [Frontend] Tweaks to Elements pool reordering styles - "reorder-actor" added/removed from parent tree item; - Refined styling for drag in process in list; * [Frontend] Added new 12px list view glyph - Font files and CSS updates; * [Frontend] Added new 12px grippy glyph - Font files and CSS updates for Elements pool sorting styling; * fix failing test * make reviewer requested changes * remove create dialog from mobile
This commit is contained in:
@ -21,8 +21,8 @@
|
||||
*****************************************************************************/
|
||||
|
||||
define(
|
||||
[],
|
||||
function () {
|
||||
['zepto'],
|
||||
function ($) {
|
||||
|
||||
/**
|
||||
* The ElementsController prepares the elements view for display
|
||||
@ -32,6 +32,10 @@ define(
|
||||
function ElementsController($scope, openmct) {
|
||||
this.scope = $scope;
|
||||
this.scope.composition = [];
|
||||
this.openmct = openmct;
|
||||
this.dragDown = this.dragDown.bind(this);
|
||||
this.dragUp = this.dragUp.bind(this);
|
||||
|
||||
var self = this;
|
||||
|
||||
function filterBy(text) {
|
||||
@ -65,6 +69,7 @@ define(
|
||||
self.refreshComposition(domainObject);
|
||||
|
||||
if (domainObject) {
|
||||
|
||||
self.mutationListener = domainObject.getCapability('mutation')
|
||||
.listen(self.refreshComposition.bind(self, domainObject));
|
||||
}
|
||||
@ -76,11 +81,80 @@ define(
|
||||
openmct.selection.on('change', setSelection);
|
||||
setSelection(openmct.selection.get());
|
||||
|
||||
$scope.dragDown = this.dragDown;
|
||||
$scope.drag = this.drag;
|
||||
$scope.dragUp = this.dragUp;
|
||||
|
||||
$scope.$on("$destroy", function () {
|
||||
openmct.selection.off("change", setSelection);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Invoked on DragStart - Adds reordering class to parent UL element
|
||||
* Sets selected object ID, to be used on Drag End
|
||||
*
|
||||
* @param {object} event | Mouse Event
|
||||
*/
|
||||
ElementsController.prototype.dragDown = function (event) {
|
||||
if (!this.parentUL) {
|
||||
this.parentUL = $(document).find('#inspector-elements-tree');
|
||||
}
|
||||
|
||||
this.selectedTreeItem = $(event.target).parent();
|
||||
this.selectedObjectId = event.target.getAttribute('data-id');
|
||||
|
||||
this.parentUL.addClass('reordering');
|
||||
this.selectedTreeItem.addClass('reorder-actor');
|
||||
};
|
||||
|
||||
/**
|
||||
* Invoked on dragEnd - Removes selected object from position in composition
|
||||
* and replaces it at the target position. Composition is then updated with current
|
||||
* scope
|
||||
*
|
||||
* @param {object} event - Mouse Event
|
||||
*/
|
||||
ElementsController.prototype.dragUp = function (event) {
|
||||
this.targetObjectId = event.target.getAttribute('data-id');
|
||||
|
||||
if (this.targetObjectId && this.selectedObjectId) {
|
||||
var selectedObjectPosition,
|
||||
targetObjectPosition;
|
||||
|
||||
selectedObjectPosition = findObjectInCompositionFromId(this.selectedObjectId, this.scope.composition);
|
||||
targetObjectPosition = findObjectInCompositionFromId(this.targetObjectId, this.scope.composition);
|
||||
|
||||
if ((selectedObjectPosition !== -1) && (targetObjectPosition !== -1)) {
|
||||
var selectedObject = this.scope.composition.splice(selectedObjectPosition, 1),
|
||||
selection = this.openmct.selection.get(),
|
||||
domainObject = selection ? selection[0].context.oldItem : undefined;
|
||||
|
||||
this.scope.composition.splice(targetObjectPosition, 0, selectedObject[0]);
|
||||
|
||||
if (domainObject) {
|
||||
domainObject.getCapability('mutation').mutate(function (model) {
|
||||
model.composition = this.scope.composition.map(function (dObject) {
|
||||
return dObject.id;
|
||||
});
|
||||
}.bind(this));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (this.parentUL) {
|
||||
this.parentUL.removeClass('reordering');
|
||||
}
|
||||
|
||||
if (this.selectedTreeItem) {
|
||||
this.selectedTreeItem.removeClass('reorder-actor');
|
||||
}
|
||||
};
|
||||
|
||||
ElementsController.prototype.drag = function (event) {
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Gets the composition for the selected object and populates the scope with it.
|
||||
*
|
||||
@ -103,6 +177,21 @@ define(
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Finds position of object with given ID in Composition
|
||||
*
|
||||
* @param {String} id
|
||||
* @param {Array} composition
|
||||
* @private
|
||||
*/
|
||||
function findObjectInCompositionFromId(id, composition) {
|
||||
var mapped = composition.map(function (element) {
|
||||
return element.id;
|
||||
});
|
||||
|
||||
return mapped.indexOf(id);
|
||||
}
|
||||
|
||||
return ElementsController;
|
||||
}
|
||||
);
|
||||
|
Reference in New Issue
Block a user