feat(timepicker): added new relative time option , will set time range to…

feat(timepicker): added new relative time option , will set time range to midnight to now, closes #1186

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 
 **New Features && Enhancements**
 **New Features && Enhancements**
 - [Issue #2457](https://github.com/grafana/grafana/issues/2457). Admin: admin page for all grafana organizations (list / edit view)
 - [Issue #2457](https://github.com/grafana/grafana/issues/2457). Admin: admin page for all grafana organizations (list / edit view)
+- [Issue #1186](https://github.com/grafana/grafana/issues/1186). Time Picker: New option `today`, will set time range from midnight to now
 
 
 
 
 # 2.1.1 (2015-08-11)
 # 2.1.1 (2015-08-11)

public/app/panels/timepicker/module.html

@@ -20,7 +20,7 @@
 
 
 			<li class="dropdown">
 			<li class="dropdown">
 
 
-				<a class="dropdown-toggle timepicker-dropdown" data-toggle="dropdown" href="" bs-tooltip="time.tooltip" data-placement="bottom" ng-click="dismiss();">
+				<a class="dropdown-toggle timepicker-dropdown" data-toggle="dropdown" bs-tooltip="time.tooltip" data-placement="bottom" ng-click="loadTimeOptions();">
 					<i class="fa fa-clock-o"></i>
 					<i class="fa fa-clock-o"></i>
 					<span ng-bind="time.rangeString"></span>
 					<span ng-bind="time.rangeString"></span>
 					<span ng-show="dashboard.refresh" class="text-warning">refreshed every {{dashboard.refresh}} </span>
 					<span ng-show="dashboard.refresh" class="text-warning">refreshed every {{dashboard.refresh}} </span>
@@ -28,9 +28,8 @@
 				</a>
 				</a>
 
 
 				<ul class="dropdown-menu">
 				<ul class="dropdown-menu">
-					<!-- Relative time options -->
-					<li bindonce ng-repeat='timespan in panel.time_options track by $index'>
-						<a ng-click="setRelativeFilter(timespan)" bo-text="'Last ' + timespan"></a>
+					<li bindonce ng-repeat='option in time_options'>
+						<a ng-click="setRelativeFilter(option)" bo-text="option.text"></a>
           </li>
           </li>
 
 
           <!-- Auto refresh submenu -->
           <!-- Auto refresh submenu -->

public/app/panels/timepicker/module.js

@@ -72,6 +72,22 @@ function (angular, app, _, moment, kbn) {
       });
       });
     };
     };
 
 
+    $scope.loadTimeOptions = function() {
+      $scope.time_options = _.map($scope.panel.time_options, function(str) {
+        var option = {value: str};
+        if (str === 'today') {
+          option.text = 'Today';
+          option.from = 'today';
+          option.to = 'now';
+        } else {
+          option.text = 'Last ' + str;
+          option.from = 'now-'+str;
+          option.to = 'now';
+        }
+        return option;
+      });
+    };
+
     $scope.customTime = function() {
     $scope.customTime = function() {
       // Assume the form is valid since we're setting it to something valid
       // Assume the form is valid since we're setting it to something valid
       $scope.input.$setValidity("dummy", true);
       $scope.input.$setValidity("dummy", true);
@@ -135,9 +151,6 @@ function (angular, app, _, moment, kbn) {
         _filter.to = "now";
         _filter.to = "now";
       }
       }
 
 
-      // Set the filter
-      $scope.panel.filter_id = timeSrv.setTime(_filter);
-
       // Update our representation
       // Update our representation
       $scope.time = getScopeTimeObj(time.from,time.to);
       $scope.time = getScopeTimeObj(time.from,time.to);
     };
     };
