mirror of
https://github.com/nasa/openmct.git
synced 2024-12-18 20:57:53 +00:00
Resolve conductor configuration immediately (#2276)
* Set time system / bounds immediately based on conductor configuration * Hide date picker if not UTC based time system. Improve Conductor configuration error messages.
This commit is contained in:
Andrew Henry
Pegah Sarram
parent
666bb41697
commit
1a06702dbe
208
index.html
208
index.html
@ -36,7 +36,9 @@
|
||||
<body>
|
||||
</body>
|
||||
<script>
|
||||
var THIRTY_MINUTES = 30 * 60 * 1000;
|
||||
const FIVE_MINUTES = 5 * 60 * 1000;
|
||||
const THIRTY_MINUTES = 30 * 60 * 1000;
|
||||
|
||||
[
|
||||
'example/eventGenerator',
|
||||
'example/styleguide'
|
||||
@ -67,8 +69,8 @@
|
||||
timeSystem: 'utc',
|
||||
clock: 'local',
|
||||
clockOffsets: {
|
||||
start: -25 * 60 * 1000,
|
||||
end: 5 * 60 * 1000
|
||||
start: - THIRTY_MINUTES,
|
||||
end: FIVE_MINUTES
|
||||
}
|
||||
}
|
||||
]
|
||||
@ -79,206 +81,6 @@
|
||||
openmct.install(openmct.plugins.Tabs());
|
||||
openmct.install(openmct.plugins.FlexibleLayout());
|
||||
openmct.install(openmct.plugins.LADTable());
|
||||
openmct.time.clock('local', {start: -THIRTY_MINUTES, end: 0});
|
||||
openmct.time.timeSystem('utc');
|
||||
openmct.start();
|
||||
|
||||
// openmct.toolbars.addProvider({
|
||||
// name: "Testing Toolbar",
|
||||
// key: "testing",
|
||||
// description: "a mock toolbar that exercises all controls",
|
||||
// forSelection: function (selection) {
|
||||
// return true; // always applies.
|
||||
// },
|
||||
// toolbar: function (selection) {
|
||||
// return [
|
||||
// {
|
||||
// control: 'menu',
|
||||
// icon: 'icon-plus',
|
||||
// label: 'Add',
|
||||
// options: [
|
||||
// { name: 'Box', class: 'icon-box', title: 'Add Box' },
|
||||
// { name: 'Line', class: 'icon-line-horz', title: 'Add Line' },
|
||||
// { name: 'Text', class: 'icon-font', title: 'Add Text' },
|
||||
// { name: 'Image', class: 'icon-image', title: 'Add Image' }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// control: 'separator'
|
||||
// },
|
||||
// {
|
||||
// control: 'color-picker',
|
||||
// icon: 'icon-paint-bucket',
|
||||
// value: '#33ff00',
|
||||
// },
|
||||
// {
|
||||
// control: 'color-picker',
|
||||
// icon: 'icon-pencil',
|
||||
// value: '#ffffff',
|
||||
// },
|
||||
// {
|
||||
// control: 'color-picker',
|
||||
// icon: 'icon-font',
|
||||
// value: '#333333',
|
||||
// },
|
||||
//
|
||||
// {
|
||||
// control: 'separator'
|
||||
// },
|
||||
// {
|
||||
// control: 'select-menu',
|
||||
// value: 11,
|
||||
// options: [
|
||||
// { value: 9, name: '9 px' },
|
||||
// { value: 10, name: '10 px' },
|
||||
// { value: 11, name: '11 px' },
|
||||
// { value: 12, name: '12 px' },
|
||||
// { value: 13, name: '13 px' },
|
||||
// { value: 14, name: '14 px' },
|
||||
// { value: 16, name: '16 px' },
|
||||
// { value: 18, name: '18 px' },
|
||||
// { value: 20, name: '20 px' },
|
||||
// { value: 24, name: '24 px' },
|
||||
// { value: 28, name: '28 px' },
|
||||
// { value: 32, name: '32 px' },
|
||||
// { value: 40, name: '40 px' },
|
||||
// { value: 48, name: '48 px' },
|
||||
// { value: 56, name: '56 px' },
|
||||
// { value: 64, name: '64 px' },
|
||||
// { value: 72, name: '72 px' },
|
||||
// { value: 80, name: '80 px' },
|
||||
// { value: 88, name: '88 px' },
|
||||
// { value: 96, name: '96 px' },
|
||||
// { value: 128, name: '128 px' },
|
||||
// { value: 160, name: '160 px' }
|
||||
// ]
|
||||
// },
|
||||
//
|
||||
// {
|
||||
// control: 'separator'
|
||||
// },
|
||||
// {
|
||||
// control: 'menu',
|
||||
// icon: 'icon-layers',
|
||||
// options: [
|
||||
// { name: 'Move to top', class: 'icon-arrow-double-up', title: 'Move to top' },
|
||||
// { name: 'Move up', class: 'icon-arrow-up', title: 'Move up' },
|
||||
// { name: 'Move down', class: 'icon-arrow-down', title: 'Move down' },
|
||||
// { name: 'Move to bottom', class: 'icon-arrow-double-down', title: 'Move to bottom' }
|
||||
// ]
|
||||
// },
|
||||
//
|
||||
// {
|
||||
// control: 'separator'
|
||||
// },
|
||||
// {
|
||||
// control: 'button',
|
||||
// icon: 'icon-gear'
|
||||
// },
|
||||
//
|
||||
// {
|
||||
// control: 'separator'
|
||||
// },
|
||||
// {
|
||||
// control: 'input',
|
||||
// type: 'number',
|
||||
// label: 'X',
|
||||
// value: 1,
|
||||
// title: 'X position'
|
||||
// },
|
||||
// {
|
||||
// control: 'input',
|
||||
// type: 'number',
|
||||
// label: 'Y',
|
||||
// value: 2,
|
||||
// title: 'Y position'
|
||||
// },
|
||||
// {
|
||||
// control: 'input',
|
||||
// type: 'number',
|
||||
// label: 'W',
|
||||
// value: 3,
|
||||
// title: 'Width'
|
||||
// },
|
||||
// {
|
||||
// control: 'input',
|
||||
// type: 'number',
|
||||
// label: 'H',
|
||||
// value: 4,
|
||||
// title: 'Height'
|
||||
// },
|
||||
//
|
||||
// {
|
||||
// control: 'separator'
|
||||
// },
|
||||
// {
|
||||
// control: 'button',
|
||||
// icon: 'icon-trash',
|
||||
// label: 'delete',
|
||||
// modifier: 'caution'
|
||||
// },
|
||||
//
|
||||
// {
|
||||
// control: 'separator'
|
||||
// },
|
||||
// {
|
||||
// control: 'checkbox',
|
||||
// name: 'this is a checkbox',
|
||||
// },
|
||||
// {
|
||||
// control: 'separator'
|
||||
// },
|
||||
// {
|
||||
// control: 'toggle-button',
|
||||
// title: 'Toggle Frame',
|
||||
// property: 'hideFrame',
|
||||
// value: false,
|
||||
// options: [
|
||||
// {
|
||||
// value: true,
|
||||
// icon: 'icon-frame-hide'
|
||||
// },
|
||||
// {
|
||||
// value: false,
|
||||
// icon: 'icon-frame-show'
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// control: 'toggle-button',
|
||||
// title: 'Snap to grid',
|
||||
// property: 'snapToGrid',
|
||||
// value: true,
|
||||
// options: [
|
||||
// {
|
||||
// value: true,
|
||||
// icon: 'icon-grid-snap-to'
|
||||
// },
|
||||
// {
|
||||
// value: false,
|
||||
// icon: 'icon-grid-snap-no'
|
||||
// }
|
||||
// ]
|
||||
// },
|
||||
// {
|
||||
// control: 'toggle-button',
|
||||
// title: 'Toggle label',
|
||||
// property: 'showLabel',
|
||||
// value: true,
|
||||
// options: [
|
||||
// {
|
||||
// value: true,
|
||||
// icon: 'icon-two-parts-both'
|
||||
// },
|
||||
// {
|
||||
// value: false,
|
||||
// icon: 'icon-two-parts-one-only'
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
// ];
|
||||
// }
|
||||
// });
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
||||
@ -36,6 +36,7 @@
|
||||
v-model="formattedBounds.start"
|
||||
@change="validateAllBounds(); submitForm()" />
|
||||
<date-picker
|
||||
v-if="isFixed && isUTCBased"
|
||||
:default-date-time="formattedBounds.start"
|
||||
:formatter="timeFormatter"
|
||||
@date-selected="startDateSelected"></date-picker>
|
||||
@ -65,11 +66,11 @@
|
||||
ref="endDate"
|
||||
@change="validateAllBounds(); submitForm()">
|
||||
<date-picker
|
||||
v-if="isFixed && isUTCBased"
|
||||
class="c-ctrl-wrapper--menus-left"
|
||||
:default-date-time="formattedBounds.end"
|
||||
:formatter="timeFormatter"
|
||||
@date-selected="endDateSelected"
|
||||
v-if="isFixed"></date-picker>
|
||||
@date-selected="endDateSelected"></date-picker>
|
||||
</div>
|
||||
|
||||
<div class="c-ctrl-wrapper c-conductor-input c-conductor__end-delta"
|
||||
|
||||
@ -21,7 +21,6 @@
|
||||
*****************************************************************************/
|
||||
|
||||
import Conductor from './Conductor.vue';
|
||||
import Vue from 'vue';
|
||||
|
||||
function isTruthy(a) {
|
||||
return !!a;
|
||||
@ -29,20 +28,17 @@ function isTruthy(a) {
|
||||
|
||||
function validateMenuOption(menuOption, index) {
|
||||
if (menuOption.clock && !menuOption.clockOffsets) {
|
||||
return "clock-based menuOption at index " + index + " is " +
|
||||
"missing required property 'clockOffsets'.";
|
||||
return `Conductor menu option is missing required property 'clockOffsets'. This field is required when configuring a menu option with a clock.\r\n${JSON.stringify(menuOption)}`;
|
||||
}
|
||||
if (!menuOption.timeSystem) {
|
||||
return "menuOption at index " + index + " is missing " +
|
||||
"required property 'timeSystem'.";
|
||||
return `Conductor menu option is missing required property 'timeSystem'\r\n${JSON.stringify(menuOption)}`;
|
||||
}
|
||||
if (!menuOption.bounds && !menuOption.clock) {
|
||||
return "fixed-bounds menuOption at index " + index + " is " +
|
||||
"missing required property 'bounds'";
|
||||
return `Conductor menu option is missing required property 'bounds'. This field is required when configuring a menu option with fixed bounds.\r\n${JSON.stringify(menuOption)}`;
|
||||
}
|
||||
}
|
||||
|
||||
function validateConfiguration(config) {
|
||||
function hasRequiredOptions(config) {
|
||||
if (config === undefined ||
|
||||
config.menuOptions === undefined ||
|
||||
config.menuOptions.length === 0) {
|
||||
@ -56,7 +52,7 @@ function validateConfiguration(config) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
function validateRuntimeConfiguration(config, openmct) {
|
||||
function validateConfiguration(config, openmct) {
|
||||
var systems = openmct.time.getAllTimeSystems()
|
||||
.reduce(function (m, ts) {
|
||||
m[ts.key] = ts;
|
||||
@ -68,23 +64,19 @@ function validateRuntimeConfiguration(config, openmct) {
|
||||
return m;
|
||||
}, {});
|
||||
|
||||
return config.menuOptions.map(function (menuOption, index) {
|
||||
return config.menuOptions.map(function (menuOption) {
|
||||
if (menuOption.timeSystem && !systems[menuOption.timeSystem]) {
|
||||
return "menuOption at index " + index + " specifies a " +
|
||||
"timeSystem that does not exist: " + menuOption.timeSystem;
|
||||
return `Time system '${menuOption.timeSystem}' has not been registered: \r\n ${JSON.stringify(menuOption)}`;
|
||||
}
|
||||
if (menuOption.clock && !clocks[menuOption.clock]) {
|
||||
return "menuOption at index " + index + " specifies a " +
|
||||
"clock that does not exist: " + menuOption.clock;
|
||||
return `Clock '${menuOption.clock}' has not been registered: \r\n ${JSON.stringify(menuOption)}`;
|
||||
}
|
||||
}).filter(isTruthy).join('\n');
|
||||
}
|
||||
|
||||
function throwIfError(configResult) {
|
||||
if (configResult) {
|
||||
throw new Error("Invalid Time Conductor Configuration: \n" +
|
||||
configResult + '\n' +
|
||||
"https://github.com/nasa/openmct/blob/master/API.md#the-time-conductor");
|
||||
throw new Error(`Invalid Time Conductor Configuration. ${configResult} \r\n https://github.com/nasa/openmct/blob/master/API.md#the-time-conductor`);
|
||||
}
|
||||
}
|
||||
|
||||
@ -101,27 +93,21 @@ function mountComponent(openmct, configuration) {
|
||||
});
|
||||
}
|
||||
|
||||
export default function (config){
|
||||
|
||||
let configResult = validateConfiguration(config);
|
||||
throwIfError(configResult);
|
||||
|
||||
export default function (config) {
|
||||
return function (openmct) {
|
||||
let configResult = hasRequiredOptions(config) || validateConfiguration(config, openmct);
|
||||
throwIfError(configResult);
|
||||
|
||||
var defaults = config.menuOptions[0];
|
||||
if (defaults.clock) {
|
||||
openmct.time.clock(defaults.clock, defaults.clockOffsets);
|
||||
openmct.time.timeSystem(defaults.timeSystem, openmct.time.bounds());
|
||||
} else {
|
||||
openmct.time.timeSystem(defaults.timeSystem, defaults.bounds);
|
||||
}
|
||||
|
||||
openmct.on('start', function () {
|
||||
configResult = validateRuntimeConfiguration(config, openmct);
|
||||
throwIfError(configResult);
|
||||
|
||||
var defaults = config.menuOptions[0];
|
||||
if (defaults.clock) {
|
||||
openmct.time.clock(defaults.clock, defaults.clockOffsets);
|
||||
openmct.time.timeSystem(defaults.timeSystem, openmct.time.bounds());
|
||||
} else {
|
||||
openmct.time.timeSystem(defaults.timeSystem, defaults.bounds);
|
||||
}
|
||||
|
||||
mountComponent(openmct, config);
|
||||
|
||||
});
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user