Compare commits
	
		
			2 Commits
		
	
	
		
			release/2.
			...
			conductor-
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 
						 | 
					f6e6d96f71 | ||
| 
						 | 
					d34dda62c0 | 
							
								
								
									
										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'
 | 
			
		||||
@@ -68,8 +70,8 @@
 | 
			
		||||
                    timeSystem: 'utc',
 | 
			
		||||
                    clock: 'local',
 | 
			
		||||
                    clockOffsets: {
 | 
			
		||||
                        start: -25 * 60 * 1000,
 | 
			
		||||
                        end: 5 * 60 * 1000
 | 
			
		||||
                        start: - THIRTY_MINUTES,
 | 
			
		||||
                        end: FIVE_MINUTES
 | 
			
		||||
                    }
 | 
			
		||||
                }
 | 
			
		||||
            ]
 | 
			
		||||
@@ -80,206 +82,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>
 | 
			
		||||
 
 | 
			
		||||
@@ -37,6 +37,7 @@
 | 
			
		||||
                       v-model="formattedBounds.start"
 | 
			
		||||
                       @change="validateBounds('start', $event.target); setBoundsFromView()" />
 | 
			
		||||
                <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="validateBounds('end', $event.target); setBoundsFromView()">
 | 
			
		||||
                <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);
 | 
			
		||||
 | 
			
		||||
        });
 | 
			
		||||
    };
 | 
			
		||||
};
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user