mirror of
https://github.com/nasa/openmct.git
synced 2025-02-10 12:51:42 +00:00
9d2c7a6de5
* [Frontend] WIP New local-controls classes Fixes #2000 - h-local-controls - Markup in plots changed - Changed reset plot button's icon * [Frontend] WIP local-controls classes Fixes #2000 - Refactoring to use and apply local-control classes consistently; - Plots and imagery done in main view and Display Layout contexts; * [Frontend] WIP local-controls classes Fixes #2000 - Use local-control classes in Timelines; - Group Timeline buttons in l-btn-set; - Use reset icon glyph; * [Frontend] WIP local-controls classes Fixes #2000 - Slight increase in size to buttons in frame context; * [Frontend] local-controls classes Fixes #2000 - Code cleanup; - Update Style Guide content; - Provisionally done, needs unit testing and double-checking; * [Frontend] Better selecting in browse mode Fixes #2000 - Better colors and approach to selecting in browse mode; * [Frontend] Tweaks to pane collapse mini-tabs Fixes #1758 Fixes #2000 - Enlarged mini-tabs and moved to screen top; - Removed duplicative theme-based constants; * [Frontend] Tweaks to "nav up" arrow button Fixes #1758 Fixes #2000 - Increased hit area of .l-back "nav up" arrow in object-browse-bar; * [Frontend] Glyph improvements Fixes #1758 Fixes #2000 - New arrow glyph for view controls; - Increased hit area of view controls in tree for mobile and desktop; - Better "hamburger" menu glyph; * [Frontend] Inspector refactor to CSS grid WIP Fixes #1758 Fixes #2000 - WIP!!!; - Good progress on Properties section; * [Frontend] Inspector refactor to CSS grid WIP Fixes #2000 - Significant mods to CSS and markup; - New grid archetypes classes; - Added title attribs to plot options edit and browse props; - Added value, alarm markers to plot series browse props; - Nearly done (?) but needs unit testing and cleanups; * [Frontend] Minor tweaks to form and form-row Fixes #2000 - Fixing margin problem with .form-row; - h2 instead of div.section-header; * [Frontend] Fixed H2 in Elements pool Fixes #2000 * Refinements to Time Conductor Fixes #2000 - Tweaks size of fixed position grab ticks; - Positioning refinements to ticks and text; - Hide major tick marks; * Hide View Large button for nested hidden-frame Layouts Fixes #2000 - When a layout is nested and has its frame hidden, hide the View Large button; * Better hiding of Time Conductor "Submit" button Fixes #2000 * Re-added new icon-arrow-right-equilateral glyph; Fixes #2000 Fixes #2078 * Remove commented styles/markup Fixes #2000 Fixes #2078 * Repaired approach to hiding Time Conductor Submit button Fixes #2000 Fixes #2078 - Renamed .off to .invisible and added refinements; * Fixed wrong conflict resolutions; polish search Fixes #2000 Fixes #2078 - .invisible instead of .off in search.html; - Minor polishing to search; fixes #1758 fixes #1763 fixes #2011
224 lines
12 KiB
HTML
224 lines
12 KiB
HTML
<!--
|
|
Open MCT, Copyright (c) 2009-2016, 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.
|
|
-->
|
|
<div class="s-timeline l-timeline-holder split-layout vertical splitter-sm"
|
|
ng-click="$event.stopPropagation()"
|
|
ng-controller="TimelineController as timelineController">
|
|
|
|
<mct-split-pane anchor="left" class="abs" position="pane.x">
|
|
<!-- LEFT PANE: TABULAR AND RESOURCE LEGEND AREAS -->
|
|
<mct-split-pane anchor="bottom"
|
|
position="pane.y"
|
|
class="abs horizontal split-pane-component l-timeline-pane l-pane-l t-pane-v">
|
|
<!-- TOP PANE TABULAR AREA -->
|
|
<div class="split-pane-component s-timeline-tabular l-timeline-pane t-pane-h l-pane-top">
|
|
<!-- TABULAR LEFT FIXED AREA -->
|
|
<div class="t-pane-v l-pane-l l-tabular-l"
|
|
ng-if="true">
|
|
|
|
<div class="t-header l-header s-header">
|
|
<div class="l-cols">
|
|
<span title="Resource Graphing: click a row to toggle" class="l-col l-col-icon l-plot-resource icon-plot-resource"></span>
|
|
<span title="Activity Links" class="l-col l-col-icon l-col-link icon-chain-links"></span>
|
|
<span class="l-col l-title">Title</span>
|
|
</div>
|
|
</div>
|
|
<div class="t-swimlanes-holder l-swimlanes-holder"
|
|
mct-scroll-y="scroll.y">
|
|
<mct-include key="'timeline-tabular-swimlane-cols-tree'"
|
|
parameters="{ commit: commit }"
|
|
ng-repeat="swimlane in timelineController.swimlanes()"
|
|
ng-model="swimlane">
|
|
</mct-include>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- TABULAR RIGHT HORZ SCROLLING AREA -->
|
|
<div class="t-pane-v l-pane-r l-tabular-r">
|
|
<div class="l-width">
|
|
<div class="t-header l-header s-header">
|
|
<div class="l-cols">
|
|
<span class="l-col l-start">Start</span>
|
|
<span class="l-col l-end">End</span>
|
|
<span class="l-col l-duration">Duration</span>
|
|
<span class="l-col l-activity-modes">Activity Modes</span>
|
|
</div>
|
|
</div>
|
|
<div class="t-swimlanes-holder l-swimlanes-holder"
|
|
mct-scroll-y="scroll.y">
|
|
<mct-include key="'timeline-tabular-swimlane-cols-data'"
|
|
ng-repeat="swimlane in timelineController.swimlanes()"
|
|
ng-model="swimlane">
|
|
</mct-include>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- HORZ SPLITTER -->
|
|
<mct-splitter></mct-splitter>
|
|
|
|
<!-- BOTTOM PANE RESOURCE LEGEND -->
|
|
<div mct-resource-graph-drop
|
|
class="split-pane-component abs l-timeline-pane t-pane-h l-pane-btm s-timeline-resource-legend l-timeline-resource-legend">
|
|
<div class="l-title s-title">{{ngModel.title}}Resource Graph Legend</div>
|
|
<div class="l-legend-items legend">
|
|
<mct-include key="'timeline-legend-item'"
|
|
ng-repeat="swimlane in timelineController.swimlanes()"
|
|
ng-model="swimlane"
|
|
ng-show="swimlane.graph()">
|
|
</mct-include>
|
|
</div>
|
|
</div>
|
|
</mct-split-pane>
|
|
|
|
|
|
<!-- MAIN VERTICAL SPLITTER -->
|
|
<mct-splitter></mct-splitter>
|
|
|
|
|
|
<!-- RIGHT PANE: GANTT AND RESOURCE PLOTS -->
|
|
<span ng-controller="TimelineZoomController as zoomController" class="abs">
|
|
|
|
<span class="toi-control-holder temp" ng-controller="TimelineTOIController as toiController">
|
|
<mct-split-pane anchor="bottom"
|
|
position="pane.y"
|
|
class="abs split-pane-component l-timeline-pane l-pane-r t-pane-v">
|
|
|
|
<!-- TOP PANE GANTT BARS -->
|
|
<div class="split-pane-component l-timeline-pane t-pane-h l-pane-top t-timeline-gantt l-timeline-gantt s-timeline-gantt">
|
|
<div class="h-local-controls l-hover-btns-holder s-hover-btns-holder">
|
|
<a class="s-button icon-timer"
|
|
ng-click="scroll.follow = true"
|
|
ng-show="!toiController.isFollowing() && toiController.isActive()"
|
|
title="Follow time bounds">
|
|
</a>
|
|
|
|
<div class="l-btn-set">
|
|
<a class="s-button icon-reset"
|
|
ng-click="scroll.follow = false; zoomController.fit()"
|
|
ng-show="true"
|
|
title="Zoom to fit">
|
|
</a>
|
|
|
|
<a class="s-button icon-magnify-in"
|
|
ng-click="scroll.follow = false; zoomController.zoom(-1)"
|
|
ng-show="true"
|
|
title="Zoom in">
|
|
</a>
|
|
|
|
<a class="s-button icon-magnify-out"
|
|
ng-click="scroll.follow = false; zoomController.zoom(1)"
|
|
ng-show="true"
|
|
title="Zoom out">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="overflow: hidden; position: absolute; left: 0; top: 0; right: 0; height: 30px;" mct-scroll-x="scroll.x">
|
|
<mct-include key="'timeline-ticks'"
|
|
parameters="{
|
|
fullWidth: zoomController.width(timelineController.end()),
|
|
start: scroll.x,
|
|
width: scroll.width,
|
|
step: zoomController.toPixels(zoomController.zoom()),
|
|
toMillis: zoomController.toMillis
|
|
}">
|
|
</mct-include>
|
|
</div>
|
|
<div ng-if="toiController.isActive()" class="l-follow-line s-follow-line"
|
|
ng-style="{ left: toiController.x() - scroll.x + 'px' }"></div>
|
|
|
|
<div class="t-swimlanes-holder l-swimlanes-holder"
|
|
mct-scroll-x="scroll.x"
|
|
mct-scroll-y="scroll.y">
|
|
<div class="l-width-control"
|
|
ng-style="{ width: zoomController.width(timelineController.end()) + 'px' }">
|
|
<div class="t-swimlane s-swimlane l-swimlane"
|
|
ng-repeat="swimlane in timelineController.swimlanes()"
|
|
ng-class="{
|
|
exceeded: swimlane.exceeded(),
|
|
selected: selection.selected(swimlane),
|
|
'drop-into': swimlane.highlight(),
|
|
'drop-after': swimlane.highlightBottom()
|
|
}"
|
|
ng-click="selection.select(swimlane)"
|
|
mct-swimlane-drop="swimlane">
|
|
|
|
<mct-representation key="'gantt'"
|
|
mct-object="swimlane.domainObject"
|
|
parameters="{
|
|
scroll: scroll,
|
|
toPixels: zoomController.toPixels
|
|
}">
|
|
</mct-representation>
|
|
|
|
<span ng-if="selection.selected(swimlane)">
|
|
<span ng-repeat="handle in timelineController.handles()"
|
|
ng-style="handle.style(zoomController)"
|
|
style="position: absolute; top: 0px; bottom: 0px;"
|
|
class="handle"
|
|
ng-class="{ start: $index === 0, mid: $index === 1, end: $index > 1 }"
|
|
mct-drag-down="handle.begin()"
|
|
mct-drag="handle.drag(delta[0], zoomController); timelineController.refresh()"
|
|
mct-drag-up="handle.finish()">
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- HORZ SPLITTER -->
|
|
<mct-splitter></mct-splitter>
|
|
|
|
<!-- BOTTOM PANE RESOURCE GRAPHS AND RIGHT PANE HORIZONTAL SCROLL CONTROL -->
|
|
<div class="split-pane-component l-timeline-resource-graph l-timeline-pane t-pane-h l-pane-btm">
|
|
<div class="l-graphs-holder"
|
|
mct-resize="scroll.width = bounds.width">
|
|
<div class="t-graphs l-graphs">
|
|
<mct-include key="'timeline-resource-graphs'"
|
|
parameters="{
|
|
origin: zoomController.toMillis(scroll.x),
|
|
duration: zoomController.toMillis(scroll.width),
|
|
graphs: timelineController.graphs()
|
|
}">
|
|
</mct-include>
|
|
</div>
|
|
<div ng-if="toiController.isActive()" class="l-follow-line s-follow-line"
|
|
ng-style="{ left: toiController.x() - scroll.x + 'px' }"></div>
|
|
</div>
|
|
<div mct-scroll-x="scroll.x"
|
|
class="t-pane-r-scroll-h-control l-scroll-control s-scroll-control">
|
|
<div class="l-width-control"
|
|
ng-style="{ width: zoomController.width(timelineController.end()) + 'px' }">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</mct-split-pane>
|
|
</span>
|
|
|
|
|
|
</span>
|
|
</mct-split-pane>
|
|
</div>
|