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**
 - [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)

public/app/panels/timepicker/module.html

@@ -20,7 +20,7 @@
 
 			<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>
 					<span ng-bind="time.rangeString"></span>
 					<span ng-show="dashboard.refresh" class="text-warning">refreshed every {{dashboard.refresh}} </span>
@@ -28,9 +28,8 @@
 				</a>
 
 				<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>
 
           <!-- 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() {
       // Assume the form is valid since we're setting it to something valid
       $scope.input.$setValidity("dummy", true);
@@ -135,9 +151,6 @@ function (angular, app, _, moment, kbn) {
         _filter.to = "now";
       }
 
-      // Set the filter
-      $scope.panel.filter_id = timeSrv.setTime(_filter);
-
       // Update our representation
       $scope.time = getScopeTimeObj(time.from,time.to);
     };
@@ -145,18 +158,15 @@ function (angular, app, _, moment, kbn) {
     $scope.setRelativeFilter = function(timespan) {
       $scope.panel.now = true;
 
-      var _filter = {
-        from : "now-"+timespan,
-        to: "now"
-      };
+      var range = {from: timespan.from, to: timespan.to};
 
       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) {
@@ -177,7 +187,7 @@ function (angular, app, _, moment, kbn) {
     };
 
     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) {
         model.tooltip = $scope.dashboard.formatDate(model.from.date) + ' <br>to<br>';
@@ -189,9 +199,13 @@ function (angular, app, _, moment, kbn) {
 
       if (timeSrv.time) {
         if ($scope.panel.now) {
+          if (timeSrv.time.from === 'today') {
+            model.rangeString = 'Today';
+          } else {
             model.rangeString = moment(model.from.date).fromNow() + ' to ' +
               moment(model.to.date).fromNow();
           }
+        }
         else {
           model.rangeString = $scope.dashboard.formatDate(model.from.date, 'MMM D, YYYY HH:mm:ss') + ' to ' +
             $scope.dashboard.formatDate(model.to.date, 'MMM D, YYYY HH:mm:ss');

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

@@ -186,8 +186,11 @@ function (angular, _, kbn, InfluxSeries, InfluxQueryBuilder) {
 
     function getInfluxTime(date) {
       if (_.isString(date)) {
+        if (date.indexOf('now') >= 0) {
           return date.replace('now', 'now()').replace('-', ' - ');
         }
+        date = kbn.parseDate(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());
     });
 
+    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() {
       var date = kbn.parseDateMath('-2d-6h', new Date(2014, 1, 5));
       expect(date.toString()).to.equal(new Date(2014, 1, 2, 18).toString());