alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'github/master' into open233b

Browse Source 
Resolve conflicts on nasa/openmctweb#233

Conflicts:
	platform/commonUI/general/bundle.json
	platform/commonUI/general/res/fonts/symbols/icomoon.io-WTD-symbols-project.json
	platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot
	platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg
	platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf
	platform/commonUI/general/res/fonts/symbols/wtdsymbols.woff
	platform/commonUI/general/res/sass/_main.scss
	platform/commonUI/general/res/sass/user-environ/_layout.scss
	platform/commonUI/themes/espresso/res/css/theme-espresso.css
	platform/commonUI/themes/espresso/res/sass/_constants.scss
	platform/commonUI/themes/snow/res/css/theme-snow.css
This commit is contained in:
Victor Woeltjen
2015-11-04 09:28:19 -08:00
parent 2c7c7b90e6 9523c918fb
commit f7839b758d
92 changed files with 5745 additions and 1528 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
platform/commonUI/general/bundle.json
View File

@@ -44,6 +44,14 @@
"key": "indicator",
"templateUrl": "templates/indicator.html"
},
{
"key": "message-banner",
"templateUrl": "templates/message-banner.html"
},
{
"key": "progress-bar",
"templateUrl": "templates/progress-bar.html"
},
{
"key": "time-controller",
"templateUrl": "templates/controls/time-controller.html"
@@ -53,13 +61,18 @@
{
"key": "TimeRangeController",
"implementation": "controllers/TimeRangeController.js",
"depends": [ "$scope", "now" ]
"depends": [ "$scope", "formatService", "DEFAULT_TIME_FORMAT", "now" ]
},
{
"key": "DateTimePickerController",
"implementation": "controllers/DateTimePickerController.js",
"depends": [ "$scope", "now" ]
},
{
"key": "DateTimeFieldController",
"implementation": "controllers/DateTimeFieldController.js",
"depends": [ "$scope", "formatService", "DEFAULT_TIME_FORMAT" ]
},
{
"key": "TreeNodeController",
"implementation": "controllers/TreeNodeController.js",
@@ -112,6 +125,11 @@
"key": "ObjectInspectorController",
"implementation": "controllers/ObjectInspectorController.js",
"depends": [ "$scope", "objectService" ]
},
{
"key": "BannerController",
"implementation": "controllers/BannerController.js",
"depends": ["$scope", "notificationService", "dialogService"]
}
],
"directives": [
@@ -251,6 +269,10 @@
{
"key": "datetime-picker",
"templateUrl": "templates/controls/datetime-picker.html"
},
{
"key": "datetime-field",
"templateUrl": "templates/controls/datetime-field.html"
}
],
"licenses": [

4
platform/commonUI/general/res/sass/_constants.scss
View File

@@ -51,8 +51,8 @@ $ueEditLeftPaneW: 75%;
$treeSearchInputBarH: 25px;
$ueTimeControlH: (33px, 20px, 20px);
// Overlay
$ovrTopBarH: 60px;
$ovrFooterH: 30px;
$ovrTopBarH: 45px;
$ovrFooterH: 24px;
$overlayMargin: 25px;
// Items
$ueBrowseGridItemLg: 200px;

3
platform/commonUI/general/res/sass/_main.scss
View File

@@ -29,7 +29,6 @@
@import "helpers/bubbles";
@import "helpers/splitter";
@import "helpers/wait-spinner";
@import "messages";
@import "inspector";
/********************************* CONTROLS */
@@ -39,6 +38,7 @@
@import "controls/controls";
@import "controls/lists";
@import "controls/menus";
@import "controls/messages";
@import "controls/time-controller";
@import "mobile/controls/menus";
@@ -62,7 +62,6 @@
@import "mobile/tree";
@import "user-environ/frame";
@import "user-environ/top-bar";
@import "user-environ/bottom-bar";
@import "user-environ/tool-bar";
/********************************* VIEWS */

12
platform/commonUI/general/res/sass/_messages.scss
View File

@@ -1,12 +0,0 @@
/* Styles for messages */
.message {
&.block {
@include border-radius($basicCr);
padding: $interiorMarginLg;
}
&.error {
background-color: rgba($colorAlert,0.3);
color: lighten($colorAlert, 20%);
}
}

21
platform/commonUI/general/res/sass/_mixins.scss
View File

@@ -99,7 +99,6 @@
}
@mixin triangle($dir: "left", $size: 5px, $ratio: 1, $color: red) {
//$size: $size*2;
width: 0;
height: 0;
$slopedB: $size/$ratio solid transparent;
@@ -134,6 +133,24 @@
background-size: $d $d;
}
@mixin bgVertStripes($c: yellow, $a: 0.1, $d: 40px) {
@include background-image(linear-gradient(-90deg,
rgba($c, $a) 0%, rgba($c, $a) 50%,
transparent 50%, transparent 100%
));
background-repeat: repeat;
background-size: $d $d;
}
@mixin bgVertFuzzyStripes($c: yellow, $a: 0.1, $d: 40px) {
@include background-image(linear-gradient(-90deg,
rgba($c, $a) 0%, transparent 50%,
transparent 50%, rgba($c, $a) 100%
));
background-repeat: repeat;
background-size: $d $d;
}
@mixin bgTicks($c: $colorBodyFg, $repeatDir: 'x') {
$deg: 90deg;
@if ($repeatDir != 'x') {
@@ -409,4 +426,4 @@
@mixin s-stale($a: 0.5) {
color: rgba($colorTelemFresh, $a) !important;
font-style: italic;
}
}

110
platform/commonUI/general/res/sass/controls/_controls.scss
View File

@@ -19,34 +19,6 @@
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*.control {
// UNUSED?
&.view-control {
.icon {
display: inline-block;
margin: -1px 5px 1px 2px;
vertical-align: middle;
&.triangle-down {
margin: 2px 2px -2px 0px;
}
}
.label {
display: inline-block;
font-size: 11px;
vertical-align: middle;
}
.toggle {
@include border-radius(3px);
display: inline-block;
padding: 1px 6px 4px 4px;
&:hover {
background: rgba(white, 0.1);
}
}
}
}*/
.accordion {
$accordionHeadH: 18px;
@@ -291,6 +263,88 @@ label.checkbox.custom {
}
}
/******************************************************** PROGRESS BAR */
@include keyframes(progress) {
100% { background-position: $progressBarStripeW center; }
}
@mixin bgProgressAnim($c: yellow, $a: 0.1, $d: 20px) {
@include background-image(linear-gradient(-90deg,
rgba($c, $a) 0%, transparent 50%,
transparent 50%, rgba($c, $a) 100%
));
background-position: 0 center;
background-repeat: repeat-x;
background-size: $d 40%;
}
.l-progress-bar {
// Assume will be determinate by default
display: inline-block;
overflow: hidden;
position: relative;
.progress-amt-holder {
@include absPosDefault(1px);
}
.progress-amt,
.progress-amt:before,
.progress-amt:after {
@include absPosDefault();
display: block;
content: '';
}
.progress-amt {
right: auto; // Allow inline width to control }
}
&.indeterminate {
.progress-amt {
width: 100% !important;
}
}
}
.s-progress-bar {
@include border-radius($basicCr);
@include boxIncised(0.3, 4px);
background: $colorProgressBarOuter;
//border:1px solid $colorProgressBarOuter;
.progress-amt {
@include border-radius($basicCr);
@include boxShdw();
@include border-radius($basicCr - 1);
@include trans-prop-nice(width);
&:before {
background-color: $colorProgressBarAmt;
}
&:after {
// Sheen
@include background-image(linear-gradient(
transparent 5%, rgba(#fff,0.25) 30%, transparent 100%
));
}
}
&:not(.indeterminate) {
.progress-amt:before {
// More subtle anim for determinate progress
@include animation(progress .4s linear infinite);
@include bgProgressAnim(#fff, 0.1, $progressBarStripeW);
}
}
&.indeterminate .progress-amt {
&:before {
// More visible std diag stripe anim for indeterminate progress
@include animation(progress .6s linear infinite);
@include bgDiagonalStripes(#fff, 0.2, $progressBarStripeW);
}
&:after { display: none; }
}
}
/******************************************************** SLIDERS */
.slider {

306
platform/commonUI/general/res/sass/controls/_messages.scss Normal file
View File

@@ -0,0 +1,306 @@
/*****************************************************************************
* 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.
*****************************************************************************/
@mixin statusBannerColors($bg, $fg: $colorStatusFg) {
$bgPb: 30%;
$bgPbD: 10%;
background-color: darken($bg, $bgPb);
color: $fg;
&:hover {
background-color: darken($bg, $bgPb - $bgPbD);
}
.s-action {
background-color: darken($bg, $bgPb + $bgPbD);
&:hover {
background-color: darken($bg, $bgPb);
}
}
}
.status.block {
color: $colorStatusDefault;
cursor: default;
display: inline-block;
margin-right: $interiorMargin;
.status-indicator,
.label,
.count {
//@include test(#00ff00);
display: inline-block;
vertical-align: top;
}
.status-indicator {
margin-right: $interiorMarginSm;
}
&.ok .status-indicator,
&.info .status-indicator {
color: $colorStatusInfo;
}
&.alert .status-indicator,
&.warning .status-indicator,
&.caution .status-indicator {
color: $colorStatusAlert;
}
&.error .status-indicator {
color: $colorStatusError;
}
.label {
// Max-width silliness is necessary for width transition
@include trans-prop-nice(max-width, .25s);
overflow: hidden;
max-width: 0px;
}
.count {
@include trans-prop-nice(opacity, .25s);
font-weight: bold;
opacity: 1;
}
&:hover {
.label {
max-width: 450px;
width: auto;
}
.count {
opacity: 0;
}
}
}
/* Styles for messages and message banners */
.message {
&.block {
@include border-radius($basicCr);
padding: $interiorMarginLg;
}
&.error {
background-color: rgba($colorAlert,0.3);
color: lighten($colorAlert, 20%);
}
}
.l-message-banner {
$m: $interiorMarginSm;
$lh: $ueFooterH - ($m*2) - 1;
@include box-sizing(border-box);
@include ellipsize();
@include display-flex;
@include flex-direction(row);
@include align-items(center);
position: absolute;
top: $m; right: auto; bottom: $m; left: 50%;
height: auto; width: auto;
line-height: $lh;
max-width: 300px;
padding: 0 $interiorMargin 0 $interiorMargin;
@include transform(translateX(-50%));
&.minimized {
@include transition-property(left, opacity);
@include transition-duration(0.3s);
@include transition-timing-function(ease-in-out);
left: 0;
opacity: 0;
}
&.new {
left: 50%;
opacity: 1;
&:not(.info) {
@include pulse(100ms, 10);
}
}
.banner-elem {
@include flex(0 1 auto);
margin-left: $interiorMargin;
}
a {
display: inline-block;
}
.l-action {
line-height: $lh - 3;
padding: 0 $interiorMargin;
}
.close {
//@include test(red, 0.7);
cursor: pointer;
font-size: 7px;
width: 8px;
}
.l-progress-bar {
$h: $lh - 10;
height: $h;
line-height: $h;
width: 100px;
}
.progress-info { display: none; }
z-index: 10;
}
.s-message-banner {
//@include transition-property(left, opacity);
//@include transition-duration(0.35s);
//@include transition-timing-function(ease-in-out);
}
.s-message-banner {
@include border-radius($controlCr);
@include statusBannerColors($colorStatusDefault, $colorStatusFg);
cursor: pointer;
a { color: inherit; }
.s-action {
@include border-radius($basicCr);
@include trans-prop-nice(background-color);
}
.close {
opacity: 0.5;
&:hover {
opacity: 1;
}
}
&.ok,
&.info {
@include statusBannerColors($colorStatusInfo);
}
&.caution,
&.warning,
&.alert {
@include statusBannerColors($colorStatusAlert);
}
&.error {
@include statusBannerColors($colorStatusError);
}
}
@mixin messageBlock($iconW: 32px) {
.type-icon.message-type {
@include txtShdw($shdwStatusIc);
&:before { content:"\e608"; }
color: $colorStatusDefault;
font-size: $iconW;
padding: 1px;
width: $iconW + 2;
}
.message-severity-info .type-icon.message-type {
&:before { content:"\e608"; }
color: $colorStatusInfo;
}
.message-severity-alert .type-icon.message-type {
&:before { content:"\e610"; }
color: $colorStatusAlert;
}
.message-severity-error .type-icon.message-type {
&:before { content:"\21"; }
color: $colorStatusError;
}
}
/* Paths:
t-dialog | t-dialog-sm > t-message-single | t-message-list > overlay > holder > contents > l-message >
message-type > (icon)
message-contents >
top-bar >
title
hint
editor >
(if displaying list of messages)
ul > li > l-message >
... same as above
bottom-bar
*/
.l-message {
@include display-flex;
@include flex-direction(row);
@include align-items(stretch);
.type-icon.message-type {
//@include test(red);
@include flex(0 1 auto);
position: relative;
}
.message-contents {
//@include test(blue);
@include flex(1 1 auto);
margin-left: $overlayMargin;
position: relative;
.top-bar,
.message-body {
margin-bottom: $interiorMarginLg * 2;
}
}
}
// Message as singleton
.t-message-single {
@include messageBlock(80px);
@include desktop {
.l-message,
.bottom-bar {
@include absPosDefault();
}
.bottom-bar {
top: auto;
height: $ovrFooterH;
}
}
}
// Messages in list
.t-message-list {
@include messageBlock(32px);
.message-contents {
.l-message {
//border-bottom: 1px solid pullForward($colorOvrBg, 20%);
@include border-radius($controlCr);
background: rgba($colorOvrFg, 0.1);
margin-bottom: $interiorMargin;
padding: $interiorMarginLg;
.message-contents,
.bottom-bar {
//@include test(green);
position: relative;
}
.message-contents {
font-size: 0.9em;
margin-left: $interiorMarginLg;
.message-action { color: pushBack($colorOvrFg, 20%); }
.bottom-bar { text-align: left; }
}
.top-bar,
.message-body {
margin-bottom: $interiorMarginLg;
}
}
}
@include desktop {
.message-contents .l-message { margin-right: $interiorMarginLg; }
}
}

2
platform/commonUI/general/res/sass/mobile/_constants.scss
View File

@@ -23,7 +23,7 @@
/************************** MOBILE REPRESENTATION ITEMS DIMENSIONS */
$mobileListIconSize: 30px;
$mobileTitleDescH: 35px;
$mobileOverlayMargin: 10px;
$mobileOverlayMargin: 20px;
$phoneItemH: floor($ueBrowseGridItemLg/4);
$tabletItemH: floor($ueBrowseGridItemLg/3);

83
platform/commonUI/general/res/sass/mobile/overlay/_overlay.scss
View File

@@ -1,16 +1,12 @@
@include phoneandtablet {
.overlay {
$m: 0;
.clk-icon.close {
top: $mobileOverlayMargin; right: $mobileOverlayMargin;
}
> .holder {
@include border-radius($m);
top: $m;
right: $m;
bottom: $m;
left: $m;
height: 90%; width: 90%;
> .contents {
top: $mobileOverlayMargin;
right: $mobileOverlayMargin;
@@ -22,35 +18,64 @@
margin-right: 1.2em;
}
}
.form.editor {
border: none;
.contents {
top: 0;
right: 0;
bottom: 0;
left: 0;
}
}
}
}
}
}
@include phone {
.overlay > .holder > .contents .form.editor .contents .form-row {
> .label,
> .controls {
//@include test(blue);
display: block;
float: none;
width: 100%;
.overlay > .holder {
//@include test(orange); // This works!
$m: 0;
@include border-radius($m);
top: $m;
right: $m;
bottom: $m;
left: $m;
height: auto; width: auto;
min-width: 200px; min-height: 200px;
max-height: 100%; max-width: 100%;
overflow: auto;
@include transform(none);
.editor .form .form-row {
> .label,
> .controls {
//@include test(blue);
display: block;
float: none;
width: 100%;
}
> .label {
&:after {
float: none;
}
}
}
.contents {
.abs.top-bar,
.abs.editor,
.abs.message-body,
.abs.bottom-bar {
//@include test(orange);
top: auto; right: auto; bottom: auto; left: auto;
height: auto; width: auto;
margin-bottom: $interiorMarginLg * 2;
position: relative;
}
}
}
.t-dialog-sm .overlay > .holder {
//@include test(blue);
height: auto; max-height: 100%;
}
}
@include phonePortrait {
.overlay > .holder {
.contents .bottom-bar {
text-align: center;
}
> .label {
&:after {
float: none;
}
}
}
}

171
platform/commonUI/general/res/sass/overlay/_overlay.scss
View File

@@ -20,79 +20,124 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
.overlay {
.blocker {
background: $colorOvrBlocker;
z-index: 100;
}
font-size: 90%;
.blocker {
background: $colorOvrBlocker;
z-index: 100;
}
.clk-icon.close {
font-size: 0.8rem;
position: absolute;
top: $interiorMarginLg; right: $interiorMarginLg; bottom: auto; left: auto;
z-index: 100;
top: $interiorMarginLg;
right: $interiorMarginLg;
bottom: auto;
left: auto;
z-index: 100;
}
>.holder {
$i: 15%;
@include containerSubtle($colorOvrBg, $colorOvrFg);
@include border-radius($basicCr * 3);
color: $colorOvrFg;
top: $i; right: $i; bottom: $i; left: $i;
z-index: 101;
>.contents {
> .holder {
//$i: 15%;
@include containerSubtle($colorOvrBg, $colorOvrFg);
@include border-radius($basicCr * 3);
color: $colorOvrFg;
top: 50%;
right: auto;
bottom: auto;
left: 50%;
@include transform(translateX(-50%) translateY(-50%));
height: 70%;
width: 50%;
min-height: 300px;
max-height: 800px;
min-width: 600px;
max-width: 1000px;
z-index: 101;
> .contents {
$m: $overlayMargin;
top: $m; right: $m; bottom: $m; left: $m;
top: $m;
right: $m;
bottom: $m;
left: $m;
//.top-bar,
//.editor,
//.bottom-bar {
// @include absPosDefault();
//}
}
}
.title {
@include ellipsize();
font-size: 1.2em;
margin-bottom: $interiorMargin;
}
.top-bar {
.title {
@include ellipsize();
font-size: 1.2em;
line-height: 120%;
margin-bottom: $interiorMargin;
}
.hint {
color: pushBack($colorOvrFg, 20%);
}
.abs.top-bar {
height: $ovrTopBarH;
}
.editor {
top: $ovrTopBarH + ($interiorMargin * 2);
bottom: $ovrFooterH + $interiorMargin * 2;
left: 0; right: 0;
}
.bottom-bar {
top: auto; right: 0; bottom: 0; left: 0;
overflow: visible;
//font-size: 1em;
height: $ovrFooterH;
text-align: right;
.s-btn {
$bg: $colorOvrBtnBg;
&:not(.major) {
@include btnSubtle($bg, pullForward($bg, 10%), $colorOvrBtnFg, $colorOvrBtnFg);
}
font-size: 95%;
height: $ovrFooterH;
line-height: $ovrFooterH;
margin-left: $interiorMargin;
padding: 0 $interiorMargin * 3;
//&.major {
// @extend .s-btn.major;
// &:hover {
// @extend .s-btn.major:hover;
// }
//}
.abs.editor,
.abs.message-body {
top: $ovrTopBarH + $interiorMarginLg;
bottom: $ovrFooterH + $interiorMarginLg;
left: 0;
right: 0;
overflow: auto;
.field.l-med {
input[type='text'] {
width: 100%;
}
}
}
.contents.l-dialog {
$myM: $interiorMargin;
top: $myM;
right: $myM;
bottom: $myM;
left: $myM;
overflow: auto;
.field.l-med {
input[type='text'] {
width: 100%;
}
}
.bottom-bar {
text-align: right;
.s-btn {
$bg: $colorOvrBtnBg;
&:not(.major) {
@include btnSubtle($bg, pullForward($bg, 10%), $colorOvrBtnFg, $colorOvrBtnFg);
}
font-size: 95%;
height: $ovrFooterH;
line-height: $ovrFooterH;
margin-left: $interiorMargin;
padding: 0 $interiorMargin * 3;
&:first-child {
margin-left: 0;
}
}
}
.abs.bottom-bar {
top: auto;
right: 0;
bottom: 0;
left: 0;
overflow: visible;
//font-size: 1em;
height: $ovrFooterH;
}
.l-progress-bar {
$h: $progressBarHOverlay;
display: block;
height: $h;
line-height: $h;
margin: .5em 0;
width: 100%;
}
}
.t-dialog-sm .overlay > .holder {
// Used for blocker and in-progress dialogs, modal alerts, etc.
//@include test(red);
$h: 225px;
min-height: $h;
height: $h;
}

72
platform/commonUI/general/res/sass/user-environ/_bottom-bar.scss
View File

@@ -1,72 +0,0 @@
/*****************************************************************************
* 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.
*****************************************************************************/
.ue-bottom-bar {
background: $colorFooterBg;
color: lighten($colorBodyBg, 30%);
font-size: .7rem;
//line-height: $ueFooterH - 4px;
//line-height: $ueFooterH; // New status bar design
.status-holder {
//@include border-radius($basicCr * 1.75); // New status bar design
@include box-sizing(border-box);
//background: $colorFooterBg;
//border-bottom: 1px solid lighten($colorBodyBg, 10%); // New status bar design
@include absPosDefault($interiorMargin);
@include ellipsize();
line-height: $ueFooterH - ($interiorMargin * 2);
right: 120px;
text-transform: uppercase;
}
.app-logo {
@include box-sizing(border-box);
@include absPosDefault($interiorMargin);
left: auto;
cursor: pointer;
//font-size: 0.8em;
//line-height: $ueFooterH - 10px;
//padding-top: 1px;
//text-transform: uppercase;
&.logo-openmctweb {
background: url($dirImgs + 'logo-openmctweb.svg') no-repeat center center;
}
}
}
.status.block {
//display: inline-block;
display: inline; // New status bar design. Inline to support ellipsis overflow
margin-right: $interiorMarginLg;
.status-indicator {
//@include border-radius($controlCr * 0.9);
//@include box-shadow(inset rgba(black, 0.5) 0 0 3px);
//@include text-shadow(rgba(black, 0.3) 0 0 2px);
display: inline-block;
margin-right: $interiorMarginSm;
color: $colorKey;
&.ok {
color: #009900;
}
&.caution {
color: #ffaa00;
}
}
}

48
platform/commonUI/general/res/sass/user-environ/_layout.scss
View File

@@ -125,21 +125,37 @@
}
}
.ue-bottom-bar {
//@include absPosDefault($bodyMargin);
@include absPosDefault(0); // New status bar design
top: auto;
height: $ueFooterH;
.status-holder {
//right: $ueAppLogoW + $bodyMargin; New status bar design
z-index: 1;
}
.app-logo {
left: auto;
width: $ueAppLogoW;
z-index: 2;
}
}
// from _bottom-bar.scss
.ue-bottom-bar {
@include absPosDefault(0);// New status bar design
top: auto;
height: $ueFooterH;
line-height: $ueFooterH - ($interiorMargin * 2);
background: $colorFooterBg;
color: lighten($colorBodyBg, 30%);
font-size: .7rem;
.status-holder {
@include box-sizing(border-box);
@include absPosDefault($interiorMargin);
@include ellipsize();
//line-height: $ueFooterH - ($interiorMargin * 2);
right: 120px;
text-transform: uppercase;
z-index: 1;
}
.app-logo {
@include box-sizing(border-box);
@include absPosDefault($interiorMargin);
cursor: pointer;
left: auto;
width: $ueAppLogoW;
z-index: 2;
&.logo-openmctweb {
background: url($dirImgs + 'logo-openmctweb.svg') no-repeat center center;
}
}
}
}
.cols {
@@ -518,4 +534,4 @@
.pane:not(.resizing) {
@include trans-prop-nice-resize-w(250ms);
}
}
}

1
platform/commonUI/general/res/templates/bottombar.html
View File

@@ -26,5 +26,6 @@
key="indicator.template">
</mct-include>
</div>
<mct-include key="'message-banner'"></mct-include>
<mct-include key="'about-logo'"></mct-include>
</div>

20
platform/commonUI/general/res/templates/controls/datetime-field.html Normal file
View File

@@ -0,0 +1,20 @@
<span class="s-btn"
ng-controller="DateTimeFieldController">
<input type="text"
ng-model="textValue"
ng-class="{ error: textInvalid }">
</input>
<a class="ui-symbol icon icon-calendar"
ng-if="structure.format === 'utc' || !structure.format"
ng-click="pickerActive = !pickerActive">
</a>
<mct-popup ng-if="pickerActive">
<div mct-click-elsewhere="pickerActive = false">
<mct-control key="'datetime-picker'"
ng-model="ngModel"
field="field"
options="{ hours: true }">
</mct-control>
</div>
</mct-popup>
</span>

51
platform/commonUI/general/res/templates/controls/time-controller.html
View File

@@ -22,47 +22,24 @@
<div ng-controller="TimeRangeController">
<div class="l-time-range-inputs-holder">
<span class="l-time-range-inputs-elem ui-symbol type-icon">&#x43;</span>
<span class="l-time-range-input" ng-controller="ToggleController as t1">
<!--<span class="lbl">Start</span>-->
<span class="s-btn time-range-start">
<input type="text"
ng-model="boundsModel.start"
ng-class="{ error: !boundsModel.startValid }">
</input>
<a class="ui-symbol icon icon-calendar" ng-click="t1.toggle()"></a>
<mct-popup ng-if="t1.isActive()">
<div mct-click-elsewhere="t1.setState(false)">
<mct-control key="'datetime-picker'"
ng-model="ngModel.outer"
field="'start'"
options="{ hours: true }">
</mct-control>
</div>
</mct-popup>
</span>
<span class="l-time-range-input">
<mct-control key="'datetime-field'"
structure="{ format: parameters.format }"
ng-model="ngModel.outer"
field="'start'"
class="time-range-start">
</mct-control>
</span>
<span class="l-time-range-inputs-elem lbl">to</span>
<span class="l-time-range-input" ng-controller="ToggleController as t2">
<!--<span class="lbl">End</span>-->
<span class="s-btn l-time-range-input">
<input type="text"
ng-model="boundsModel.end"
ng-class="{ error: !boundsModel.endValid }">
</input>
<a class="ui-symbol icon icon-calendar" ng-click="t2.toggle()">
</a>
<mct-popup ng-if="t2.isActive()">
<div mct-click-elsewhere="t2.setState(false)">
<mct-control key="'datetime-picker'"
ng-model="ngModel.outer"
field="'end'"
options="{ hours: true }">
</mct-control>
</div>
</mct-popup>
</span>&nbsp;
<mct-control key="'datetime-field'"
structure="{ format: parameters.format }"
ng-model="ngModel.outer"
field="'end'"
class="time-range-end">
</mct-control>&nbsp;
</span>
</div>
@@ -97,7 +74,7 @@
<div class="l-time-range-ticks-holder">
<div class="l-time-range-ticks">
<div
ng-repeat="tick in ticks"
ng-repeat="tick in ticks track by $index"
ng-style="{ left: $index * (100 / (ticks.length - 1)) + '%' }"
class="tick tick-x"
>

27
platform/commonUI/general/res/templates/indicator.html
View File

@@ -19,20 +19,21 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<!-- DO NOT ADD SPACES BETWEEN THE SPANS - IT ADDS WHITE SPACE!! -->
<!--<div ng-init="reps = [1,2,3]"></div>-->
<div class='status block'
title="{{ngModel.getDescription()}}"
ng-click='ngModel.configure()'
ng-class='ngModel.getClass()'
ng-show="ngModel.getText().length > 0">
<span class="ui-symbol status-indicator"
ng-class='ngModel.getGlyphClass()'>
{{ngModel.getGlyph()}}
</span>
<span class="label"
ng-class='ngModel.getTextClass()'>
{{ngModel.getText()}}
</span>
<a href=''
title="{{ngModel.getDescription()}}"
ng-click='ngModel.configure()'
ng-class='ngModel.getGlyphClass()'
ng-show="ngModel.getText().length > 0">
<span class="ui-symbol status-indicator">
{{ngModel.getGlyph()}}
</span><span class="label"
ng-class='ngModel.getTextClass()'>
{{ngModel.getText()}}
</span><span class="count">
<!-- Add int count value here if this type of indicator has one or more messages associated with it -->
</span><a href=''
class="ui-symbol"
ng-if="ngModel.configure">
G

21
platform/commonUI/general/res/templates/message-banner.html Normal file
View File

@@ -0,0 +1,21 @@
<div ng-controller="BannerController" ng-show="active.notification"
class="l-message-banner s-message-banner {{active.notification.model.severity}}" ng-class="{
'minimized': active.notification.model.minimized,
'new': !active.notification.model.minimized}"
ng-click="maximize(active.notification)">
<span class="banner-elem label">
{{active.notification.model.title}}
</span>
<span ng-show="active.notification.model.progress !== undefined || active.notification.model.unknownProgress">
<mct-include key="'progress-bar'" class="banner-elem"
ng-model="active.notification.model">
</mct-include>
</span>
<a ng-hide="active.notification.model.primaryOption === undefined"
class="banner-elem l-action s-action"
ng-click="action(active.notification.model.primaryOption.callback, $event)">
{{active.notification.model.primaryOption.label}}
</a>
<a class="banner-elem ui-symbol close" ng-click="dismiss(active.notification, $event)">
&#x78;</a>
</div>

10
platform/commonUI/general/res/templates/progress-bar.html Normal file
View File

@@ -0,0 +1,10 @@
<span class="l-progress-bar s-progress-bar"
ng-class="{ indeterminate:ngModel.unknownProgress }">
<span class="progress-amt-holder">
<span class="progress-amt" style="width: {{ngModel.progress}}%"></span>
</span>
</span>
<div class="progress-info hint" ng-hide="ngModel.progressText === undefined">
<span class="progress-amt-text" ng-show="ngModel.progress > 0">{{ngModel.progress}}% complete. </span>
{{ngModel.progressText}}
</div>

68
platform/commonUI/general/src/controllers/BannerController.js Normal file
View File

@@ -0,0 +1,68 @@
/*****************************************************************************
* 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.
*****************************************************************************/
/*global define*/
define(
[],
function () {
"use strict";
/**
* A controller for banner notifications. Banner notifications are a
* non-blocking way of drawing the user's attention to an event such
* as system errors, or the progress or successful completion of an
* ongoing task. This controller provides scoped functions for
* dismissing and 'maximizing' notifications. See {@link NotificationService}
* for more details on Notifications.
*
* @param $scope
* @param notificationService
* @param dialogService
* @constructor
*/
function BannerController($scope, notificationService, dialogService) {
$scope.active = notificationService.active;
$scope.action = function (action, $event){
/*
Prevents default 'maximize' behaviour when clicking on
notification button
*/
$event.stopPropagation();
return action();
};
$scope.dismiss = function(notification, $event) {
$event.stopPropagation();
notification.dismissOrMinimize();
};
$scope.maximize = function(notification) {
if (notification.model.severity !== "info"){
notification.model.cancel = function(){
dialogService.dismiss();
};
dialogService.showBlockingMessage(notification.model);
}
};
}
return BannerController;
});

79
platform/commonUI/general/src/controllers/DateTimeFieldController.js Normal file
View File

@@ -0,0 +1,79 @@
/*****************************************************************************
* 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.
*****************************************************************************/
/*global define,Promise*/
define(
[],
function () {
'use strict';
/**
* Controller to support the date-time entry field.
*
* Accepts a `format` property in the `structure` attribute
* which allows a date/time to be specified via its symbolic
* key (as will be used to look up said format from the
* `formatService`.)
*
* {@see FormatService}
* @constructor
* @memberof platform/commonUI/general
* @param $scope the Angular scope for this controller
* @param {FormatService} formatService the service to user to format
* domain values
* @param {string} defaultFormat the format to request when no
* format has been otherwise specified
*/
function DateTimeFieldController($scope, formatService, defaultFormat) {
var formatter = formatService.getFormat(defaultFormat);
function updateFromModel(value) {
// Only reformat if the value is different from user
// input (to avoid reformatting valid input while typing.)
if (!formatter.validate($scope.textValue) ||
formatter.parse($scope.textValue) !== value) {
$scope.textValue = formatter.format(value);
$scope.textInvalid = false;
}
}
function updateFromView(textValue) {
$scope.textInvalid = !formatter.validate(textValue);
if (!$scope.textInvalid) {
$scope.ngModel[$scope.field] =
formatter.parse(textValue);
}
}
function setFormat(format) {
formatter = formatService.getFormat(format || defaultFormat);
updateFromModel($scope.ngModel[$scope.field]);
}
$scope.$watch('structure.format', setFormat);
$scope.$watch('ngModel[field]', updateFromModel);
$scope.$watch('textValue', updateFromView);
}
return DateTimeFieldController;
}
);

105
platform/commonUI/general/src/controllers/TimeRangeController.js
View File

@@ -26,33 +26,32 @@ define(
function (moment) {
"use strict";
var DATE_FORMAT = "YYYY-MM-DD HH:mm:ss",
TICK_SPACING_PX = 150;
var TICK_SPACING_PX = 150;
/**
* Controller used by the `time-controller` template.
* @memberof platform/commonUI/general
* @constructor
* @param $scope the Angular scope for this controller
* @param {FormatService} formatService the service to user to format
* domain values
* @param {string} defaultFormat the format to request when no
* format has been otherwise specified
* @param {Function} now a function to return current system time
*/
function TimeConductorController($scope, now) {
function TimeRangeController($scope, formatService, defaultFormat, now) {
var tickCount = 2,
innerMinimumSpan = 1000, // 1 second
outerMinimumSpan = 1000 * 60 * 60, // 1 hour
initialDragValue;
initialDragValue,
formatter = formatService.getFormat(defaultFormat);
function formatTimestamp(ts) {
return moment.utc(ts).format(DATE_FORMAT);
return formatter.format(ts);
}
function parseTimestamp(text) {
var m = moment.utc(text, DATE_FORMAT);
if (m.isValid()) {
return m.valueOf();
} else {
throw new Error("Could not parse " + text);
}
}
// From 0.0-1.0 to "0%"-"1%"
// From 0.0-1.0 to "0%"-"100%"
function toPercent(p) {
return (100 * p) + "%";
}
@@ -101,41 +100,15 @@ define(
return { start: bounds.start, end: bounds.end };
}
function updateBoundsTextForProperty(ngModel, property) {
try {
if (!$scope.boundsModel[property] ||
parseTimestamp($scope.boundsModel[property]) !==
ngModel.outer[property]) {
$scope.boundsModel[property] =
formatTimestamp(ngModel.outer[property]);
}
} catch (e) {
// User-entered text is invalid, so leave it be
// until they fix it.
}
}
function updateBoundsText(ngModel) {
updateBoundsTextForProperty(ngModel, 'start');
updateBoundsTextForProperty(ngModel, 'end');
}
function updateViewFromModel(ngModel) {
var t = now();
ngModel = ngModel || {};
ngModel.outer = ngModel.outer || defaultBounds();
ngModel.inner = ngModel.inner || copyBounds(ngModel.outer);
// First, dates for the date pickers for outer bounds
updateBoundsText(ngModel);
// Then various updates for the inner span
updateViewForInnerSpanFromModel(ngModel);
// Stick it back is scope (in case we just set defaults)
$scope.ngModel = ngModel;
updateViewForInnerSpanFromModel(ngModel);
updateTicks();
}
@@ -155,7 +128,8 @@ define(
}
function toMillis(pixels) {
var span = $scope.ngModel.outer.end - $scope.ngModel.outer.start;
var span =
$scope.ngModel.outer.end - $scope.ngModel.outer.start;
return (pixels / $scope.spanWidth) * span;
}
@@ -243,36 +217,10 @@ define(
updateTicks();
}
function updateStartFromText(value) {
try {
updateOuterStart(parseTimestamp(value));
updateBoundsTextForProperty($scope.ngModel, 'end');
$scope.boundsModel.startValid = true;
} catch (e) {
$scope.boundsModel.startValid = false;
return;
}
}
function updateEndFromText(value) {
try {
updateOuterEnd(parseTimestamp(value));
updateBoundsTextForProperty($scope.ngModel, 'start');
$scope.boundsModel.endValid = true;
} catch (e) {
$scope.boundsModel.endValid = false;
return;
}
}
function updateStartFromPicker(value) {
updateOuterStart(value);
updateBoundsText($scope.ngModel);
}
function updateEndFromPicker(value) {
updateOuterEnd(value);
updateBoundsText($scope.ngModel);
function updateFormat(key) {
formatter = formatService.getFormat(key || defaultFormat);
updateViewForInnerSpanFromModel($scope.ngModel);
updateTicks();
}
$scope.startLeftDrag = startLeftDrag;
@@ -282,21 +230,18 @@ define(
$scope.rightDrag = rightDrag;
$scope.middleDrag = middleDrag;
$scope.state = false;
$scope.ticks = [];
$scope.boundsModel = {};
// Initialize scope to defaults
updateViewFromModel($scope.ngModel);
$scope.$watchCollection("ngModel", updateViewFromModel);
$scope.$watch("spanWidth", updateSpanWidth);
$scope.$watch("ngModel.outer.start", updateStartFromPicker);
$scope.$watch("ngModel.outer.end", updateEndFromPicker);
$scope.$watch("boundsModel.start", updateStartFromText);
$scope.$watch("boundsModel.end", updateEndFromText);
$scope.$watch("ngModel.outer.start", updateOuterStart);
$scope.$watch("ngModel.outer.end", updateOuterEnd);
$scope.$watch("parameters.format", updateFormat);
}
return TimeConductorController;
return TimeRangeController;
}
);

183
platform/commonUI/general/test/controllers/DateTimeFieldControllerSpec.js Normal file
View File

@@ -0,0 +1,183 @@
/*****************************************************************************
* 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.
*****************************************************************************/
/*global define,Promise,describe,it,expect,beforeEach,waitsFor,jasmine*/
define(
["../../src/controllers/DateTimeFieldController", "moment"],
function (DateTimeFieldController, moment) {
'use strict';
var TEST_FORMAT = "YYYY-MM-DD HH:mm:ss";
describe("The DateTimeFieldController", function () {
var mockScope,
mockFormatService,
mockFormat,
controller;
function fireWatch(expr, value) {
mockScope.$watch.calls.forEach(function (call) {
if (call.args[0] === expr) {
call.args[1](value);
}
});
}
beforeEach(function () {
mockScope = jasmine.createSpyObj('$scope', ['$watch']);
mockFormatService =
jasmine.createSpyObj('formatService', ['getFormat']);
mockFormat = jasmine.createSpyObj('format', [
'parse',
'validate',
'format'
]);
mockFormatService.getFormat.andReturn(mockFormat);
mockFormat.validate.andCallFake(function (text) {
return moment.utc(text, TEST_FORMAT).isValid();
});
mockFormat.parse.andCallFake(function (text) {
return moment.utc(text, TEST_FORMAT).valueOf();
});
mockFormat.format.andCallFake(function (value) {
return moment.utc(value).format(TEST_FORMAT);
});
mockScope.ngModel = { testField: 12321 };
mockScope.field = "testField";
mockScope.structure = { format: "someFormat" };
controller = new DateTimeFieldController(
mockScope,
mockFormatService
);
});
it("updates models from user-entered text", function () {
var newText = "1977-05-25 17:30:00";
mockScope.textValue = newText;
fireWatch("textValue", newText);
expect(mockScope.ngModel.testField)
.toEqual(mockFormat.parse(newText));
expect(mockScope.textInvalid).toBeFalsy();
});
it("updates text from model values", function () {
var testTime = mockFormat.parse("1977-05-25 17:30:00");
mockScope.ngModel.testField = testTime;
fireWatch("ngModel[field]", testTime);
expect(mockScope.textValue).toEqual("1977-05-25 17:30:00");
});
describe("when user input is invalid", function () {
var newText, oldValue;
beforeEach(function () {
newText = "Not a date";
oldValue = mockScope.ngModel.testField;
mockScope.textValue = newText;
fireWatch("textValue", newText);
});
it("displays error state", function () {
expect(mockScope.textInvalid).toBeTruthy();
});
it("does not modify model state", function () {
expect(mockScope.ngModel.testField).toEqual(oldValue);
});
it("does not modify user input", function () {
expect(mockScope.textValue).toEqual(newText);
});
});
it("does not modify valid but irregular user input", function () {
// Don't want the controller "fixing" bad or
// irregularly-formatted input out from under
// the user's fingertips.
var newText = "2015-3-3 01:02:04",
oldValue = mockScope.ngModel.testField;
mockFormat.validate.andReturn(true);
mockFormat.parse.andReturn(42);
mockScope.textValue = newText;
fireWatch("textValue", newText);
expect(mockScope.textValue).toEqual(newText);
expect(mockScope.ngModel.testField).toEqual(42);
expect(mockScope.ngModel.testField).not.toEqual(oldValue);
});
it("obtains a format from the format service", function () {
fireWatch('structure.format', mockScope.structure.format);
expect(mockFormatService.getFormat)
.toHaveBeenCalledWith(mockScope.structure.format);
});
it("throws an error for unknown formats", function () {
mockFormatService.getFormat.andReturn(undefined);
expect(function () {
fireWatch("structure.format", "some-format");
}).toThrow();
});
describe("using the obtained format", function () {
var testValue = 1234321,
testText = "some text";
beforeEach(function () {
mockFormat.validate.andReturn(true);
mockFormat.parse.andReturn(testValue);
mockFormat.format.andReturn(testText);
});
it("parses user input", function () {
var newText = "some other new text";
mockScope.textValue = newText;
fireWatch("textValue", newText);
expect(mockFormat.parse).toHaveBeenCalledWith(newText);
expect(mockScope.ngModel.testField).toEqual(testValue);
});
it("validates user input", function () {
var newText = "some other new text";
mockScope.textValue = newText;
fireWatch("textValue", newText);
expect(mockFormat.validate).toHaveBeenCalledWith(newText);
});
it("formats model data for display", function () {
var newValue = 42;
mockScope.ngModel.testField = newValue;
fireWatch("ngModel[field]", newValue);
expect(mockFormat.format).toHaveBeenCalledWith(newValue);
expect(mockScope.textValue).toEqual(testText);
});
});
});
}
);

101
platform/commonUI/general/test/controllers/TimeRangeControllerSpec.js
View File

@@ -33,7 +33,10 @@ define(
describe("The TimeRangeController", function () {
var mockScope,
mockFormatService,
testDefaultFormat,
mockNow,
mockFormat,
controller;
function fireWatch(expr, value) {
@@ -57,8 +60,30 @@ define(
"$scope",
[ "$apply", "$watch", "$watchCollection" ]
);
mockFormatService = jasmine.createSpyObj(
"formatService",
[ "getFormat" ]
);
testDefaultFormat = 'utc';
mockFormat = jasmine.createSpyObj(
"format",
[ "validate", "format", "parse" ]
);
mockFormatService.getFormat.andReturn(mockFormat);
mockFormat.format.andCallFake(function (value) {
return moment.utc(value).format("YYYY-MM-DD HH:mm:ss");
});
mockNow = jasmine.createSpy('now');
controller = new TimeRangeController(mockScope, mockNow);
controller = new TimeRangeController(
mockScope,
mockFormatService,
testDefaultFormat,
mockNow
);
});
it("watches the model that was passed in", function () {
@@ -167,70 +192,22 @@ define(
.toBeGreaterThan(mockScope.ngModel.inner.start);
});
describe("by typing", function () {
it("updates models", function () {
var newStart = "1977-05-25 17:30:00",
newEnd = "2015-12-18 03:30:00";
mockScope.boundsModel.start = newStart;
fireWatch("boundsModel.start", newStart);
expect(mockScope.ngModel.outer.start)
.toEqual(moment.utc(newStart).valueOf());
expect(mockScope.boundsModel.startValid)
.toBeTruthy();
mockScope.boundsModel.end = newEnd;
fireWatch("boundsModel.end", newEnd);
expect(mockScope.ngModel.outer.end)
.toEqual(moment.utc(newEnd).valueOf());
expect(mockScope.boundsModel.endValid)
.toBeTruthy();
});
it("displays error state", function () {
var newStart = "Not a date",
newEnd = "Definitely not a date",
oldStart = mockScope.ngModel.outer.start,
oldEnd = mockScope.ngModel.outer.end;
mockScope.boundsModel.start = newStart;
fireWatch("boundsModel.start", newStart);
expect(mockScope.ngModel.outer.start)
.toEqual(oldStart);
expect(mockScope.boundsModel.startValid)
.toBeFalsy();
mockScope.boundsModel.end = newEnd;
fireWatch("boundsModel.end", newEnd);
expect(mockScope.ngModel.outer.end)
.toEqual(oldEnd);
expect(mockScope.boundsModel.endValid)
.toBeFalsy();
});
it("does not modify user input", function () {
// Don't want the controller "fixing" bad or
// irregularly-formatted input out from under
// the user's fingertips.
var newStart = "Not a date",
newEnd = "2015-3-3 01:02:04",
oldStart = mockScope.ngModel.outer.start,
oldEnd = mockScope.ngModel.outer.end;
mockScope.boundsModel.start = newStart;
fireWatch("boundsModel.start", newStart);
expect(mockScope.boundsModel.start)
.toEqual(newStart);
mockScope.boundsModel.end = newEnd;
fireWatch("boundsModel.end", newEnd);
expect(mockScope.boundsModel.end)
.toEqual(newEnd);
});
});
});
it("watches for changes in format selection", function () {
expect(mockFormatService.getFormat)
.not.toHaveBeenCalledWith('test-format');
fireWatch("parameters.format", 'test-format');
expect(mockFormatService.getFormat)
.toHaveBeenCalledWith('test-format');
});
it("throws an error for unknown formats", function () {
mockFormatService.getFormat.andReturn(undefined);
expect(function () {
fireWatch("parameters.format", "some-format");
}).toThrow();
});
});
}

1
platform/commonUI/general/test/suite.json
View File

@@ -3,6 +3,7 @@
"controllers/BottomBarController",
"controllers/ClickAwayController",
"controllers/ContextMenuController",
"controllers/DateTimeFieldController",
"controllers/DateTimePickerController",
"controllers/GetterSetterController",
"controllers/ObjectInspectorController",