48 Commits

Author SHA1 Message Date
Joel McKinnon
6d526eaf42 Fix lint errors (#2520)
* Fixed linting errors
* Disabled broken test
2019-10-29 15:49:55 -07:00
Andrew Henry
974be0ae2c
Auto-correct lint errors (#2450)
* Auto-fixed linting errors and manually corrected spacing on some comments
2019-08-27 09:26:58 -07:00
Deep Tailor
97230bb21f Context-Menu for Tables (#2424)
* add context menu capability to table rows, add view switcher to preview

* add an option to limit context menu actions to the ones requested, and modify preview action to also include a view historical data action

* extend preview action into view historical data action

* add context menu to LAD Table

* add keys to context menu actions, allow tables to conditionally attach context menu handler

* working switch y axis label

* New vertical select element for Y axis configuration in plots

- CSS for vertically rotated selects for Y axis label selection;
- New theme constants;
- Removed themedSelect theme mixins;
- New SASS svgColorFromHex function;

* use keys in lad table context menu options

* show historical view context menu on alpha-numerics

* make reviewer requested changes

* pass contextual object path from object view down etc

* made reviewer requested changes: removed options object, pass in object path instead

* remove redundant function from LADRow.vue
2019-07-26 16:09:59 -07:00
Andrew Henry
7fe4a77c43 Minor table refactoring (#2431)
* Refactor how tables process incoming data

* Fixed build in linux

* Added 'buttons' slot to tables

* Revert theme change
2019-07-22 15:08:42 -07:00
Pegah Sarram
884aec8ea0 Alpha-numeric printf format (#2416)
* Implement an inspector view provider to display a component that allows setting printf format for alphanumeric items in a display layout.

* Display 'Mixed' in format input if items' formats in selection are different.

* Use lodash function to find index.

* Simplify code.

* Put the logic to disallow viewing the inspector view for multi-select in the inspector view provider as apposed to the inspector view component.
2019-06-14 13:33:15 -07:00
Pegah Sarram
547d4e82db [Display Layout] Disallow moving objects beyond top or left edges of the edit area (#2390)
* Disallow moving objects beyond top or left edges of the edit area.

* Disallow line also to move beyond top or left edges of the edit area.
2019-04-28 12:30:10 -07:00
charlesh88
cf6458c69d Misc Fixes 2
- Better approach to title in layout frames;
- Removed unneeded !important attribs;
2019-04-16 23:31:59 -07:00
Andrew Henry
1a2048332f
Request latest data from alphanumerics (#2377) 2019-04-11 11:00:15 -07:00
Pegah Sarram
c6053e234a Implement multi selection (#2351)
* Modify Selection API to support multi-select via shift click.

* Add support for shift + click to add and remove the selection.

* Display message in Location and Properties for multi-select.

* Define applicableSelectedItems for toolbar items. Move toolbar  control definitions to functions.

* Hide positioning inputs if multi-select. Show a 'non-specific' icon when a discrete setting can't be shown in a mixed setting."

* Add toolbar controls in groups per layout item type. Add nonSpecific property to toolbar items to be used by toolbar controls to show non-specific icon.

* Modify toolbar button to react to nonSpecific flag. Get form value by checking value of applicable selected items.

* Support deleting multiple selected objects.

* Do not disable controls when selected items have mixed setting.

* Revert default color to original value.

* Changes to snap-to-grid

* Remove timeout for updating toolbar after mutation. Do not copy toolbar item when iterating the structure.

* Implement move to top and move to bottom for multi-select

* Implement move up and move down for multi-select.

* Markup and CSS changes for mixed settings in toolbar

- Toggle, color-picker buttons;
- TODO: check other themes and sync;

* Mixed settings styling complete

- Refined and synced theme constants;
- Styling for all toolbar components;
- Text size menu handling;
- Inspector messaging;

* Fix selection path

* Mixed settings styling refinements

- Normalized button styling for mixed style context;
- Better theme constant naming;
- Refined swatch styling, better theme constants;

* First cut at getting the bounding rectangle working for multi-select.

* Set pointer-events to none on c-edit-frame to prevent marquee reacting to click events.

* Delete capturing before calling select.

* Remove EditMarquee from ITEM_TYPE_VIEW_MAP

* Pass selected layout items as a prop to edit marquee instead of selection so that x, y, w, h are updated.

* Multi-select c-frame-edit visual fixes

- WIP

* Add complexContent class for a single selected item whose type is subobject-view.

* Move 'c-frame-edit-move' div to layout frame.

* Saving work - multi-move WIP

* Fixes issue with selection happening at end of drag

* Styles fixed for new markup organization

- Marquee, frame styles;
- $editMarqueeBorder style added to theme constants;

* Significant functionality for .c-frame-edit__move element

- Added .is-multi-selected class to .l-layout when > 1 items selected;
- __move element now handles multi-select and complex content (CC)
objects:
-- 0 to 1 items selected, displays as hover bar with grippy on all CC
 objects,
-- > 1 items selected, __move covers all of the frame of all selected CC
items and doesn't allow sub-object selection, and only displays as hover
bar on non-selected CC objects;
- Added better styling for selected objects while editing;
- Code cleanup and consolidation;
- Left translucent green style applied to __move element to temporarily
aid development;
- TODO: fix line drawing object;

* - Fix an issue where shift click did not remove the selected item from the selection after move.
- Modify telemetry and subobject views to emit move and endMove events.
- Clone selectedLayoutItems to get initial positions instead of selection so subsequent moves start from the current position.

* Fix cursor for __move, code comment refinements

* Code cleanup, line view markup changes

- line view markup brought into line with structure in LayoutFrame.vue;

* Implement multi-resize

* Simplify edit marquee code. Revert image and text views' default position to the original values.

* Fix resize for single selection when snap to grid is disabled

* Hide edit marquee if single line is selected, and show c-frame-edit in line-view instead.

* Fix for LineView handles

* Remove snap to grid toggle button and modify the migration script to convert elements with pixel coordinates to grid.

* Fix resizing single line

* Calculate width and height differently for line to position marquee correctly.

* Fix moving single selected line

* Calculate the height and width for line before comparing them with max height and width to correct the marquee position.

* Change the logic for showing frame edit for lines to check for item id.

* Allow multi-move with line in the mix.

* Implement multi-resize when grabbing SW corner.

* Removed temp green tint from __move element

* Fix object undefined error.

* Implement multi-resize for all items except line (take 2).

* Misc UI 7

- CSS selectors to properly display edit marquee, don't show in browse
mode;

* Fix multi-resize for lines.
Make sure line's height and width is minimum 1.

* Disable inspector views when multiple objects are selected.

* Restored layout grid display on sub-layout selection

* Clean up code

* Fixes

- Edit marquee display fixes;

* More code clean up

* SIGNIFICANT fixes and rewriting in LayoutFrame.vue

- Styles for .c-frame-edit__move element for selection and hovering;
- local controls;
- view large button;
- Theme constants updated;

* Get selected item's index from layoutItems.

* Address review feedback.

* Merge topic-core-refactor

* Reset keyString to empty string after setting original path when domainObject is undefined.
Add proper check for selection.
2019-04-05 14:22:10 -07:00
Charles Hacskaylo
6f3e2a8fbb Misc UI 7 (#2349)
* Misc UI 7

- Better approach to hide/show in Tabs view;

* Misc UI 7

- Fix Chrome 73 bug for Folders in Tabs and Flex Layouts views;

* Misc UI 7

- Fixed look of text inputs in Snow;
- Added description for Tabs View;

* Misc UI 7

- Resizeable table column headers now clip properly;
- Cleaned up and consolidated related CSS;

* Misc UI 7

- Remove undesired top margin in Flex Layouts;
- Fix Chrome 73 overflow bug in ObjectFrame;

* Misc UI 7

- Remove undesired top margin in Flex Layouts;
- Fix Chrome 73 overflow bug in ObjectFrame;
- Enhanced View Large button so now displays in objects with
frames hidden;
- Changed behavior for frame move bar such that it only displays for
selected items;
- Fixed bug where telem table columns can't be resized in new tables;
- Added overflow handling to telem table column headers;

* Misc UI 7

- Remove undesired top margin in Flex Layouts;
- Fix Chrome 73 overflow bug in ObjectFrame;
- Enhanced View Large button so now displays in objects with
frames hidden, and is only shown for objects that get
.has-complex-content applied;
- Changed behavior for frame move bar such that it only displays for
selected items;
- Fixed bug where telem table columns can't be resized in new tables;
- Added overflow handling to telem table column headers;
- Fix for clipped color palette in Summary Widgets, and better flex
layout in sizing in edit interface;
- Added timer and hyperlink to SIMPLE_CONTENT_TYPES list;

* Misc UI 7

- Accessibility: add name of object as title attribute to Layout frames;
- Moved c-frame base styling into c-so-view;

* remove title from layoutFrame
2019-04-04 10:45:17 -07:00
Andrew Henry
bc5e300ba9 Optionally provide list of object types to show as views rather than telemetry in Display Layouts (#2339)
* Optionally provide list of object types to show as views rather than alpha numerics to display layouts

* Only make table view available for objects that have telemetry to show
2019-03-28 22:21:27 -07:00
Deep Tailor
95549f7be2 Should not show editable views for objects in flexible layout and display layout (#2304)
* fix issue where editable summary widget view shows up in display layout and flexible layout

* keep consistent kebab case for props
2019-03-18 11:59:09 -07:00
Deep Tailor
350d3c92e7 remove is editing checks from toolbar providers since is editing is being checked by layout (#2314) 2019-03-17 21:01:03 -07:00
Andrew Henry
1c77ef142c Revert object duplication check from https://github.com/nasa/openmct/pull/2287/ (#2294) 2019-02-15 16:52:05 -08:00
Andrew Henry
21e08709cb Prevent self-composition in layouts (#2287) 2019-02-13 11:42:43 -08:00
Pegah Sarram
a1aa99837b Update isTelemetry logic to ignore imagery. (#2285) 2019-02-12 11:32:53 -08:00
Pegah Sarram
666bb41697 [Selection] support getting object view's selection context (#2272)
* Get selection context from object view for constructing the context in subobject view.

* Implement getSelectionContext for flexible layout provider and remove code that makes flexible layout self selectable.

* Get selection context from object frame when constructing context for frames.

* Disable Add button when selected parent is a flexible layout

* Make 'Add' button working for selected display layouts in a flexible layout.

* fix expand error and fix flexible layout toggle container issue

* Check for parent object before getting composition.
2019-02-01 17:40:30 -08:00
Charles Hacskaylo
075d4deecb R&I Misc UI 4b (#2271)
* Styling for selects
- New cleaner styling approach;
- New cSelect and appearanceNone mixins;
- Converted selects in Notebook, plot-options-edit;

* List View fixes
- Ellipsizing now works;
- Better icon and text alignment;

* Remove updateDrilledIn function and calls

* Telemetry Table editing styles

- Headers now have hover effects;

* Change 'toggle'-style toolbar buttons to reflect current state, rather
than what will be the setting once clicked
- When frame is hidden, button displays the frame-hidden icon, and
tooltip says 'Frame hidden';

* Enable all sub-object views in Display Layout to use numeric inputs for
x, y, width and height

* Toolbar sanding and polishing
- Button order tweaked to place stack order near X, Y, etc. inputs;
- Improved spacing between items themselves and separators;

* Fix indentation

* Fix indentation part deux
2019-01-25 12:50:16 -08:00
Pegah Sarram
dd31de6935 Add form to display layout type to allow setting grid size. Also fix generator's form. (#2274) 2019-01-24 16:03:09 -08:00
Pegah Sarram
9e811e722f [Display Layout] support ordering items (#2266)
* Add a toolbar menu for changing the display order of items.

* - Wire up orderItem
- Modify the toolbar API to support function as alternative for property path.
2019-01-23 10:51:29 -08:00
Charles Hacskaylo
8ef53d85c4 R&I Layout editing mods (#2256)
* Layout mods for sub object editing without is-drilled-in
* Remove drilled-in logic
2019-01-22 11:52:56 -08:00
Pegah Sarram
931871ff95 [Display Layout] Snap to grid toolbar toggle button (#2262)
* Add a  button in the toolbar to toggle snapp to grid.

* Convert item's coordinates and size from grid unit to pixels depending on useGrid value.

* Rename selectionListener to removeSelectionListener
2019-01-17 09:24:59 -08:00
Andrew Henry
c0c7d96429 Change domain-object event transfer data to domain-object-path 2019-01-14 12:07:31 -08:00
Andrew Henry
4084a1ac86 Drag and drop fixes (#2249)
* Drag-drop edit mode from capture handler. Drag-drop composition from bubble handler. Check composability on drag start

* Show drop hints without being in edit mode.

* Don't serialize objects twice on drag
2019-01-11 11:20:57 -08:00
Charles Hacskaylo
30a4888363 R&I Misc UI 3 (#2253)
* Limits-related changes; WIP

- Renamed CSS classes: `s-limit-*` > `is-limit--*`;
- Removed load of legacy _status.scss and added new _status.scss file;
- Minor re-org of limit/status constants in theme files;
- Limit colors in theme constants all updated;

* Fixes for s-selected always displaying the move cursor

- Mod s-selected;
- Reinstitute `.is-moveable` class;

* Layout-related cleanup and refinements

- LineView cleaned up;
- Selection, hover, etc. classes for c-frame cleaned up;
- Constant names normalized, theme files updated;

* Fixes for editing plot options

- Color palette now more flexible;
- Styles for color palette button refined;
- c-input--flex added for more flexible inputs;

* Various swatch-related changes

- Swatch refinements, new .c-click-swatch class;
- Added .c-click-icon--major modifier style, applied in markup;

* Local controls class application and behavior cleanup

- Remmoved .has-local-controls from selected markup;
- Refined CSS selector for better hover behavior;

* Misc UI tweaks

- click-icon--major in Notebook;
- .test mixin improved;

* Update _constants-espresso.scss

* Update _constants-maelstrom.scss
2018-12-20 13:17:44 -08:00
Pegah Sarram
464e5de947 [Display Layout] Add delete button (#2251)
* Add delete button in the toolbar for removing items

* Mutate composition if there are no telemetry objects. Select the parent layout after deleting an item.

* Saving work

* Watch for index in the components and update it in the context.

* Select the parent after a composition is removed.

* Address reviewer's feedback.
- Rename mutatComposition() to removeFromComposition().
- Inline logic for filtering composition
- Use separate branches for each item type in trackItem().

* Address reviewer's requested changes
2018-12-20 13:15:23 -08:00
Andrew Henry
da3af4b3db Merged from TCR 2018-12-13 15:36:13 -08:00
Pete Richards
afa1589cb5 Reorganize components, create ObjectFrame 2018-12-13 09:16:42 -08:00
Andrew Henry
d026bc2134 Show edit only if view is editable. Rename editable to canEdit 2018-12-12 17:17:49 -08:00
Andrew Henry
0d8dad1559 update preview action to use new action registry
* Support category arrays for legacy actions

* Fixed object path listener. Removed old context menus

* Removed old fullscreen action and Screenfull dependency

* Restore confirmation dialog on remove

* Restored tests

* Remove unused legacy policies

* WIP re-implementation of Preview action

* WIP for Charles to take a look at flex issues

* Disable legacy preview action

* Style and markup fixes for new Preview

- LegacyViewProvider modded to wrap legacy elements in .u-contents div;
- Added selector that automatically defines display: contents on
`no-class` divs injected into __object-view;
- Unit tested with legacy and new components (telem tables, plot view,
Notebook, etc.)

* Tweak z-indexes, fix open in new tab action, add 'done' button

* Removed legacy action

* reuse contextMenuDropDown component
2018-12-11 19:25:20 -08:00
Pegah Sarram
c1ef701eb2 merge display layout view config with components, add line view.
* Hacky WIP

* WIP

* check for 'domainobject' in data transfer

* Metadata manager can return default display value

* Refactor subobject and telemetry views to use layout frame

* Use data domainObject

* Get metadata for selected object.

* Don't inject lodash via vue

* move selection to specific layout types

* restore toolbar functionality

* Support creating line

* Add controls for setting x, y, x2 and y2 for lines from the toolbar.

* Initial attempt at resizing lines

* Check for duplicate panel

* line resize handles working

* Get Text and Box elements working.

* Refactor image view to use layout frame

* Fix drill in

* Check for object before accessing the identifier to avoid type error.

* Add inspectable class if item is subobject or telemetry view.

* Delete unused files

* remove unused imports

* Fix typos

* Fix cssClass and objectPath

* object can be undefined so check for it not being undefined before adding a listener.

* Set cssClass when domain object is available

* Get user input for text and image in the toolbar when adding element.
2018-12-11 11:28:16 -08:00
Pegah Sarram
981392ea07 Define metadata when component is created. (#2237) 2018-12-07 10:34:31 -08:00
Charles Hacskaylo
5928a102a6 Theme refactoring (#2234)
* Theme refactoring

- New hero, header and body font mixins added to theme files;
- Mods to body, griditem, frames, browsebar, etc. to use new font
mixins;
- Moved symbolsfont definition into _constants.scss;

* Tweak - make SubobjectView use header font;

* Add new theme 'maelstrom';

* Add comment

* Remove deprecated .svg and .eot symbol font files
2018-12-07 10:26:54 -08:00
Andrew Henry
c748569433 Address testathon issues relating to context menu (#2235)
* Support category arrays for legacy actions

* Fixed object path listener. Removed old context menus

* Removed old fullscreen action and Screenfull dependency

* Restore confirmation dialog on remove

* Restored tests

* Remove unused legacy policies
2018-12-07 10:15:11 -08:00
Deep Tailor
a87fc51fbb Flexible Layout Refactor (#2223)
* only store identifiers in frames

* move drop hints outside frame

* fix resizing

* fix drag and drop frames

* fix reordering of columns

* multiple improvements

* fix styling for drop hint in empty container

* fix frame reorder in same column

* better drop target show logic

* better frame drop to logic

* fix container reordering

* add uuids for frames and containers to prevent clashing

* toolbar updates

* use shared subobject component to ease styling

* add type cssClass to subobject component header, and delete frame header vue file

* add context menu in subobject views

* change height and width to size for both frames and containers

* remove uneccesary methods from resizeHanfle and inline logic instead

* remove left click logic from context-menu mixin, add a click handler to dropDownContextMenu to show menu

* make a mixin to listen for isEditing

* encapsulate drop hints, and pass allowDrop logic to check if drop hint is valid

* use event.dataTransfer instead of vue events for container reordering

* remove vue events for frame dnd and use html events

* better implementation of toolbar

* remove unused event

* fix container resizing when adding new container

* make reviewer requested changes

* add containerId to event vs having a JSON object

* watch domainObject from flexible layouts and pass down to components

* change domainObject directly on add Container

* update domainObject on change, and cahnge toolBarProvider to function that returns an object

* fix plugin

* set domainObject as data property in felxibleLayouts

* use class instead of inline styles

* Cleanup code

inline this.$el for components that measure their own size
replace snapToPercentage with Math.round
inject object as layoutObject, not dObject.

* reuse sizing logic between frames and containers

* clean up handlers

split handlers for createFrame and moveFrame events in container.
reorganize methods for each to clarify how they operate.

* ObjectView only stops propagation when it handles event

* use ids in toolbar to ensure correct items are mutated

Because index may change due to drag and drop events,
deleteFrame and deleteContainer should operate using identifiers
instead of index.

Also, generate path for hasFrame using indexes when object is
selected, otherwise hasFrame may refer to the incorrect path.
2018-12-07 09:34:33 -08:00
Pegah Sarram
e07cfc9394 Layout drawing (#2232)
* - Show "Add" button in the toolbar when a display layout object is selected.
- Add a flag to object view's show() method to indicate immediate selection of the view. If the view implements getSelectionContext() use it, otherwise set to default context.

* Create a component for each element.

* Saving work

* Add element factory for creating new instances of elements.

* Mutate element when a new one added and get elements when the component is mounted.

* Add create() method for creating a new telemetry and element in their respective view configuration.

* Add some of the toolbar controls for box, text, image and line elements. Also, add X, Y, Width and Height controls for alhpanumeric elements.

* Pass name to addElement as type.

* Add c-frame-inspectable class if item is inspectable.

* Clean up

* Hide frame for summary widgets by default.

* Better styling for editing

- s-selected on shell__main-container;
- Better edit grid coloring for espresso;

* - Update toolbar-button to support dialogs.
- Update toolbar to construct a value object based on form keys if a toolbar item has a dialogi, and mutate the form keys.
- Add toolbar controls for editing text and url for 'Text' and 'Image' elements respectively.

* Editing-related changes

- Removed hard-coded .is-selectable and .is-moveable from
LayoutItem.vue, updates accordingly to _global.scss;
- Theme constants updated;
- TODO: apply changes to Flexible Layouts;

* Better defaults

- Better default grid size and object size;

* - Fix toolbar-input to read value as a number if type is 'number'.
- Remove rawPosition from view configuration and instead get the position and dimensions from the properties (x, y, width and height) directly.
- Set the style property on the view configuration instead of the layout item.
- Move the logic for updating the style to the view configuration.

* Fix default dimensions for telemetry items and subobjects since the default grid size is changed.

* Remove form definition for display layout type.

* Reword the comment

* Let subobject view configuration handle new panel creation.

* Add default grid size back and remove unused code.

* Pass in only the needed method.

* Define default position in case the object is not added via drag 'n drop.
2018-12-04 09:12:45 -08:00
Pegah Sarram
f06427cb3e Show field name as title. (#2233) 2018-12-04 08:15:33 -08:00
Andrew Henry
a7948ce83e Implemented context menu action registry 2018-11-22 15:53:50 -08:00
Pegah Sarram
74faf1bd48 Create a base view configuration class. (#2225) 2018-11-16 12:56:51 -05:00
Pete Richards
0e06a7b403 Hide openmct with closures to prevent it becoming reactive 2018-11-09 08:33:50 -08:00
Pegah Sarram
d13d59bfa0 Display layout alphanumeric (#2203)
* Support displaying and adding telemerty points in display layouts.

* Create TelemetryView component. Also disable the toolbar frame button for telemetry objects.

* Add 'components' directory and move the toolbar provider definition to a separate file.

* Saving work

* Saving work

* Saving work

* Fix telemetryClass

* Fixes for .no-frame in new markup structure

- CSS cleaned up and reorganized;
- Added .c-telemetry-view classes;

* Add computed properties for hiding label and value.

* Filter value meta data based on the item config display mode.

* Add drop down menus for display mode and value

* Add toolbar controls for telemerty points

* Set border and fill related styles on telemetry view instead of layout item

* Refinements to telemetry view

- Stoke and fill styling now work;
- Internal element layout now much better when sizing in a Layout frame;
- Tweaked color of frame border while editing;

* Prevents adding a new (panel) object if it's already in the composition.

* Fix for jumping edit area

- Removed v-if from Toolbar.vue;
- Refined c-toolbar styling;
- TODO: don't include toolbar component when not editing, and for
components that don't use a toolbar;

* Add a separator toolbar control

* Check for domainObject being on the toolbar item as not all controls have that property

* Hide 'no fill' option from the text palette.
Modify the color-picker component to say 'No border' for stroke palette.

* Move the listener for hasFrame to the subobject view configuration

* Fixes for toolbar-separator

- New mixin;
- Corrected markup for separator;
- New class for .c-toolbar__separator;
- Updated DisplayLayoutToolbar.js to include separators in the right
spots;

* Get type from item.

* Include copyright notice.

* Use arrow function for consistency and define a TEXT_SIZE constant.

* Use composition API to add non-telemetry objects instead of relying on the drop handler.
Display a blocking dialog if an existing non-telemetry object is dropped.

* Fix text color picker icon

* Address reviewer's feedback

* Load the composition and update addObject() to render existing panels as well. Also, cache the telemetry value formatter.

* Add listener for changes to time bounds.

* Code cleanup

* Use getFormatMap() to store formats. Reset telemetry value and class before fetching new data.

* Fix a typo

* Define telemetry class and value as computed properties.

* Change context object definition

* Look at the telemetry metadata to find a good default for the value key instead of defaulting to 'sin'. Also, make formats reactive.

* Use let instead of var.
2018-11-08 17:09:17 -08:00
Andrew Henry
cbcfd44016 Elements pool and drag drop (#2196)
* Implemented drag-and-drop composition

* Added composition policy for tables

* Reimplemented elements pool in Vue

* No need to resolve all objects on the navigated path

* Only show elements pool in edit mode

* Remove old elements pool

* Updated legacy code to use composition policy API

* Keep object in sync when mutated
2018-10-23 10:52:37 -07:00
Pegah Sarram
a296bc2b81 Fix regression in layout frame edit handle by using a modifier convention. 2018-10-22 10:14:22 -07:00
Pegah Sarram
4374a6fa28 Toolbar in Fixed Position (#2194)
* Initial attempt at getting the toolbar for the fixed position working with the Vue toolbar controls.

* Set title for controls

* Significant mods to support legacy Fixed Position

- Moved selection and editing styles into _global.scss;
- Changed class naming in legacy fixed.html to map to newer CSS styles;

* Pass in the color value

* Do not show the toolbar container if structure is empty.

* Use a plugin for fixed position to get access to openmct. Show the toolbar only if the object is being edited.

* Ensure fixedController is on the selection context when editing

* Add listener for a domain object with the same id only once.
Update the toolbar value after the object mutation.
Remove editor isEditing listener on destroyed.

* Remove space between the size and px.
If newObject exists, update the toolbar value.

* Remove --nwse class name which seems to be a typo

* use modifier convention
2018-10-19 11:42:30 -07:00
Pegah Sarram
d48cc2deee Vue toolbar (#2191)
* Add a toolbar provider for display layout.

* Move toolbar provider to the plugin

* basic toolbar generation

* componentize different toolbar control types

Break toolbar control types down into different parts and provide
a test toolbar generator in index.html that utilizes all the
controls.

* Get the 'Show frame' checkbox working in the toolbar

* - Remove extra listener.
- Display toolbar only when editing.

* Modify the Selection API to set s-selected and s-selected-parent attributes instead of adding to the css class names.

* Move the logic for allowing the toolbar in the edit mode to the provider.

* Use toggle-button component to toggle frame

* Delete old files

* Remove MCTToolbar

* Modify the toggle button component to return the computed value

* Remove reload=true

* Revert to the original setting

* use value from props

* Always update toolbars on edit status change

* restore fixed position bundle

* bring back reload when hmr unavailable
2018-10-11 11:33:33 -07:00
charlesh88
72cdb352f0 Fix s-selected, edit grid displays 2018-10-05 12:15:20 -07:00
Pegah Sarram
27506a3757 Remove selectable from display layut 2018-10-05 11:39:41 -07:00
Pegah Sarram
e7cdb334de Reimplementation of Display Layout in Vue (#2185)
* Saving work

* Fix conflict

* Position the panels by setting the style

* Put the div back with height set to 100% in ObjectView.
Add markup for  drag handles.

* Use default position and dimensions if the layout panel is missing those values. Set s-status-editing on the main div to get the drag handles appear for now.

* Display Layout and frames major improvements

- Moved Toolbar out of Layout.vue and into DisplayLayout.vue;
- Styles for object view, Layout, Frame, etc.
- Major refactor of markup for frame;
- Added abs() mixin;
- Styles for is-editing done;
- Styles for
- TODO: styles for selectable, moveable, etc.

* Implement drill in gesture.

* Hide the background grid when a frame is drilled in

* Edit styling and toolbar WIP

- c-search styles moved mostly into mixin;
- New .c-labeled-input class;
- Browser overrides for number-type input spinners in webkit;

* Toolbar WIP

- Custom wrapped number input added;
- Toolbar buttons WIP;

* New toolbar buttons WIP

* Define a computed property for the css class object.

* Frame edit handles markup and styling

* Toolbar, editing and selection style refinements

- Moved toolbar back into Layout.vue;
- Hard-coded 'is-editing' onto __pane-main for now,
removed from DisplayLayout.vue;
- Styles for frame in LayoutFrame.vue:
-- editing default (dotted border)
-- editing .s-selected
-- .s-drilled-in (renamed .is-drilled-in)

* Refactoring button classes

- Lots of stuff broken right now;
- TODO: lots of renaming (c-menu-button, c-icon-button, etc.);
- Removed import of _controls in search.vue;

* Fixes for selection on nested selected elements

* Fix conflict

* Significant refactoring of button and click-icon classes

- Markup and CSS updated;
- Toolbar in good shape, prior to merge of vue-layout;

* Fix issues with relative font-sizing

* Add color palette markup and CSS

- Also added Layers menu example;

* Font, font-size glyphs and size menu, and more

- Added art for font glyph and renamed from .icon-T;
- Added new glyph for font-size;
- Fixed font-sizing in controls;
- Added font-size menu;
- Re-org'd toolbar items;

* Styling tweak for c-labeled-input

- Code cleanup as well;

* Fixes for toolbar toggleMenus and labeledNumberInput

* Implement resize and move for frames.
Added stub for drag 'n drop.

* Add custom checkbox control.

- Also, code cleanup.

* Add toggleButton component

- Code and examples

* Custom checkbox code cleanups, sanding

* - Persist new position/dimensions on the domain object when frames are moved/resized.
- Bypass the selection of the layout when dragging a frame is finished to keep the frame selected.
- Set the grid size to layoutGrid from domain object or use default if it's not specified.

* Fix conflict

* Implement resize and move for frames.
Added stub for drag 'n drop.

* Remove old layout view, was triggering View Switcher
and massive confusion when viewing Layouts

- TODO: add view provider for new Layout

* Enable drag and drop

* Changed example toggle-button

- Now uses show/hide frame as toggle-button example;

* Added pseudocode for handling drag/drop composition change

* Add copyright notice

* Layout frame and contained components styling

- Hyperlinks, Hyperlink buttons, Summary Widgets now use `.u-links`
which disables their pointer-events when editing;
- Hyperlink buttons, Summary Widgets now expand to fill their
containers in a Layout;
- Markup and JS for Hyperlinks, Hyperlink buttons, Summary Widgets
somewhat
modded to use new classing, applied in legacy scss files;

* Fix icon sizing error in BrowseBar

* Edit and selecting styling for Layouts

- WIP!

* Edit and selecting styling for Layout frames

- Color vars more standardized;
- Hover and *-selected styles;

* Getting vue-toolbar reverted back to latest

- Merging this branch with vue-layout may cause conflicts;

* - Implement drag ’n drop.
- Set hasFrame to a default value if it’s not set on the configuration.
- Emit an event to the parent wrapper component to update the ‘newDomainObject’ prop whenever the domain object is mutated in the display layout child component.

* Revert emitting 'update:object' event to the parent.

* New branch from topic-core-refactor to use as central point for common
CSS work

- Manually migrated changes from vue-toolbar, expect conflicts there and
 in vue-layout;

* Manually update constants-snow from vue-toolbar branch

* Update markup to use latest button classnames

- c-menu-button > c-button--menu;
- c-icon-button > c-click-icon;

* Various from vue-conductor-style

- Mods to input styling;
- Input[] styles moved to _controls;
- New/revised constants vals;

* Resolve bizarre merge conflict when applying stash

* Code cleanup

* Alias and type-icon fixes

- More robust approach to alias indicators;
- Added alias indication to tree-item.vue;
- TODO: wire up alias indication tree-item.vue;

* Accessibility mods, convert elements to <button>

- Better reset styles for htmlInputReset mixin to allow use of <button>
without browser default styling;
- Create button;
- BrowseBar action buttons;
- c-click-icons;
- Removed Preview button from BrowseBar.vue;

* Fix styles that were affected during resolving conflicts

* Moved draggable into __label element rather than whole <li>

* Change the priority to 100 to get the view working properly

* Code cleanup

* Remove angular layout

* Display the object name in the frame header

* Tweaks to __header in LayoutFrame

- Name now does not overflow frame edge;
- Layout strategy now in parity with similar elements in main view;

* Remove test()

* Add a type for display layout to make it appear in the Create menu.

* Change the key type to 'layout'

* Clean up code and hide toolbar

* Enable toolbar, and revert changes in webpack config

* Remove commented code

* revert to the original code
2018-10-04 15:59:23 -07:00