Skip to content

Commit 0884169

Browse files
akhenryakhenry
committed
Added duration
1 parent 2056d87 commit 0884169

File tree

6 files changed

+161
-14
lines changed

6 files changed

+161
-14
lines changed

‎platform/commonUI/formats/bundle.js

+6
Original file line numberDiff line numberDiff line change
@@ -23,10 +23,12 @@
2323
define([
2424
"./src/FormatProvider",
2525
"./src/UTCTimeFormat",
26+
"./src/DurationFormat",
2627
'legacyRegistry'
2728
], function (
2829
FormatProvider,
2930
UTCTimeFormat,
31+
DurationFormat,
3032
legacyRegistry
3133
) {
3234

@@ -48,6 +50,10 @@ define([
4850
{
4951
"key": "utc",
5052
"implementation": UTCTimeFormat
53+
},
54+
{
55+
"key": "duration",
56+
"implementation": DurationFormat
5157
}
5258
],
5359
"constants": [

‎platform/commonUI/formats/src/DurationFormat.js

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
/*****************************************************************************
2+
* Open MCT Web, Copyright (c) 2014-2015, United States Government
3+
* as represented by the Administrator of the National Aeronautics and Space
4+
* Administration. All rights reserved.
5+
*
6+
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
7+
* "License"); you may not use this file except in compliance with the License.
8+
* You may obtain a copy of the License at
9+
* http://www.apache.org/licenses/LICENSE-2.0.
10+
*
11+
* Unless required by applicable law or agreed to in writing, software
12+
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
13+
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
14+
* License for the specific language governing permissions and limitations
15+
* under the License.
16+
*
17+
* Open MCT Web includes source code licensed under additional open source
18+
* licenses. See the Open Source Licenses file (LICENSES.md) included with
19+
* this source code distribution or the Licensing information page available
20+
* at runtime from the About dialog for additional information.
21+
*****************************************************************************/
22+
23+
define([
24+
'moment'
25+
], function (
26+
moment
27+
) {
28+
29+
var DATE_FORMAT = "HH:mm:ss",
30+
DATE_FORMATS = [
31+
DATE_FORMAT
32+
];
33+
34+
35+
/**
36+
* Formatter for UTC timestamps. Interprets numeric values as
37+
* milliseconds since the start of 1970. Displays only the utc time. Can
38+
* be used, with care, for specifying time intervals.
39+
*
40+
* @implements {Format}
41+
* @constructor
42+
* @memberof platform/commonUI/formats
43+
*/
44+
function DurationFormat() {
45+
}
46+
47+
DurationFormat.prototype.format = function (value) {
48+
return moment.utc(value).format(DATE_FORMAT);
49+
};
50+
51+
DurationFormat.prototype.parse = function (text) {
52+
return moment.duration(text).asMilliseconds();
53+
};
54+
55+
DurationFormat.prototype.validate = function (text) {
56+
return moment.utc(text, DATE_FORMATS).isValid();
57+
};
58+
59+
return DurationFormat;
60+
});

‎platform/commonUI/general/res/templates/controls/datetime-field.html

+1
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@
2323
<input type="text"
2424
ng-model="textValue"
2525
ng-blur="restoreTextValue(); ngBlur()"
26+
ng-mouseup="ngMouseup()"
2627
ng-class="{
2728
error: textInvalid ||
2829
(structure.validate &&

‎platform/features/conductor-v2/res/templates/time-conductor.html

+37-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
11
<!-- Parent holder for time conductor. follow-mode | fixed-mode -->
2+
<style>
3+
.start-delta {
4+
left: 180px;
5+
}
6+
</style>
27
<div ng-controller="TimeConductorController as tcController"
38
class="l-time-conductor l-flex-col {{modeModel.selected}}-mode">
49
<!-- Holds inputs and ticks -->
@@ -12,11 +17,40 @@
1217
validate: tcController.validateStart
1318
}"
1419
ng-model="formModel"
15-
ng-blur="tcController.updateBoundsFromForm(formModel)"
20+
ng-mouseup="tcController.changing['start'] = true"
21+
ng-blur="tcController.changing['start'] = false; tcController.updateBoundsFromForm(formModel)"
1622
field="'start'"
1723
class="time-range-start">
1824
</mct-control>
1925
</span>
26+
<span class="l-time-range-input-w start-delta"
27+
ng-class="{'hide':(modeModel.selected === 'fixed')}">
28+
<mct-control key="'datetime-field'"
29+
structure="{
30+
format: 'duration',
31+
validate: tcController.validateStartDelta
32+
}"
33+
ng-model="formModel"
34+
ng-mouseup="tcController.changing['startDelta'] = true"
35+
ng-blur="tcController.changing['startDelta'] = false; tcController.updateDeltasFromForm(formModel)"
36+
field="'startDelta'"
37+
class="time-delta-start">
38+
</mct-control>
39+
</span>
40+
<span class="l-time-range-input-w end-delta"
41+
ng-class="{'hide':(modeModel.selected === 'fixed')}">
42+
<mct-control key="'time-field'"
43+
structure="{
44+
format: 'duration',
45+
validate: tcController.validateEndDelta
46+
}"
47+
ng-model="formModel"
48+
ng-mouseup="tcController.changing['endDelta'] = true"
49+
ng-blur="tcController.changing['endDelta'] = false; tcController.updateDeltasFromForm(formModel)"
50+
field="'endDelta'"
51+
class="time-delta-end">
52+
</mct-control>
53+
</span>
2054
<span class="l-time-range-input-w end-date"
2155
ng-controller="ToggleController as t2">
2256
<mct-control key="'datetime-field'"
@@ -25,7 +59,8 @@
2559
validate: tcController.validateEnd
2660
}"
2761
ng-model="formModel"
28-
ng-blur="tcController.updateBoundsFromForm(formModel)"
62+
ng-mouseup="tcController.changing['end'] = true"
63+
ng-blur="tcController.changing['end'] = false; tcController.updateBoundsFromForm(formModel)"
2964
field="'end'"
3065
class="time-range-end">
3166
</mct-control>

‎platform/features/conductor-v2/src/TimeConductorController.js

+54-12
Original file line numberDiff line numberDiff line change
@@ -32,17 +32,31 @@ define(
3232
this.$scope = $scope;
3333
this.$timeout = $timeout;
3434
this.conductor = conductor;
35+
this.endDelta = 0;
3536

36-
$scope.formModel = {};
37-
$scope.modeSelector = {
38-
value: 'fixed'
37+
this.changing = {
38+
'start': false,
39+
'startDelta': false,
40+
'end': false,
41+
'endDelta': false
3942
};
4043

44+
$scope.formModel = {};
45+
4146
conductor.on('bounds', function (bounds) {
42-
$scope.formModel = {
43-
start: bounds.start,
44-
end: bounds.end
45-
};
47+
if (!self.changing['start']) {
48+
$scope.formModel.start = bounds.start;
49+
}
50+
if (!self.changing['end']) {
51+
$scope.formModel.end = bounds.end;
52+
}
53+
if (!self.changing['startDelta']) {
54+
$scope.formModel.startDelta = bounds.end - bounds.start;
55+
}
56+
57+
if (!self.changing['endDelta']) {
58+
$scope.formModel.endDelta = 0;
59+
}
4660
});
4761

4862
conductor.on('follow', function (follow){
@@ -89,6 +103,7 @@ define(
89103
var now = Math.ceil(Date.now() / 1000) * 1000;
90104
//Set the time conductor to some default
91105
this.conductor.bounds({start: now - SIX_HOURS, end: now});
106+
92107
this.$scope.modeModel.selected = 'fixed';
93108
this.conductor.follow(false);
94109
};
@@ -111,19 +126,46 @@ define(
111126
}
112127
};
113128

129+
TimeConductorController.prototype.validateStartDelta = function (startDelta) {
130+
return startDelta > 0;
131+
};
132+
133+
TimeConductorController.prototype.validateEndDelta = function (endDelta) {
134+
return endDelta >= 0;
135+
};
136+
137+
TimeConductorController.prototype.validateDeltas = function (formModel) {
138+
// Validate that start Delta is some non-zero value, and that end
139+
// delta is zero or positive (ie. 'now' or some time in the future).
140+
return this.validateStartDelta(formModel.startDelta) && this.validateEndDelta(formModel.endDelta);
141+
};
142+
143+
TimeConductorController.prototype.updateDeltasFromForm = function (formModel) {
144+
145+
if (this.validateDeltas(formModel)) {
146+
var oldBounds = this.conductor.bounds(),
147+
newBounds = {
148+
start: oldBounds.end - formModel.startDelta,
149+
end: oldBounds.end + formModel.endDelta
150+
};
151+
this.conductor.bounds(newBounds);
152+
}
153+
};
154+
114155
TimeConductorController.prototype.switchMode = function (newMode) {
115156
if (this.mode) {
116157
this.mode();
117158
}
118-
this.mode = TimeConductorController.modes[newMode].call(this, this.conductor);
159+
this.mode = TimeConductorController.modes[newMode].call(this);
119160
};
120161

121162
TimeConductorController.modes = {
122-
'fixed': function (conductor) {
123-
conductor.follow(false);
163+
'fixed': function () {
164+
this.conductor.follow(false);
124165
},
125-
'realtime': function (conductor) {
166+
'realtime': function () {
126167
var tickInterval = 1000;
168+
var conductor = this.conductor;
127169
var $timeout = this.$timeout;
128170
var timeoutPromise = $timeout(tick, tickInterval);
129171

@@ -144,7 +186,7 @@ define(
144186
},
145187
'latest': function (conductor) {
146188
//Don't know what to do here yet...
147-
conductor.follow(true);
189+
this.conductor.follow(true);
148190
}
149191
};
150192

‎platform/forms/src/MCTControl.js

+3
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,9 @@ define(
7171
// Allow controls to trigger blur-like events
7272
ngBlur: "&",
7373

74+
// Allow controls to trigger blur-like events
75+
ngMouseup: "&",
76+
7477
// The state of the form value itself
7578
ngModel: "=",
7679

0 commit comments

Comments
 (0)