Skip to content
This repository has been archived by the owner on Mar 31, 2024. It is now read-only.

Commit

Permalink
Merge branch 'TimefilterAutoRefresh' of github.com:grouma/kibana into…
Browse files Browse the repository at this point in the history 
… segment_in_courier
  • Loading branch information
Spencer Alger committed Dec 16, 2014
2 parents c23525a + 67df143 commit eb3d904
Show file tree
Hide file tree
Showing 8 changed files with 260 additions and 121 deletions.
14 changes: 13 additions & 1 deletion src/kibana/components/courier/courier.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
define(function (require) {
var errors = require('errors');

var _ = require('lodash');

require('services/es');
require('services/promises');
require('components/index_patterns/index_patterns');
Expand Down Expand Up @@ -114,6 +115,17 @@ define(function (require) {
throw new Error('Aborting all pending requests failed.');
}
};

// Listen for refreshInterval changes
var $parentScope = $rootScope;
$parentScope.$watch('timefilter.refreshInterval', function () {
var refreshValue = _.deepGet($parentScope, 'timefilter.refreshInterval.value');
if (_.isNumber(refreshValue)) {
self.fetchInterval(refreshValue);
} else {
self.fetchInterval(0);
}
});
}

return new Courier();
Expand Down
26 changes: 25 additions & 1 deletion src/kibana/components/courier/looper/_looper.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,22 @@ define(function (require) {
*/
looper.ms = function (ms) {
_ms = ms;
looper.restart();
if (_ms) {
looper.restart();
} else {
looper.pause();
}
return this;
};

/**
* Cancels the current looper while keeping internal
* state as started
*
* @chainable
*/
looper.pause = function () {
if (_timerId) _timerId = $timeout.cancel(_timerId);
return this;
};

Expand Down Expand Up @@ -97,6 +112,15 @@ define(function (require) {
return !!_started;
};

/**
* Returns the current loop interval
*
* @return {number}
*/
looper.loopInterval = function () {
return _ms;
};

/**
* Wraps _fn so that _fn can be changed
* without rescheduling and schedules
Expand Down
240 changes: 130 additions & 110 deletions src/kibana/components/timepicker/timepicker.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,132 +13,152 @@
padding: 0px 15px;
}

.kbn-refresh-list {
padding: 0px 15px;
}

.kbn-timepicket-alert {
width: 100px;
}
</style>

<div class="row">
<div class="col-md-2">
<ul class="nav nav-pills nav-stacked kbn-timepicker-modes">
<li ng-class="{active: mode=='quick'}"><a ng-click="setMode('quick')" >quick</a></li>
<li ng-class="{active: mode=='relative'}"><a ng-click="setMode('relative')" >relative</a></li>
<li ng-class="{active: mode=='absolute'}"><a ng-click="setMode('absolute')" >absolute</a></li>
</ul>
</div>

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

<div ng-repeat="list in quickLists" class="kbn-timepicker-section">
<ul class="list-unstyled">
<li ng-repeat="option in list"><a ng-click="setQuick(option.from, option.to)" bo-text="option.display"></a></li>
<ul class="nav nav-tabs" role="tablist" ng-init="tab = 'filter'">
<li ng-class="{active:tab== 'filter'}" ><a href ng-click="tab = 'filter'">Time Filter</a></li>
<li ng-class="{active:tab== 'interval'}"><a href ng-click="tab = 'interval'">Refresh Interval</a></li>
</ul>

<div class="tab-content">
<!-- Filters -->
<div ng-show="tab == 'filter'" role="tabpanel" class="tab-pane active">
</br>
<div class="row">
<div class="col-md-2">
<ul class="nav nav-pills nav-stacked kbn-timepicker-modes">
<li ng-class="{active: mode=='quick'}"><a ng-click="setMode('quick')" >quick</a></li>
<li ng-class="{active: mode=='relative'}"><a ng-click="setMode('relative')" >relative</a></li>
<li ng-class="{active: mode=='absolute'}"><a ng-click="setMode('absolute')" >absolute</a></li>
</ul>
</div>

<!-- TODO: Add a section for custom intervals -->
</div>
<div ng-switch-when="relative">

<form
ng-submit="applyRelative()"
class="form-inline"
name="relativeTime">

<div class="kbn-timepicker-section">
<label>
From:
<span ng-show="relative.preview">{{relative.preview}}</span><span ng-hide="relative.preview"><i>Invalid Expression</i></span>
</label><br>
<div class="form-group">
<input type="number" class="form-control" required
ng-model="relative.count"
ng-change="formatRelative()">
</div>
<div class="form-group">
<select class="form-control col-xs-2"
ng-model="relative.unit"
ng-options="opt.value as opt.text for opt in relativeOptions"
ng-change="formatRelative()">
</select>
</div>
<br>
<div class="small">
<input type="checkbox"
ng-model="relative.round"
ng-checked="relative.round"
ng-change="formatRelative()"/> round to the {{units[relative.unit]}}
</div>
<div class="col-md-10">
<div ng-switch on="mode" class="container-fluid">
<div ng-switch-when="quick" bindonce>

</div>
<div ng-repeat="list in quickLists" class="kbn-timepicker-section">
<ul class="list-unstyled">
<li ng-repeat="option in list"><a ng-click="setQuick(option.from, option.to)" bo-text="option.display"></a></li>
</ul>
</div>

<div class="kbn-timepicker-section">
<label>
To: Now
</label><br>
<div class="form-group">
<input type="text" disabled class="form-control" value="Now">
<!-- TODO: Add a section for custom intervals -->
</div>
</div>
<div ng-switch-when="relative">

<form
ng-submit="applyRelative()"
class="form-inline"
name="relativeTime">

<div class="kbn-timepicker-section">
<label>
From:
<span ng-show="relative.preview">{{relative.preview}}</span><span ng-hide="relative.preview"><i>Invalid Expression</i></span>
</label><br>
<div class="form-group">
<input type="number" class="form-control" required
ng-model="relative.count"
ng-change="formatRelative()">
</div>
<div class="form-group">
<select class="form-control col-xs-2"
ng-model="relative.unit"
ng-options="opt.value as opt.text for opt in relativeOptions"
ng-change="formatRelative()">
</select>
</div>
<br>
<div class="small">
<input type="checkbox"
ng-model="relative.round"
ng-checked="relative.round"
ng-change="formatRelative()"/> round to the {{units[relative.unit]}}
</div>

</div>

<div class="kbn-timepicker-section">
<label>
To: Now
</label><br>
<div class="form-group">
<input type="text" disabled class="form-control" value="Now">
</div>
</div>

<div class="kbn-timepicker-section">
<label>&nbsp;</label><br>
<div class="form-group">
<button
type="submit"
class="btn btn-primary kbn-timepicker-go"
ng-disabled="!relative.preview">
Go
</button>
</div>
</div>
</form>

<div class="kbn-timepicker-section">
<label>&nbsp;</label><br>
<div class="form-group">
<button
type="submit"
class="btn btn-primary kbn-timepicker-go"
ng-disabled="!relative.preview">
Go
</button>
</div>
</div>
</form>

</div>

<div ng-switch-when="absolute">

<form name="absoluteTime" ng-submit="applyAbsolute()">

<div class="kbn-timepicker-section">
<div>
<label class="small">From: <span ng-show="!absolute.from"><i>Invalid Date</i></span></label>
<input type="text" required class="form-control" input-datetime="{{format}}" ng-model="absolute.from">
</div>
<div>
<datepicker ng-model="absolute.from" max="absolute.to" show-weeks="false"></datepicker>
</div>
</div>

<div class="kbn-timepicker-section">
<div>
<label class="small">To: <span ng-show="!absolute.to"><i>Invalid Date</i></span></label>
<input type="text" required class="form-control" input-datetime="{{format}}" ng-model="absolute.to">
</div>
<div>
<datepicker ng-model="absolute.to" min="absolute.from" show-weeks="false"></datepicker>
<div ng-switch-when="absolute">

<form name="absoluteTime" ng-submit="applyAbsolute()">

<div class="kbn-timepicker-section">
<div>
<label class="small">From: <span ng-show="!absolute.from"><i>Invalid Date</i></span></label>
<input type="text" required class="form-control" input-datetime="{{format}}" ng-model="absolute.from">
</div>
<div>
<datepicker ng-model="absolute.from" max="absolute.to" show-weeks="false"></datepicker>
</div>
</div>

<div class="kbn-timepicker-section">
<div>
<label class="small">To: <span ng-show="!absolute.to"><i>Invalid Date</i></span></label>
<input type="text" required class="form-control" input-datetime="{{format}}" ng-model="absolute.to">
</div>
<div>
<datepicker ng-model="absolute.to" min="absolute.from" show-weeks="false"></datepicker>
</div>
</div>

<div class="kbn-timepicker-section kbn-timepicker-alert">
<label>&nbsp</label>
<div class="form-group">
<button
class="btn btn-primary kbn-timepicker-go"
ng-disabled="absolute.from > absolute.to || !absolute.from || !absolute.to"
type="submit">
Go
</button>
<span class="small" ng-show="absolute.from > absolute.to"><strong>From</strong> must occur before <strong>To</strong></span>
</div>
</div>
</form>
</div>
</div>

<div class="kbn-timepicker-section kbn-timepicker-alert">
<label>&nbsp;</label>
<div class="form-group">
<button
class="btn btn-primary kbn-timepicker-go"
ng-disabled="absolute.from > absolute.to || !absolute.from || !absolute.to"
type="submit">
Go
</button>
<span class="small" ng-show="absolute.from > absolute.to"><strong>From</strong> must occur before <strong>To</strong></span>
</div>
</div>
</form>


</div>
</div>
</div>
<!-- Refresh Intervals -->
<div ng-show="tab == 'interval'" role="tabpanel" class="tab-pane active">
</br>
<ul class="list-unstyled kbn-refresh-list">
<li ng-repeat="interval in refreshIntervals"><a ng-click="setRefreshInterval(interval)">{{interval.display}}</a></li>
</ul>
</div>
</div>
</div>

</div>
</div>
</div>
22 changes: 20 additions & 2 deletions src/kibana/components/timepicker/timepicker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,14 +9,14 @@ define(function (require) {
require('components/timepicker/quick_ranges');
require('components/timepicker/time_units');


module.directive('kbnTimepicker', function (quickRanges, timeUnits) {
return {
restrict: 'E',
scope: {
from: '=',
to: '=',
mode: '='
mode: '=',
interval: '='
},
template: html,
controller: function ($scope) {
Expand All @@ -33,6 +33,20 @@ define(function (require) {
return _.filter(quickRanges, {section: section});
});

$scope.refreshIntervals = [
{ value : 0, display: 'Off'},
{ value : 5000, display: '5 seconds'},
{ value : 10000, display: '10 seconds'},
{ value : 30000, display: '30 seconds'},
{ value : 60000, display: '1 minute'},
{ value : 300000, display: '5 minutes'},
{ value : 900000, display: '15 minutes'},
{ value : 1800000, display: '30 minutes'},
{ value : 3600000, display: '1 hour'},
{ value : 7200000, display: '2 hour'},
{ value : 86400000, display: '1 day'}
];

$scope.relative = {
count: 1,
unit: 'm',
Expand Down Expand Up @@ -131,6 +145,10 @@ define(function (require) {
$scope.to = moment($scope.absolute.to);
};

$scope.setRefreshInterval = function (interval) {
$scope.interval = interval;
};

init();
}
};
Expand Down
3 changes: 2 additions & 1 deletion src/kibana/plugins/kibana/_timepicker.html
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
<kbn-timepicker
from="timefilter.time.from"
to="timefilter.time.to"
mode="timefilter.time.mode">
mode="timefilter.time.mode"
interval="timefilter.refreshInterval">
</kbn-timepicker>
1 change: 1 addition & 0 deletions src/kibana/plugins/kibana/_timepicker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ define(function (require) {

$scope.notifList = notify._notifs;
$scope.timefilter = timefilter;
$scope.timefilter.refreshInterval = { value : 0, display: 'Off'};

$scope.$listen(timefilter, 'update', function (newVal, oldVal) {
globalState.time = _.clone(timefilter.time);
Expand Down
Loading

0 comments on commit eb3d904

Please sign in to comment.