-
Notifications
You must be signed in to change notification settings - Fork 1.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[Time Conductor] #933 Initial markup
- Loading branch information
Showing
12 changed files
with
779 additions
and
4 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,82 @@ | ||
| /***************************************************************************** | ||
| * Open MCT Web, Copyright (c) 2014-2015, United States Government | ||
| * as represented by the Administrator of the National Aeronautics and Space | ||
| * Administration. All rights reserved. | ||
| * | ||
| * Open MCT Web 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 Web 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. | ||
| *****************************************************************************/ | ||
|
|
||
| define([ | ||
| "./src/TimeConductor", | ||
| "./src/TimeConductorController", | ||
| "./src/MCTConductorAxis", | ||
| "text!./res/templates/time-conductor.html", | ||
| "text!./res/templates/mode-selector/mode-selector.html", | ||
| "text!./res/templates/mode-selector/mode-menu.html", | ||
| 'legacyRegistry' | ||
| ], function ( | ||
| TimeConductor, | ||
| TimeConductorController, | ||
| MCTConductorAxis, | ||
| timeConductorTemplate, | ||
| modeSelectorTemplate, | ||
| modeMenuTemplate, | ||
| legacyRegistry | ||
| ) { | ||
|
|
||
| legacyRegistry.register("platform/features/conductor-v2", { | ||
| "extensions": { | ||
| "services": [ | ||
| { | ||
| "key": "timeConductor", | ||
| "implementation": TimeConductor | ||
| } | ||
| ], | ||
| "controllers": [ | ||
| { | ||
| "key": "TimeConductorController", | ||
| "implementation": TimeConductorController, | ||
| "depends": [ | ||
| "$scope", | ||
| "timeConductor" | ||
| ] | ||
| } | ||
| ], | ||
| "directives": [ | ||
| { | ||
| "key": "mctConductorAxis", | ||
| "implementation": MCTConductorAxis, | ||
| "depends": ["$timeout"] | ||
| } | ||
| ], | ||
| "representations": [ | ||
| { | ||
| "key": "time-conductor", | ||
| "template": timeConductorTemplate | ||
| }, | ||
| { | ||
| "key": "mode-selector", | ||
| "template": modeSelectorTemplate | ||
| }, | ||
| { | ||
| "key": "mode-menu", | ||
| "template": modeMenuTemplate | ||
| } | ||
| ] | ||
| } | ||
| }); | ||
| }); |
80 changes: 80 additions & 0 deletions
80
platform/features/conductor-v2/res/templates/mode-selector/mode-menu.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,80 @@ | ||
| <!-- | ||
| Open MCT Web, Copyright (c) 2014-2015, United States Government | ||
| as represented by the Administrator of the National Aeronautics and Space | ||
| Administration. All rights reserved. | ||
| Open MCT Web 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 Web 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. | ||
| --> | ||
| <div class="contents"> | ||
| <div class="pane left menu-items"> | ||
| <ul> | ||
| <li ng-click="representation.mode='fixed'"> | ||
| <a | ||
| ng-mouseover="representation.activeMetadata = { | ||
| glyph: '\ue604', | ||
| name: 'Fixed Time-Span', | ||
| description: 'Display data that falls between two fixed dates' | ||
| }" | ||
| ng-mouseleave="representation.activeMetadata = undefined"> | ||
| <span class="ui-symbol icon type-icon"> | ||
|  | ||
| </span> | ||
| Fixed Time-span | ||
| </a> | ||
| </li> | ||
| <li ng-click="representation.mode='realtime'"> | ||
| <a | ||
| ng-mouseover="representation.activeMetadata = { | ||
| glyph: '\u0043', | ||
| name: 'Real-time Mode', | ||
| description: 'Monitor real-time streaming data as it comes in to the application. The Time Conductor will automatically advance itself based on a UTC clock.' | ||
| }" | ||
| ng-mouseleave="representation.activeMetadata = undefined"> | ||
| <span class="ui-symbol icon type-icon"> | ||
| C | ||
| </span> | ||
| Real-time | ||
| </a> | ||
| </li> | ||
| <li ng-click="representation.mode='latest'"> | ||
| <a | ||
| ng-mouseover="representation.activeMetadata = { | ||
| glyph: '\u0044', | ||
| name: 'Latest Available Data', | ||
| description: 'Monitor real-time streaming data as it comes in to the application. In contrast to real-time mode the time conductor will only advance when data becomes available.' | ||
| }" | ||
| ng-mouseleave="representation.activeMetadata = undefined"> | ||
| <span class="ui-symbol icon type-icon"> | ||
| D | ||
| </span> | ||
| Latest Available Data | ||
| </a> | ||
| </li> | ||
| </ul> | ||
| </div> | ||
| <div class="pane right menu-item-description"> | ||
| <div class="desc-area ui-symbol icon type-icon"> | ||
| {{representation.activeMetadata.glyph}} | ||
| </div> | ||
| <div class="desc-area title"> | ||
| {{representation.activeMetadata.name}} | ||
| </div> | ||
| <div class="desc-area description"> | ||
| {{representation.activeMetadata.description}} | ||
| </div> | ||
| </div> | ||
| </div> |
50 changes: 50 additions & 0 deletions
50
platform/features/conductor-v2/res/templates/mode-selector/mode-selector.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,50 @@ | ||
| <!-- | ||
| Open MCT Web, Copyright (c) 2014-2015, United States Government | ||
| as represented by the Administrator of the National Aeronautics and Space | ||
| Administration. All rights reserved. | ||
| Open MCT Web 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 Web 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. | ||
| --> | ||
| <style> | ||
| .super-menu.mode-selector-menu { | ||
| width: 400px; | ||
| } | ||
| .super-menu.mode-selector-menu { | ||
| height: 200px; | ||
| bottom: 0px; | ||
| } | ||
| .super-menu.mode-selector-menu .menu-item-description .desc-area.icon { | ||
| height: 20%; | ||
| font-size: 3em; | ||
| line-height: normal; | ||
| } | ||
| .super-menu .mode-selector-menu .menu-item-description .desc-area.description { | ||
| height: 60%; | ||
| } | ||
| </style> | ||
| <span ng-controller="ClickAwayController as modeController"> | ||
| <div class="s-menu-btn" | ||
| ng-click="modeController.toggle()"> | ||
| <span class="title-label">Fixed Time Span</span> | ||
| </div> | ||
| <div class="menu super-menu mode-selector-menu" | ||
| ng-show="modeController.isActive()"> | ||
| <mct-representation mct-object="domainObject" | ||
| key="'mode-menu'"> | ||
| </mct-representation> | ||
| </div> | ||
| </span> |
94 changes: 94 additions & 0 deletions
94
platform/features/conductor-v2/res/templates/time-conductor.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,94 @@ | ||
| <style> | ||
| .time-system .menu{ | ||
| bottom: 10px; | ||
| } | ||
| .l-data-availability { | ||
| width: 100%; | ||
| height: 20px; | ||
| background-color: #3b3b3b | ||
| } | ||
|
|
||
| .l-time-range-inputs-elem { | ||
| width: 100%; | ||
| } | ||
|
|
||
| .l-time-range-inputs-elem.l-flex-row { | ||
| justify-content: space-between; | ||
| } | ||
| .l-axis-holder { | ||
| height: 30px; | ||
| width: 100%; | ||
| } | ||
|
|
||
| .l-axis-holder svg, .l-axis-holder svg path, | ||
| .l-axis-holder svg line { | ||
| stroke: #A0A0A0; | ||
| } | ||
|
|
||
| .l-axis-holder svg>g | ||
|
|
||
| </style> | ||
| <!-- Parent holder for time conductor. follow-mode | fixed-mode --> | ||
| <div class="follow-mode" | ||
| ng-controller="TimeConductorController as tcController" class="l-flex-col"> | ||
| <!-- Holds date selectors and ticks --> | ||
| <div class="l-conductor-dates"> | ||
| <form class="l-time-range-inputs-holder l-flex-row flex-elem" | ||
| ng-submit="tcController.updateBoundsFromForm(formModel)"> | ||
| <span class="l-time-range-inputs-elem t-inputs-w l-flex-row flex-elem"> | ||
| <span class="l-time-range-input-w flex-elem start-date"> | ||
| <mct-control key="'datetime-field'" | ||
| structure="{ | ||
| format: 'utc', | ||
| validate: tcController.validateStart | ||
| }" | ||
| ng-model="formModel" | ||
| ng-blur="tcController.updateBoundsFromForm()" | ||
| field="'start'" | ||
| class="time-range-start"> | ||
| </mct-control> | ||
| </span> | ||
| <span class="l-time-range-input-w flex-elem end-date" | ||
| ng-controller="ToggleController as t2"> | ||
| <mct-control key="'datetime-field'" | ||
| structure="{ | ||
| format: 'utc', | ||
| validate: tcController.validateEnd | ||
| }" | ||
| ng-model="formModel" | ||
| ng-blur="trCtrl.updateBoundsFromForm()" | ||
| field="'end'" | ||
| class="time-range-end"> | ||
| </mct-control> | ||
| </span> | ||
| </span> | ||
| <input type="submit" class="hidden"> | ||
| </form> | ||
|
|
||
| </div> | ||
| <div class="l-conductor-ticks"> | ||
| <mct-conductor-axis></mct-conductor-axis> | ||
| </div> | ||
| <!-- Holds data availability, time of interest --> | ||
| <div class="l-data-availability"></div> | ||
| <!-- Holds time system and session selectors, and zoom control --> | ||
| <div class="l-time-system-zoom"> | ||
| <mct-representation | ||
| key="'mode-selector'" | ||
| mct-object="domainObject" | ||
| class="holder flex-elem"> | ||
| </mct-representation> | ||
| <mct-control | ||
| key="'menu-button'" | ||
| class="time-system" | ||
| ng-model="conductorModel.timeSystem" | ||
| structure="{ | ||
| text: 'utc', | ||
| options: [ | ||
| {name: 'utc', key:'utc', glyph:'\u0043'}, | ||
| {name: 'scet', key:'scet', glyph:'\u0043'}, | ||
| {name: 'sclk', key:'sclk', glyph:'\u0043'} | ||
| ]}"> | ||
| </mct-control> | ||
| </div> | ||
| </div> |
Oops, something went wrong.