github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

add advanced toggle

Browse source 
show it when there are advanced options
toggle show/hide based on the advanced toggle scope flag
This commit is contained in:
Joe Fleming 2014-10-14 17:05:55 -07:00
parent 9138159d84
commit 6d76e72542
2 changed files with 58 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

62
src/kibana/apps/visualize/editor/agg.js
View file

@ -6,6 +6,7 @@ define(function (require) {
var $ = require('jquery');
var aggTypes = Private(require('components/agg_types/index'));
var aggSelectHtml = require('text!apps/visualize/editor/agg_select.html');
var advancedToggleHtml = require('text!apps/visualize/partials/advanced_toggle.html');
var chosen = require('angular-chosen');
require('apps/visualize/editor/agg_param');
@ -29,6 +30,7 @@ define(function (require) {
link: function ($scope, $el) {
$scope.aggTypeOptions = aggTypes.byType[$scope.groupName];
$scope.editorOpen = $scope.agg.brandNew;
$scope.advancedToggled = false;
$scope.$watchMulti([
'$index',
@ -55,8 +57,8 @@ define(function (require) {
var $aggSelect = $(aggSelectHtml).appendTo($editorContainer);
$compile($aggSelect)($scope);
// params for the selected agg, these are rebuilt every time the agg changes
var $aggParamEditors;
// params for the selected agg, these are rebuilt every time the agg in $aggSelect changes
var $aggParamEditors; // container for agg type param editors
var $aggParamEditorsScope;
$scope.$watch('agg.type', function updateAggParamEditor(newType, oldType) {
if ($aggParamEditors) {
@ -82,22 +84,58 @@ define(function (require) {
if (!type) return;
var editors = type.params.map(function (param, i) {
if (!param.editor) return;
var idx = 0;
var attrs = {
'agg-type': 'agg.type',
'agg-config': 'agg',
'params': 'agg.params'
};
var paramBuilder = function (param) {
// don't show params without an editor
if (!param.editor) {
idx++;
return;
}
attrs['agg-param'] = 'agg.type.params[' + idx + ']';
if (param.advanced) {
attrs['ng-show'] = 'advancedToggled';
}
idx++;
return $('<vis-agg-param-editor>')
.attr({
'agg-type': 'agg.type',
'agg-config': 'agg',
'agg-param': 'agg.type.params[' + i + ']',
'params': 'agg.params'
})
.attr(attrs)
.append(param.editor)
.get(0);
}).filter(Boolean);
};
// process normal paramTypes
var basicParams = _.filter(type.params, function (param) {
return !param.advanced;
});
var paramEditors = basicParams.map(paramBuilder).filter(Boolean);
// process advanced paramTypes
var advancedParams = _.filter(type.params, function (param) {
return !!param.advanced;
});
if (advancedParams.length) {
paramEditors.push($(advancedToggleHtml).get(0));
advancedParams.forEach(function (param) {
// don't show params without an editor
if (!param.editor) return;
var editor = paramBuilder(param);
paramEditors.push(editor);
});
}
$aggParamEditors = $(editors).appendTo($editorContainer);
$aggParamEditorsScope = $scope.$new();
$aggParamEditors = $(paramEditors).appendTo($editorContainer);
$compile($aggParamEditors)($aggParamEditorsScope);
});

8
src/kibana/apps/visualize/partials/advanced_toggle.html Normal file
View file

@ -0,0 +1,8 @@
<div class="advanced-toggle">
<div ng-show="!advancedToggled">
<a ng-click="advancedToggled = !advancedToggled">Advanced Parameters</a>
</div>
<div ng-show="advancedToggled">
<a ng-click="advancedToggled = !advancedToggled">Hide Advanced</a>
</div>
</div>