Skip to content

Commit

Permalink
Merge pull request #121 from rashidkpc/rashidkpc-refactor-quick-timep…
Browse files Browse the repository at this point in the history 
…icker

Create a single point of truth for durations and their descriptions
  • Loading branch information
Rashid Khan committed Jun 10, 2014
2 parents ebeddff + 81db557 commit 3674c82
Show file tree
Hide file tree
Showing 7 changed files with 54 additions and 91 deletions.
2 changes: 1 addition & 1 deletion src/kibana/apps/discover/controllers/discover.js
View file
Expand Up @@ -10,7 +10,7 @@ define(function (require) {
var datemath = require('utils/datemath');

require('notify/notify');
require('directives/timepicker');
require('components/timepicker/timepicker');
require('directives/fixed_scroll');
require('filters/moment');
require('courier/courier');
Expand Down
2 changes: 1 addition & 1 deletion src/kibana/apps/discover/controllers/table.js
View file
Expand Up @@ -10,7 +10,7 @@ define(function (require) {
var datemath = require('utils/datemath');

require('notify/notify');
require('directives/timepicker');
require('components/timepicker/timepicker');
require('directives/fixed_scroll');
require('filters/moment');
require('courier/courier');
Expand Down
1 change: 1 addition & 0 deletions src/kibana/apps/visualize/saved_visualizations/bucket_aggs/terms.js
View file
Expand Up @@ -23,6 +23,7 @@ define(function (require) {
],
default: 'desc',
write: function (selection, output) {
// TODO: We need more just _count here.
output.aggParams.order = { _count: selection.val };
}
}
Expand Down
31 changes: 31 additions & 0 deletions src/kibana/components/timepicker/quick_ranges.js
View file
@@ -0,0 +1,31 @@
define(function (require) {
var module = require('modules').get('kibana/constants');

module.constant('quickRanges', [
{ from: 'now/d', to: 'now/d', display: 'Today', section: 0 },
{ from: 'now/w', to: 'now/w', display: 'This week', section: 0 },
{ from: 'now/M', to: 'now/M', display: 'This month', section: 0 },
{ from: 'now/y', to: 'now/y', display: 'This year', section: 0 },
{ from: 'now/d', to: 'now', display: 'The day so far', section: 0 },
{ from: 'now/w', to: 'now', display: 'Week to date', section: 0 },
{ from: 'now/M', to: 'now', display: 'Month to date', section: 0 },
{ from: 'now/y', to: 'now', display: 'Year to date', section: 0 },

{ from: 'now-1d/d', to: 'now-1d/d', display: 'Yesterday', section: 1 },
{ from: 'now-2d/d', to: 'now-2d/d', display: 'Day before yesterday', section: 1 },
{ from: 'now-7d/d', to: 'now-7d/d', display: 'This day last week', section: 1 },
{ from: 'now-1w/w', to: 'now-1w/w', display: 'Last week', section: 1 },
{ from: 'now-1M/M', to: 'now-1M/M', display: 'Last month', section: 1 },
{ from: 'now-1y/y', to: 'now-1y/y', display: 'Last year', section: 1 },

{ from: 'now-15m', to: 'now', display: 'Last 15 minutes', section: 2 },
{ from: 'now-30m', to: 'now', display: 'Last 30 minutes', section: 2 },
{ from: 'now-1h', to: 'now', display: 'Last 1 hour', section: 2 },
{ from: 'now-4h', to: 'now', display: 'Last 4 hours', section: 2 },
{ from: 'now-12h', to: 'now', display: 'Last 12 hours', section: 2 },
{ from: 'now-24h', to: 'now', display: 'Last 24 hours', section: 2 },
{ from: 'now-7d', to: 'now', display: 'Last 7 days', section: 2 },
{ from: 'now-30d', to: 'now', display: 'Last 30 days', section: 2 },
]);

});
61 changes: 4 additions & 57 deletions src/kibana/partials/timepicker.html → ...ana/components/timepicker/timepicker.html
View file
Expand Up @@ -29,42 +29,11 @@

<div class="col-md-10">
<div ng-switch on="mode" class="container-fluid">
<div ng-switch-when="quick">
<div ng-switch-when="quick" bindonce>

<div class="kbn-timepicker-section">
<ul class="list-unstyled">
<li><a ng-click="setQuick('now/d', 'now/d')">Today</a></li>
<li><a ng-click="setQuick('now/w', 'now/w')">This week</a></li>
<li><a ng-click="setQuick('now/M', 'now/M')">This month</a></li>
<li><a ng-click="setQuick('now/y', 'now/y')">This year</a></li>
<li><a ng-click="setQuick('now/d', 'now')">The day so far</a></li>
<li><a ng-click="setQuick('now/w', 'now')">Week to date</a></li>
<li><a ng-click="setQuick('now/M', 'now')">Month to date</a></li>
<li><a ng-click="setQuick('now/y', 'now')">Year to date</a></li>
</ul>
</div>

<div class="kbn-timepicker-section">
<div ng-repeat="list in quickLists" class="kbn-timepicker-section">
<ul class="list-unstyled">
<li><a ng-click="setQuick('now-1d/d', 'now-1d/d')">Yesterday</a></li>
<li><a ng-click="setQuick('now-2d/d', 'now-2d/d')">Day before yesterday</a></li>
<li><a ng-click="setQuick('now-7d/d', 'now-7d/d')">This day last week</a></li>
<li><a ng-click="setQuick('now-1w/w', 'now-1w/w')">Last week</a></li>
<li><a ng-click="setQuick('now-1M/M', 'now-1M/M')">Last month</a></li>
<li><a ng-click="setQuick('now-1y/y', 'now-1y/y')">Last year</a></li>
</ul>
</div>

<div class="kbn-timepicker-section">
<ul class="list-unstyled">
<li><a ng-click="setQuick('now-15m', 'now')">Last 15 minutes</a></li>
<li><a ng-click="setQuick('now-30m', 'now')">Last 30 minutes</a></li>
<li><a ng-click="setQuick('now-1h', 'now')">Last 1 hour</a></li>
<li><a ng-click="setQuick('now-4h', 'now')">Last 4 hours</a></li>
<li><a ng-click="setQuick('now-12h', 'now')">Last 12 hours</a></li>
<li><a ng-click="setQuick('now-24h', 'now')">Last 24 hours</a></li>
<li><a ng-click="setQuick('now-7d', 'now')">Last 7 days</a></li>
<li><a ng-click="setQuick('now-30d', 'now')">Last 30 days</a></li>
<li ng-repeat="option in list"><a ng-click="setQuick(option.from, option.to)" bo-text="option.display"></a></li>
</ul>
</div>

Expand Down Expand Up @@ -164,26 +133,4 @@
</div>

</div>
</div>


<!-- <div class="row">
<div class="timepicker-from col-xs-6 col-md-3">
<center>
<div ng-model="from">
<datepicker max="to" show-weeks="false"></datepicker>
</div>
<br>
</center>
</div>
<div class="timepicker-from col-xs-6 col-md-3">
<center>
<div ng-model="to">
<datepicker min="from" show-weeks="false"></datepicker>
</div>
</center>
</div>
</div>
</div>
-->
</div>
9 changes: 7 additions & 2 deletions src/kibana/directives/timepicker.js → ...ibana/components/timepicker/timepicker.js
View file
@@ -1,14 +1,15 @@
define(function (require) {
var html = require('text!partials/timepicker.html');
var html = require('text!./timepicker.html');
var module = require('modules').get('kibana/directives');
var _ = require('lodash');
var datemath = require('utils/datemath');
var moment = require('moment');

require('directives/input_datetime');
require('./quick_ranges');


module.directive('kbnTimepicker', function () {
module.directive('kbnTimepicker', function (quickRanges) {
return {
restrict: 'E',
scope: {
Expand All @@ -26,6 +27,10 @@ define(function (require) {
$scope.modes = ['quick', 'relative', 'absolute'];
if (_.isUndefined($scope.mode)) $scope.mode = 'quick';

$scope.quickLists = _.map(_.uniq(_.pluck(quickRanges, 'section')), function (section) {
return _.filter(quickRanges, {section: section});
});


$scope.relative = {
count: 1,
Expand Down
39 changes: 9 additions & 30 deletions src/kibana/directives/pretty_duration.js
View file
Expand Up @@ -4,7 +4,9 @@ define(function (require) {
var datemath = require('utils/datemath');
var moment = require('moment');

module.directive('prettyDuration', function (config) {
require('components/timepicker/quick_ranges');

module.directive('prettyDuration', function (config, quickRanges) {
return {
restrict: 'E',
scope: {
Expand All @@ -14,10 +16,15 @@ define(function (require) {
link: function ($scope, $elem) {
var dateFormat = config.get('dateFormat');

var lookupByRange = {};
_.each(quickRanges, function (frame) {
lookupByRange[frame.from + ' to ' + frame.to] = frame;
});

var stringify = function () {
// If both parts are date math, try to look up a reasonable string
if (!moment.isMoment($scope.from) && !moment.isMoment($scope.to)) {
var tryLookup = lookup[$scope.from.toString() + ' to ' + $scope.to.toString()];
var tryLookup = lookupByRange[$scope.from.toString() + ' to ' + $scope.to.toString()];
if (tryLookup) {
$elem.text(tryLookup.display);
} else {
Expand Down Expand Up @@ -46,34 +53,6 @@ define(function (require) {
$elem.text(display.from + ' to ' + display.to);
};

// TODO: Move this to a service so we can share it with the directive?
var lookup = {
'now/d to now/d': { display: 'Today', section: 0 },
'now/w to now/w': { display: 'This week', section: 0 },
'now/M to now/M': { display: 'This month', section: 0 },
'now/y to now/y': { display: 'This year', section: 0 },
'now/d to now': { display: 'The day so far', section: 0 },
'now/w to now': { display: 'Week to date', section: 0 },
'now/M to now': { display: 'Month to date', section: 0 },
'now/y to now': { display: 'Year to date', section: 0 },

'now-1d/d to now-1d/d': { display: 'Yesterday', section: 1 },
'now-2d/d to now-2d/d': { display: 'Day before yesterday', section: 1 },
'now-7d/d to now-7d/d': { display: 'This day last week', section: 1 },
'now-1w/w to now-1w/w': { display: 'Last week', section: 1 },
'now-1M/M to now-1M/M': { display: 'Last month', section: 1 },
'now-1y/y to now-1y/y': { display: 'Last year', section: 1 },

'now-15m to now': { display: 'Last 15 minutes', section: 2 },
'now-30m to now': { display: 'Last 30 minutes', section: 2 },
'now-1h to now': { display: 'Last 1 hour', section: 2 },
'now-4h to now': { display: 'Last 4 hours', section: 2 },
'now-12h to now': { display: 'Last 12 hours', section: 2 },
'now-24h to now': { display: 'Last 24 hours', section: 2 },
'now-7d to now': { display: 'Last 7 days', section: 2 },
'now-30d to now': { display: 'Last 30 days', section: 2 },
};

$scope.$watch('from', stringify);
$scope.$watch('to', stringify);

Expand Down

0 comments on commit 3674c82

Please sign in to comment.