mirror of
https://github.com/elastic/kibana.git
synced 2025-04-23 17:28:26 -04:00
Add a pause button to the header when auto-refresh is enabled
This commit is contained in:
parent
1055e92ded
commit
3d900ecf18
10 changed files with 44 additions and 24 deletions
|
@ -118,9 +118,10 @@ define(function (require) {
|
|||
};
|
||||
|
||||
// Listen for refreshInterval changes
|
||||
$rootScope.$watch('timefilter.refreshInterval', function () {
|
||||
$rootScope.$watchCollection('timefilter.refreshInterval', function () {
|
||||
var refreshValue = _.deepGet($rootScope, 'timefilter.refreshInterval.value');
|
||||
if (_.isNumber(refreshValue)) {
|
||||
var refreshPause = _.deepGet($rootScope, 'timefilter.refreshInterval.pause');
|
||||
if (_.isNumber(refreshValue) && !refreshPause) {
|
||||
self.fetchInterval(refreshValue);
|
||||
} else {
|
||||
self.fetchInterval(0);
|
||||
|
|
|
@ -137,6 +137,7 @@ define(function (require) {
|
|||
};
|
||||
|
||||
$scope.setRefreshInterval = function (interval) {
|
||||
interval.pause = false;
|
||||
$scope.interval = interval;
|
||||
};
|
||||
|
||||
|
|
|
@ -94,7 +94,7 @@ define(function (require) {
|
|||
|
||||
timefilter.enabled = true;
|
||||
$scope.timefilter = timefilter;
|
||||
$scope.$listen(timefilter, 'update', $scope.refresh);
|
||||
$scope.$listen(timefilter, 'fetch', $scope.refresh);
|
||||
|
||||
courier.setRootSearchSource(dash.searchSource);
|
||||
|
||||
|
|
|
@ -150,7 +150,7 @@ define(function (require) {
|
|||
|
||||
$scope.updateDataSource()
|
||||
.then(function () {
|
||||
$scope.$listen(timefilter, 'update', function () {
|
||||
$scope.$listen(timefilter, 'fetch', function () {
|
||||
$scope.fetch();
|
||||
});
|
||||
|
||||
|
|
|
@ -21,5 +21,8 @@ define(function (require) {
|
|||
}
|
||||
};
|
||||
|
||||
$scope.toggleRefresh = function () {
|
||||
timefilter.refreshInterval.pause = !timefilter.refreshInterval.pause;
|
||||
};
|
||||
};
|
||||
});
|
|
@ -22,23 +22,34 @@
|
|||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="nav navbar-nav navbar-right navbar-timepicker">
|
||||
<li ng-show="httpActive.length" class="navbar-text hidden-xs">
|
||||
<div class="spinner"></div>
|
||||
<ul ng-if="setupComplete" ng-show="timefilter.enabled" class="nav navbar-nav navbar-right navbar-timepicker">
|
||||
<li>
|
||||
<a ng-click="toggleTimepicker()"
|
||||
ng-show="timefilter.refreshInterval.value > 0"
|
||||
class="navbar-timepicker-auto-refresh-desc">
|
||||
{{timefilter.refreshInterval.display}}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li ng-if="setupComplete" ng-show="timefilter.enabled" class="navbar-timepicker-container">
|
||||
<a ng-click="toggleTimepicker()" aria-haspopup="true" aria-expanded="false">
|
||||
<span ng-show="timefilter.refreshInterval.value > 0" class="navbar-timepicker-auto-refresh-desc">
|
||||
{{timefilter.refreshInterval.display}}
|
||||
<i aria-hidden="true" class="fa fa-rotate-right"></i>
|
||||
</span>
|
||||
<span class="navbar-timepicker-timefilter-desc">
|
||||
<pretty-duration from="timefilter.time.from" to="timefilter.time.to"></pretty-duration>
|
||||
<i aria-hidden="true" class="fa fa-clock-o"></i>
|
||||
</span>
|
||||
<li>
|
||||
<a ng-click="toggleRefresh()"
|
||||
ng-show="timefilter.refreshInterval.value > 0">
|
||||
<i class="fa" ng-class="timefilter.refreshInterval.pause ? 'fa-play' : 'fa-pause'"></i>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a ng-click="toggleTimepicker()" aria-haspopup="true" aria-expanded="false" class="navbar-timepicker-time-desc">
|
||||
<pretty-duration from="timefilter.time.from" to="timefilter.time.to"></pretty-duration>
|
||||
<i aria-hidden="true" class="fa fa-clock-o"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="nav navbar-nav navbar-right navbar-timepicker" >
|
||||
<li ng-show="httpActive.length" class="navbar-text hidden-xs">
|
||||
<div class="spinner"></div>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- /Full navbar -->
|
||||
</div>
|
||||
|
|
|
@ -194,7 +194,7 @@ define(function (require) {
|
|||
// Without this manual emission, we'd miss filters and queries that were on the $state initially
|
||||
$state.emit('fetch_with_changes');
|
||||
|
||||
$scope.$listen(timefilter, 'update', _.bindKey($scope, 'fetch'));
|
||||
$scope.$listen(timefilter, 'fetch', _.bindKey($scope, 'fetch'));
|
||||
|
||||
$scope.$on('ready:vis', function () {
|
||||
$scope.$emit('application.load');
|
||||
|
|
|
@ -32,6 +32,7 @@ define(function (require) {
|
|||
|
||||
var refreshIntervalDefaults = {
|
||||
display: 'Off',
|
||||
pause: false,
|
||||
section: 0,
|
||||
value: 0
|
||||
};
|
||||
|
@ -61,6 +62,7 @@ define(function (require) {
|
|||
'$$timefilter.time.mode',
|
||||
'$$timefilter.time',
|
||||
'$$timefilter.refreshInterval',
|
||||
'$$timefilter.refreshInterval.pause',
|
||||
'$$timefilter.refreshInterval.value'
|
||||
], (function () {
|
||||
var oldTime;
|
||||
|
@ -69,6 +71,10 @@ define(function (require) {
|
|||
return function () {
|
||||
if (diff(self.time, oldTime) || diff(self.refreshInterval, oldRefreshInterval)) {
|
||||
self.emit('update');
|
||||
if (!self.refreshInterval.pause) {
|
||||
self.emit('fetch');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
oldTime = _.clone(self.time);
|
||||
|
|
|
@ -258,12 +258,9 @@ notifications {
|
|||
}
|
||||
|
||||
.navbar-timepicker {
|
||||
&-auto-refresh-desc {
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
&-timefilter-desc {
|
||||
|
||||
> li > a {
|
||||
padding-left: 7px !important;
|
||||
padding-right: 7px !important;
|
||||
}
|
||||
|
||||
.fa {
|
||||
|
|
|
@ -13,6 +13,7 @@ define(function (require) {
|
|||
valueOf(rangeA.to) !== valueOf(rangeB.to)
|
||||
|| valueOf(rangeA.from) !== valueOf(rangeB.from)
|
||||
|| valueOf(rangeA.value) !== valueOf(rangeB.value)
|
||||
|| valueOf(rangeA.pause) !== valueOf(rangeB.pause)
|
||||
) {
|
||||
return true;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue