diff --git a/public/app/core/directives/dash_edit_link.js b/public/app/core/directives/dash_edit_link.js
index 0f528f5595f..1663c2603bb 100644
--- a/public/app/core/directives/dash_edit_link.js
+++ b/public/app/core/directives/dash_edit_link.js
@@ -35,7 +35,10 @@ function ($, coreModule) {
var lastEditor;
function hideEditorPane() {
- if (editorScope) { editorScope.dismiss(); }
+ if (editorScope) {
+ scope.appEvent('dash-editor-hidden', lastEditor);
+ editorScope.dismiss();
+ }
}
function showEditorPane(evt, payload, editview) {
diff --git a/public/app/features/dashboard/timeSrv.js b/public/app/features/dashboard/timeSrv.js
index c956d73e2ab..d9e3420147d 100644
--- a/public/app/features/dashboard/timeSrv.js
+++ b/public/app/features/dashboard/timeSrv.js
@@ -30,10 +30,10 @@ define([
this._parseTime = function() {
// when absolute time is saved in json it is turned to a string
if (_.isString(this.time.from) && this.time.from.indexOf('Z') >= 0) {
- this.time.from = moment(this.time.from);
+ this.time.from = moment(this.time.from).utc();
}
if (_.isString(this.time.to) && this.time.to.indexOf('Z') >= 0) {
- this.time.to = moment(this.time.to);
+ this.time.to = moment(this.time.to).utc();
}
};
@@ -120,19 +120,16 @@ define([
};
this.timeRange = function(parse) {
- var _t = this.time;
+ // make copies if they are moment (do not want to return out internal moment, because they are mutable!)
+ var from = moment.isMoment(this.time.from) ? moment(this.time.from) : this.time.from ;
+ var to = moment.isMoment(this.time.to) ? moment(this.time.to) : this.time.to ;
- if(parse === false) {
- return { from: _t.from, to: _t.to };
- } else {
- var _from = _t.from;
- var _to = _t.to || moment();
-
- return {
- from: dateMath.parse(_from, false),
- to: dateMath.parse(_to, true)
- };
+ if (parse !== false) {
+ from = dateMath.parse(from, false);
+ to = dateMath.parse(to, true);
}
+
+ return {from: from, to: to};
};
});
diff --git a/public/app/features/dashboard/timepicker/input_date.js b/public/app/features/dashboard/timepicker/input_date.js
index 24eb04cd250..caec5ba55fe 100644
--- a/public/app/features/dashboard/timepicker/input_date.js
+++ b/public/app/features/dashboard/timepicker/input_date.js
@@ -13,19 +13,21 @@ define([
require: 'ngModel',
link: function ($scope, $elem, attrs, ngModel) {
var format = 'YYYY-MM-DD HH:mm:ss';
- // $elem.after('' + format + '
');
- // What should I make with the input from the user?
var fromUser = function (text) {
- console.log('fromUser: ' + text);
- return text;
- // if (_.isString(text)) {
- // }
- // var parsed = moment(text, format);
- // return parsed.isValid() ? parsed : undefined;
+ if (text.indexOf('now') !== -1) {
+ return text;
+ }
+ var parsed;
+ if ($scope.ctrl.isUtc) {
+ parsed = moment.utc(text, format);
+ } else {
+ parsed = moment(text, format);
+ }
+
+ return parsed.isValid() ? parsed : undefined;
};
- // How should I present the data back to the user in the input field?
var toUser = function (currentValue) {
if (moment.isMoment(currentValue)) {
return currentValue.format(format);
diff --git a/public/app/features/dashboard/timepicker/timepicker.html b/public/app/features/dashboard/timepicker/timepicker.html
index 264669a2050..ce976e2cc3d 100644
--- a/public/app/features/dashboard/timepicker/timepicker.html
+++ b/public/app/features/dashboard/timepicker/timepicker.html
@@ -6,10 +6,13 @@
-
-
+
+
+
+ UTC
+
diff --git a/public/app/features/dashboard/timepicker/timepicker.ts b/public/app/features/dashboard/timepicker/timepicker.ts
index 40647fb5bed..4e1c9f61bce 100644
--- a/public/app/features/dashboard/timepicker/timepicker.ts
+++ b/public/app/features/dashboard/timepicker/timepicker.ts
@@ -26,12 +26,18 @@ export class TimePickerCtrl {
rangeString: string;
timeOptions: any;
refresh: any;
+ isOpen: boolean;
+ isUtc: boolean;
constructor(private $scope, private $rootScope, private timeSrv) {
$scope.ctrl = this;
$rootScope.onAppEvent('refresh', () => this.init(), $scope);
$rootScope.onAppEvent('zoom-out', () => this.zoom(2), $scope);
+ $rootScope.onAppEvent('dash-editor-hidden', () => {
+ this.isOpen = false;
+ }, $scope);
+
this.init();
}
@@ -40,8 +46,21 @@ export class TimePickerCtrl {
_.defaults(this.panel, TimePickerCtrl.defaults);
- var time = this.timeSrv.timeRange();
- var timeRaw = this.timeSrv.timeRange(false);
+ var time = angular.copy(this.timeSrv.timeRange());
+ var timeRaw = angular.copy(this.timeSrv.timeRange(false));
+
+ if (this.dashboard.timezone === 'browser') {
+ time.from.local();
+ time.to.local();
+ if (moment.isMoment(timeRaw.from)) {
+ timeRaw.from.local();
+ }
+ if (moment.isMoment(timeRaw.to)) {
+ timeRaw.to.local();
+ }
+ } else {
+ this.isUtc = true;
+ }
this.rangeString = rangeUtil.describeTimeRange(timeRaw);
this.absolute = {fromJs: time.from.toDate(), toJs: time.to.toDate()};
@@ -69,6 +88,7 @@ export class TimePickerCtrl {
}
openDropdown() {
+ this.isOpen = true;
this.timeOptions = rangeUtil.getRelativeTimesList(this.panel, this.rangeString);
this.refresh = {
value: this.dashboard.refresh,
@@ -91,16 +111,21 @@ export class TimePickerCtrl {
this.timeSrv.setAutoRefresh(this.refresh.value);
}
+ debugger;
this.timeSrv.setTime(this.timeRaw);
this.$rootScope.appEvent('hide-dash-editor');
}
absoluteFromChanged() {
- this.timeRaw.from = moment(this.absolute.fromJs);
+ this.timeRaw.from = this.getAbsoluteMomentForTimezone(this.absolute.fromJs);
}
absoluteToChanged() {
- this.timeRaw.to = moment(this.absolute.toJs);
+ this.timeRaw.to = this.getAbsoluteMomentForTimezone(this.absolute.toJs);
+ }
+
+ getAbsoluteMomentForTimezone(jsDate) {
+ return this.dashboard.timezone === 'browser' ? moment(jsDate) : moment(jsDate).utc();
}
setRelativeFilter(timespan) {
diff --git a/public/less/timepicker.less b/public/less/timepicker.less
index 8bdc2d570b7..3884f5f5df7 100644
--- a/public/less/timepicker.less
+++ b/public/less/timepicker.less
@@ -14,6 +14,11 @@
.box-shadow(@navbarDropdownShadow);
}
+li.gf-timepicker-open a {
+ background-color: @grafanaPanelBackground;
+ .box-shadow(0px 10px 0px @grafanaPanelBackground);
+}
+
.gf-timepicker-absolute-section {
width: 300px;
float: left;
@@ -29,16 +34,31 @@
margin: 0 0 0 15px;
}
+.gf-timepicker-utc {
+ background-color: @blueDark;
+ color: @white;
+ font-size: 75%;
+ padding: 3px;
+ border-radius: 2px;
+ font-weight: bold;
+ margin-left: 4px;
+}
+
.gf-timepicker-relative-section {
- padding: 0 20px 0 25px;
+ padding: 0 20px 0 30px;
min-height: 258px;
float: left;
ul {
+ list-style: none;
float: left;
- margin: 0 20px 10px 25px;
+ margin: 0 30px 10px 0px;
+ li {
+ line-height: 22px;
+ }
li.active {
border-bottom: 1px solid @blue;
margin: 3px 0;
+ font-weight: bold;
}
}
}