@@ -145,18 +158,15 @@ function (angular, app, _, moment, kbn) {
     $scope.setRelativeFilter = function(timespan) {
     $scope.setRelativeFilter = function(timespan) {
       $scope.panel.now = true;
       $scope.panel.now = true;
 
 
-      var _filter = {
-        from : "now-"+timespan,
-        to: "now"
-      };
+      var range = {from: timespan.from, to: timespan.to};
 
 
       if ($scope.panel.nowDelay) {
       if ($scope.panel.nowDelay) {
-        _filter.to = 'now-' + $scope.panel.nowDelay;
+        range.to = 'now-' + $scope.panel.nowDelay;
       }
       }
 
 
-      timeSrv.setTime(_filter);
+      timeSrv.setTime(range);
 
 
-      $scope.time = getScopeTimeObj(kbn.parseDate(_filter.from),new Date());
+      $scope.time = getScopeTimeObj(kbn.parseDate(range.from),new Date());
     };
     };
 
 
     var pad = function(n, width, z) {
     var pad = function(n, width, z) {
@@ -177,7 +187,7 @@ function (angular, app, _, moment, kbn) {
     };
     };
 
 
     var getScopeTimeObj = function(from,to) {
     var getScopeTimeObj = function(from,to) {
-      var model = { from: getTimeObj(from), to: getTimeObj(to), };
+      var model = {from: getTimeObj(from), to: getTimeObj(to)};
 
 
       if (model.from.date) {
       if (model.from.date) {
         model.tooltip = $scope.dashboard.formatDate(model.from.date) + ' <br>to<br>';
         model.tooltip = $scope.dashboard.formatDate(model.from.date) + ' <br>to<br>';
@@ -189,8 +199,12 @@ function (angular, app, _, moment, kbn) {
 
 
       if (timeSrv.time) {
       if (timeSrv.time) {
         if ($scope.panel.now) {
         if ($scope.panel.now) {
-          model.rangeString = moment(model.from.date).fromNow() + ' to ' +
-            moment(model.to.date).fromNow();
+          if (timeSrv.time.from === 'today') {
+            model.rangeString = 'Today';
+          } else {
+            model.rangeString = moment(model.from.date).fromNow() + ' to ' +
+              moment(model.to.date).fromNow();
+          }
         }
         }
         else {
         else {
           model.rangeString = $scope.dashboard.formatDate(model.from.date, 'MMM D, YYYY HH:mm:ss') + ' to ' +
           model.rangeString = $scope.dashboard.formatDate(model.from.date, 'MMM D, YYYY HH:mm:ss') + ' to ' +

public/app/plugins/datasource/influxdb/datasource.js

@@ -186,7 +186,10 @@ function (angular, _, kbn, InfluxSeries, InfluxQueryBuilder) {
 
 
     function getInfluxTime(date) {
     function getInfluxTime(date) {
       if (_.isString(date)) {
       if (_.isString(date)) {
-        return date.replace('now', 'now()').replace('-', ' - ');
+        if (date.indexOf('now') >= 0) {
+          return date.replace('now', 'now()').replace('-', ' - ');
+        }
+        date = kbn.parseDate(date);
       }
       }
 
 
       return to_utc_epoch_seconds(date);
       return to_utc_epoch_seconds(date);

public/test/specs/kbn-format-specs.js

@@ -97,6 +97,13 @@ define([
       expect(date.getTime()).to.equal(new Date(2014, 1, 3).getTime());
       expect(date.getTime()).to.equal(new Date(2014, 1, 3).getTime());
     });
     });
 
 
+    it('should handle today', function() {
+      var date = kbn.parseDate('today');
+      var today = new Date();
+      today.setHours(0,0,0,0);
+      expect(date.getTime()).to.equal(today.getTime());
+    });
+
     it('should handle multiple math expressions', function() {
     it('should handle multiple math expressions', function() {
       var date = kbn.parseDateMath('-2d-6h', new Date(2014, 1, 5));
       var date = kbn.parseDateMath('-2d-6h', new Date(2014, 1, 5));
       expect(date.toString()).to.equal(new Date(2014, 1, 2, 18).toString());
       expect(date.toString()).to.equal(new Date(2014, 1, 2, 18).toString());