mirror of
https://github.com/nasa/openmct.git
synced 2025-05-05 02:03:00 +00:00
e07cfc9394
* - 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.
67 lines
2.1 KiB
Vue
67 lines
2.1 KiB
Vue
/*****************************************************************************
|
|
* Open MCT, Copyright (c) 2014-2018, United States Government
|
|
* as represented by the Administrator of the National Aeronautics and Space
|
|
* Administration. All rights reserved.
|
|
*
|
|
* Open MCT is licensed under the Apache License, Version 2.0 (the
|
|
* "License"); you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
* http://www.apache.org/licenses/LICENSE-2.0.
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
|
* License for the specific language governing permissions and limitations
|
|
* under the License.
|
|
*
|
|
* Open MCT includes source code licensed under additional open source
|
|
* licenses. See the Open Source Licenses file (LICENSES.md) included with
|
|
* this source code distribution or the Licensing information page available
|
|
* at runtime from the About dialog for additional information.
|
|
*****************************************************************************/
|
|
|
|
<template>
|
|
<div class="c-text-view"
|
|
:style="styleObject">
|
|
{{ item.config.element.text }}
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
@import '~styles/sass-base';
|
|
|
|
.c-text-view {
|
|
display: flex;
|
|
align-items: stretch;
|
|
|
|
.c-frame & {
|
|
@include abs();
|
|
border: 1px solid transparent;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
item: Object
|
|
},
|
|
computed: {
|
|
styleObject() {
|
|
let element = this.item.config.element;
|
|
return {
|
|
backgroundColor: element.fill,
|
|
borderColor: element.stroke,
|
|
color: element.color,
|
|
fontSize: element.size
|
|
}
|
|
}
|
|
},
|
|
mounted() {
|
|
this.item.config.attachListeners();
|
|
},
|
|
destroyed() {
|
|
this.item.config.removeListeners();
|
|
}
|
|
}
|
|
</script> |