Skip to content

N
nexpie-grafana-theme
Commit 83021709 by Rashid Khan
Options

More efficient loading of setting panels and improved layuout

parent 072eda28
Showing with 359 additions and 303 deletions
src/app/directives/all.js
...@@ -8,5 +8,6 @@ define([ ...@@ -8,5 +8,6 @@ define([
'./ngModelOnBlur', './ngModelOnBlur',
'./tip', './tip',
'./confirmClick', './confirmClick',
'./esVersion' './esVersion',
'./configModal'
], function () {}); ], function () {});
\ No newline at end of file
src/app/directives/configModal.js 0 → 100644
define([
'angular',
'app',
],
function (angular) {
'use strict';
angular
.module('kibana.directives')
.directive('configModal', function($modal,$q) {
return {
restrict: 'A',
link: function(scope, elem) {
// create a new modal. Can't reuse one modal unforunately as the directive will not
// re-render on show.
elem.bind('click',function(){
var panelModal = $modal({
template: './app/partials/paneleditor.html',
persist: true,
show: false,
scope: scope,
keyboard: false
});
// and show it
$q.when(panelModal).then(function(modalEl) {
modalEl.modal('show');
});
scope.$apply();
});
}
};
});
});
\ No newline at end of file
src/app/directives/kibanaPanel.js
...@@ -36,7 +36,7 @@ function (angular) { ...@@ -36,7 +36,7 @@ function (angular) {
'</span>' + '</span>' +
'<span class="row-button extra" ng-show="panel.editable != false">' + '<span class="row-button extra" ng-show="panel.editable != false">' +
'<span bs-modal="\'app/partials/paneleditor.html\'" class="pointer">'+ '<span config-modal class="pointer">'+
'<i class="icon-cog pointer" bs-tooltip="\'Configure\'"></i></span>'+ '<i class="icon-cog pointer" bs-tooltip="\'Configure\'"></i></span>'+
'</span>' + '</span>' +
......
src/app/panels/bettermap/editor.html
<div class="row-fluid"> <div class="editor-row">
<div class="span4"> <div class="editor-option">
<form> <form>
<h6>Coordinate Field <tip>geoJSON array! Long,Lat NOT Lat,Long</tip></h6> <h6>Coordinate Field <tip>geoJSON array! Long,Lat NOT Lat,Long</tip></h6>
<input bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.field"> <input bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.field">
</form> </form>
</div> </div>
<div class="span4"> <div class="editor-option">
<form> <form>
<h6>Tooltip Field</h6> <h6>Tooltip Field</h6>
<input bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.tooltip"> <input bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.tooltip">
</form> </form>
</div> </div>
<div class="span2"><h6>Max Points</h6> <div class="editor-option"><h6>Max Points</h6>
<input type="number" class="input-small" ng-model="panel.size"> <input type="number" class="input-small" ng-model="panel.size">
</div> </div>
</div> </div>
src/app/panels/histogram/editor.html
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
</div> </div>
<div class="editor-option" ng-show="panel.mode != 'count'"> <div class="editor-option" ng-show="panel.mode != 'count'">
<label class="small">Value Field <tip>This field must contain a numeric value</tip></label> <label class="small">Value Field <tip>This field must contain a numeric value</tip></label>
<input ng-change="set_refresh(true)" placeholder="Start typing" bs-typeahead="fields.list" type="text" class="input-large" ng-model="panel.value_field"> <input ng-change="set_refresh(true)" placeholder="Start typing" bs-typeahead="fields.list" type="text" class="input-medium" ng-model="panel.value_field">
</div> </div>
</div> </div>
<div class="section"> <div class="section">
...@@ -23,26 +23,26 @@ ...@@ -23,26 +23,26 @@
<label class="small">Derivative <tip>Plot the change per interval in the series</tip></label><input type="checkbox" ng-model="panel.derivative" ng-checked="panel.derivative" ng-change="set_refresh(true)"> <label class="small">Derivative <tip>Plot the change per interval in the series</tip></label><input type="checkbox" ng-model="panel.derivative" ng-checked="panel.derivative" ng-change="set_refresh(true)">
</div> </div>
</div> </div>
</div> <div class="section">
<h5>Time Options</h5> <h5>Time Options</h5>
<div class="editor-row"> <div class="editor-option">
<div class="editor-option"> <label class="small">Time Field</label>
<label class="small">Time Field</label> <input ng-change="set_refresh(true)" placeholder="Start typing" bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.time_field">
<input ng-change="set_refresh(true)" placeholder="Start typing" bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.time_field"> </div>
</div> <div class="editor-option">
<div class="editor-option"> <label class="small">Time correction</label>
<label class="small">Time correction</label> <select ng-model="panel.timezone" class='input-small' ng-options="f for f in ['browser','utc']"></select>
<select ng-model="panel.timezone" class='input-small' ng-options="f for f in ['browser','utc']"></select> </div>
</div> <div class="editor-option">
<div class="editor-option"> <label class="small">Auto-interval</label><input type="checkbox" ng-model="panel.auto_int" ng-checked="panel.auto_int" />
<label class="small">Auto-interval</label><input type="checkbox" ng-model="panel.auto_int" ng-checked="panel.auto_int" /> </div>
</div> <div class="editor-option" ng-show='panel.auto_int'>
<div class="editor-option" ng-show='panel.auto_int'> <label class="small">Resolution <tip>Shoot for this many data points, rounding to sane intervals</tip></label>
<label class="small">Resolution <tip>Shoot for this many data points, rounding to sane intervals</tip></label> <input type="number" class='input-mini' ng-model="panel.resolution" ng-change='set_refresh(true)'/>
<input type="number" class='input-mini' ng-model="panel.resolution" ng-change='set_refresh(true)'/> </div>
</div> <div class="editor-option" ng-hide='panel.auto_int'>
<div class="editor-option" ng-hide='panel.auto_int'> <label class="small">Interval <tip>Use Elasticsearch date math format (eg 1m, 5m, 1d, 2w, 1y)</tip></label>
<label class="small">Interval <tip>Use Elasticsearch date math format (eg 1m, 5m, 1d, 2w, 1y)</tip></label> <input type="text" class='input-mini' ng-model="panel.interval" ng-change='set_refresh(true)'/>
<input type="text" class='input-mini' ng-model="panel.interval" ng-change='set_refresh(true)'/> </div>
</div> </div>
</div> </div>
\ No newline at end of file
src/app/panels/hits/editor.html
<div> <div class="editor-row">
<div class="row-fluid"> <div class="section">
<div class="span3"> <div class="editor-option">
<label class="small">Style</label> <label class="small">Style</label>
<select class="input-small" ng-model="panel.chart" ng-options="f for f in ['bar','pie','list','total']"></select></span> <select class="input-small" ng-model="panel.chart" ng-options="f for f in ['bar','pie','list','total']"></select></span>
</div> </div>
<div class="span2" ng-show="panel.chart == 'total' || panel.chart == 'list'"> <div class="editor-option" ng-show="panel.chart == 'total' || panel.chart == 'list'">
<label class="small">Font Size</label> <label class="small">Font Size</label>
<select class="input-mini" ng-model="panel.style['font-size']" ng-options="f for f in ['7pt','8pt','9pt','10pt','12pt','14pt','16pt','18pt','20pt','24pt','28pt','32pt','36pt','42pt','48pt','52pt','60pt','72pt']"></select></span> <select class="input-mini" ng-model="panel.style['font-size']" ng-options="f for f in ['7pt','8pt','9pt','10pt','12pt','14pt','16pt','18pt','20pt','24pt','28pt','32pt','36pt','42pt','48pt','52pt','60pt','72pt']"></select></span>
</div> </div>
<div class="span3" ng-show="panel.chart == 'bar' || panel.chart == 'pie'"> <div class="editor-option" ng-show="panel.chart == 'bar' || panel.chart == 'pie'">
<label class="small">Legend</label> <label class="small">Legend</label>
<select class="input-small" ng-model="panel.counter_pos" ng-options="f for f in ['above','below','none']"></select></span> <select class="input-small" ng-model="panel.counter_pos" ng-options="f for f in ['above','below','none']"></select></span>
</div> </div>
<div class="span3" ng-show="panel.chart != 'total' && panel.counter_pos != 'none'"> <div class="editor-option" ng-show="panel.chart != 'total' && panel.counter_pos != 'none'">
<label class="small" >List Format</label> <label class="small" >List Format</label>
<select class="input-small" ng-model="panel.arrangement" ng-options="f for f in ['horizontal','vertical']"></select></span> <select class="input-small" ng-model="panel.arrangement" ng-options="f for f in ['horizontal','vertical']"></select></span>
</div> </div>
<div class="span1" ng-show="panel.chart == 'pie'"> <div class="editor-option" ng-show="panel.chart == 'pie'">
<label class="small">Donut</label><input type="checkbox" ng-model="panel.donut" ng-checked="panel.donut"> <label class="small">Donut</label><input type="checkbox" ng-model="panel.donut" ng-checked="panel.donut">
</div> </div>
<div class="span1" ng-show="panel.chart == 'pie'"> <div class="editor-option" ng-show="panel.chart == 'pie'">
<label class="small">Tilt</label><input type="checkbox" ng-model="panel.tilt" ng-checked="panel.tilt"> <label class="small">Tilt</label><input type="checkbox" ng-model="panel.tilt" ng-checked="panel.tilt">
</div> </div>
<div class="span1" ng-show="panel.chart == 'pie'"> <div class="editor-option" ng-show="panel.chart == 'pie'">
<label class="small">Labels</label><input type="checkbox" ng-model="panel.labels" ng-checked="panel.labels"> <label class="small">Labels</label><input type="checkbox" ng-model="panel.labels" ng-checked="panel.labels">
</div> </div>
</div> </div>
......
src/app/panels/map/editor.html
<div class="row-fluid"> <div class="editor-row">
<div class="span3"> <div class="editor-option">
<form> <form>
<h6>Field <tip>2 letter country or state code</tip></h6> <h6>Field <tip>2 letter country or state code</tip></h6>
<input bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.field" ng-change="set_refresh(true)"> <input bs-typeahead="fields.list" type="text" class="input-small" ng-model="panel.field" ng-change="set_refresh(true)">
</form> </form>
</div> </div>
<div class="span2"> <div class="editor-option">
<h6>Max <tip>Maximum countries to plot</tip></h6> <h6>Max <tip>Maximum countries to plot</tip></h6>
<input class="input-mini" type="number" ng-model="panel.size" ng-change="set_refresh(true)"> <input class="input-mini" type="number" ng-model="panel.size" ng-change="set_refresh(true)">
</div> </div>
<div class="span1"><h6>Map</h6> <div class="editor-option"><h6>Map</h6>
<select ng-change="$emit('render')" class="input-small" ng-model="panel.map" ng-options="f for f in ['world','europe','usa']"></select> <select ng-change="$emit('render')" class="input-small" ng-model="panel.map" ng-options="f for f in ['world','europe','usa']"></select>
</div> </div>
</div> </div>
src/app/panels/pie/editor.html
<div class="row-fluid" ng-switch="panel.mode"> <div class="editor-row" ng-switch="panel.mode">
<div class="row-fluid">
<div class="span2"> <div class="section">
<label class="small">Mode</label> <h5>Mode</h5>
<div class="editor-option">
<label class="small">Mode</label>
<select class="input-small" ng-change="set_mode(panel.mode);set_refresh(true)" ng-model="panel.mode" ng-options="f for f in ['terms','goal']"></select> <select class="input-small" ng-change="set_mode(panel.mode);set_refresh(true)" ng-model="panel.mode" ng-options="f for f in ['terms','goal']"></select>
</div>
</div>
<div ng-switch-when="terms">
<div class="row-fluid">
<div class="span2">
<label class="small">Field</label>
<input type="text" class="input-small" bs-typeahead="fields.list" ng-model="panel.query.field" ng-change="set_refresh(true)">
</div>
<div class="span2">
<label class="small">Length</label>
<input class="input-small" type="number" ng-model="panel.size" ng-change="set_refresh(true)">
</div>
<div class="span6">
<label class="small">Exclude Terms(s) (comma seperated)</label>
<input array-join type="text" ng-model='panel.exclude'></input>
</div>
</div>
</div>
<div ng-switch-when="goal">
<div class="row-fluid">
<div class="span2">
<form style="margin-bottom: 0px">
<label class="small">Goal</label>
<input type="number" style="width:90%" ng-model="panel.query.goal" ng-change="set_refresh(true)">
</form>
</div>
</div> </div>
</div> </div>
</div>
<div class="row-fluid"> <div class="section" ng-switch-when="terms">
<div class="span1"> <h5>Parameters</h5>
<label class="small"> Donut </label><input type="checkbox" ng-model="panel.donut" ng-checked="panel.donut"> <div class="editor-option">
</div> <label class="small">Field</label>
<div class="span1"> <input type="text" class="input-small" bs-typeahead="fields.list" ng-model="panel.query.field" ng-change="set_refresh(true)">
<label class="small"> Tilt </label><input type="checkbox" ng-model="panel.tilt" ng-checked="panel.tilt"> </div>
<div class="editor-option">
<label class="small">Length</label>
<input class="input-mini" type="number" ng-model="panel.size" ng-change="set_refresh(true)">
</div>
<div class="editor-option">
<label class="small">Exclude Terms(s) (comma seperated)</label>
<input array-join type="text" ng-model='panel.exclude'></input>
</div>
</div> </div>
<div class="span1">
<label class="small"> Labels </label><input type="checkbox" ng-model="panel.labels" ng-checked="panel.labels"> <div class="section" ng-switch-when="goal">
<h5>Parameters</h5>
<div class="editor-option">
<form style="margin-bottom: 0px">
<label class="small">Goal</label>
<input type="number" style="width:90%" ng-model="panel.query.goal" ng-change="set_refresh(true)">
</form>
</div>
</div> </div>
<div class="span3">
<label class="small">Legend</label> <div class="section">
<select class="input-small" ng-model="panel.legend" ng-options="f for f in ['above','below','none']"></select></span> <h5>View Options</h5>
<div class="editor-option">
<label class="small"> Donut </label><input type="checkbox" ng-model="panel.donut" ng-checked="panel.donut">
</div>
<div class="editor-option">
<label class="small"> Tilt </label><input type="checkbox" ng-model="panel.tilt" ng-checked="panel.tilt">
</div>
<div class="editor-option">
<label class="small"> Labels </label><input type="checkbox" ng-model="panel.labels" ng-checked="panel.labels">
</div>
<div class="editor-option">
<label class="small">Legend</label>
<select class="input-small" ng-model="panel.legend" ng-options="f for f in ['above','below','none']"></select></span>
</div>
</div> </div>
</div> </div>
\ No newline at end of file
src/app/panels/table/pagination.html
<div class="row-fluid"> <div class="editor-row">
<div class="span3"> <div class="section">
<h6>Show Controls</h6><input type="checkbox" ng-model="panel.paging" ng-checked="panel.paging"> <div class="editor-option">
<h6>Show Controls</h6><input type="checkbox" ng-model="panel.paging" ng-checked="panel.paging">
</div>
<div class="editor-option">
<h6>Overflow</h6>
<select class="input-small" ng-model="panel.overflow" ng-options="f.value as f.key for f in [{key:'scroll',value:'height'},{key:'expand',value:'min-height'}]"></select>
</div>
</div> </div>
<div class="span2">
<h6>Overflow</h6> <div class="section">
<select class="input-small" ng-model="panel.overflow" ng-options="f.value as f.key for f in [{key:'scroll',value:'height'},{key:'expand',value:'min-height'}]"></select> <div class="editor-option">
</div> <h6>Per Page</h6>
</div> <input type="number" class="input-mini" ng-model="panel.size" ng-change="get_data()">
<div class="row-fluid"> </div>
<div class="span2"> <div class="editor-option">
<h6>Per Page</h6> <h6>&nbsp;</h6>
<input type="number" class="input-mini" ng-model="panel.size" ng-change="get_data()"> <center><i class='icon-remove'></i><center>
</div> </div>
<div class="span1"> <div class="editor-option">
<h6>&nbsp;</h6> <h6>Page limit</h6>
<center><i class='icon-remove'></i><center> <input type="number" class="input-mini" ng-model="panel.pages" ng-change="get_data()">
</div> </div>
<div class="span2"> <div class="editor-option large">
<h6>Page limit</h6> <h6>Pageable</h6>
<input type="number" class="input-mini" ng-model="panel.pages" ng-change="get_data()"> <strong class="large">= {{panel.size * panel.pages}}</strong>
</div> </div>
<div class="span2 large">
<h6>Pageable</h6>
<strong class="large">= {{panel.size * panel.pages}}</strong>
</div> </div>
</div> </div>
src/app/panels/terms/editor.html
<div class="row-fluid"> <div class="editor-row">
<div class="span2"> <div class="section">
<label class="small">Field</label> <h5>Parameters</h5>
<input type="text" class="input-small" bs-typeahead="fields.list" ng-model="panel.field" ng-change="set_refresh(true)"> <div class="editor-option">
</div> <label class="small">Field</label>
<div class="span2"> <input type="text" class="input-small" bs-typeahead="fields.list" ng-model="panel.field" ng-change="set_refresh(true)">
<label class="small">Length</label> </div>
<input class="input-small" type="number" ng-model="panel.size" ng-change="set_refresh(true)"> <div class="editor-option">
</div> <label class="small">Length</label>
<div class="span3"> <input class="input-small" type="number" ng-model="panel.size" ng-change="set_refresh(true)">
<label class="small">Order</label> </div>
<select class="input-medium" ng-model="panel.order" ng-options="f for f in ['count','term','reverse_count','reverse_term']" ng-change="set_refresh(true)"></select></span> <div class="editor-option">
</div> <label class="small">Order</label>
<div class="span4"> <select class="input-medium" ng-model="panel.order" ng-options="f for f in ['count','term','reverse_count','reverse_term']" ng-change="set_refresh(true)"></select></span>
<label class="small">Exclude Terms(s) (comma seperated)</label> </div>
<input array-join type="text" ng-model='panel.exclude'></input> <div class="editor-option">
<label class="small">Exclude Terms(s) (comma seperated)</label>
<input array-join type="text" ng-model='panel.exclude'></input>
</div>
</div> </div>
</div> </div>
<div class="row-fluid"> <div class="editor-row">
<div class="span2"> <div class="section">
<label class="small">Style</label> <h5>View Options</h5>
<select class="input-small" ng-model="panel.chart" ng-options="f for f in ['bar','pie','table']"></select></span> <div class="editor-option">
</div> <label class="small">Style</label>
<div class="span2" ng-show="panel.chart == 'table'"> <select class="input-small" ng-model="panel.chart" ng-options="f for f in ['bar','pie','table']"></select></span>
<label class="small">Font Size</label> </div>
<select class="input-mini" ng-model="panel.style['font-size']" ng-options="f for f in ['7pt','8pt','9pt','10pt','12pt','14pt','16pt','18pt','20pt','24pt','28pt','32pt','36pt','42pt','48pt','52pt','60pt','72pt']"></select></span> <div class="editor-option" ng-show="panel.chart == 'table'">
</div> <label class="small">Font Size</label>
<div class="span2" ng-show="panel.chart == 'bar' || panel.chart == 'pie'"> <select class="input-mini" ng-model="panel.style['font-size']" ng-options="f for f in ['7pt','8pt','9pt','10pt','12pt','14pt','16pt','18pt','20pt','24pt','28pt','32pt','36pt','42pt','48pt','52pt','60pt','72pt']"></select></span>
<label class="small">Legend</label> </div>
<select class="input-small" ng-model="panel.counter_pos" ng-options="f for f in ['above','below','none']"></select></span> <div class="editor-option" ng-show="panel.chart == 'bar' || panel.chart == 'pie'">
</div> <label class="small">Legend</label>
<div class="span3" ng-show="panel.chart != 'table' && panel.counter_pos != 'none'"> <select class="input-small" ng-model="panel.counter_pos" ng-options="f for f in ['above','below','none']"></select></span>
<label class="small" >Legend Format</label> </div>
<select class="input-small" ng-model="panel.arrangement" ng-options="f for f in ['horizontal','vertical']"></select></span> <div class="editor-option" ng-show="panel.chart != 'table' && panel.counter_pos != 'none'">
</div> <label class="small" >Legend Format</label>
<div class="span1"> <select class="input-small" ng-model="panel.arrangement" ng-options="f for f in ['horizontal','vertical']"></select></span>
<label class="small">Missing</label><input type="checkbox" ng-model="panel.missing" ng-checked="panel.missing"> </div>
</div> <div class="editor-option">
<div class="span1"> <label class="small">Missing</label><input type="checkbox" ng-model="panel.missing" ng-checked="panel.missing">
<label class="small">Other</label><input type="checkbox" ng-model="panel.other" ng-checked="panel.other"> </div>
</div> <div class="editor-option">
<div class="span1" ng-show="panel.chart == 'pie'"> <label class="small">Other</label><input type="checkbox" ng-model="panel.other" ng-checked="panel.other">
<label class="small">Donut</label><input type="checkbox" ng-model="panel.donut" ng-checked="panel.donut"> </div>
</div> <div class="editor-option" ng-show="panel.chart == 'pie'">
<div class="span1" ng-show="panel.chart == 'pie'"> <label class="small">Donut</label><input type="checkbox" ng-model="panel.donut" ng-checked="panel.donut">
<label class="small">Tilt</label><input type="checkbox" ng-model="panel.tilt" ng-checked="panel.tilt"> </div>
</div> <div class="editor-option" ng-show="panel.chart == 'pie'">
<div class="span1" ng-show="panel.chart == 'pie'"> <label class="small">Tilt</label><input type="checkbox" ng-model="panel.tilt" ng-checked="panel.tilt">
<label class="small">Labels</label><input type="checkbox" ng-model="panel.labels" ng-checked="panel.labels"> </div>
<div class="editor-option" ng-show="panel.chart == 'pie'">
<label class="small">Labels</label><input type="checkbox" ng-model="panel.labels" ng-checked="panel.labels">
</div>
</div> </div>
</div> </div>
src/app/partials/dasheditor.html
...@@ -9,155 +9,161 @@ ...@@ -9,155 +9,161 @@
</div> </div>
<div ng-if="editor.index == 0"> <div ng-if="editor.index == 0">
<div class="row-fluid"> <div class="editor-row">
<div class="span4"> <div class="section">
<label class="small">Title</label><input type="text" class="input-large" ng-model='dashboard.current.title'></input> <div class="editor-option">
</div> <label class="small">Title</label><input type="text" class="input-large" ng-model='dashboard.current.title'></input>
<div class="span1"> </div>
<label class="small"> Editable </label><input type="checkbox" ng-model="dashboard.current.editable" ng-checked="dashboard.current.editable" /> <div class="editor-option">
</div> <label class="small">Style</label><select class="input-small" ng-model="dashboard.current.style" ng-options="f for f in ['dark','light']"></select>
<div class="span1"> </div>
<label class="small"> Hints <tip>Show 'Add panel' hints in empty spaces</tip></label><input type="checkbox" ng-model="dashboard.current.panel_hints" ng-checked="dashboard.current.panel_hints" /> <div class="editor-option">
</div> <label class="small"> Editable </label><input type="checkbox" ng-model="dashboard.current.editable" ng-checked="dashboard.current.editable" />
<div class="span3"> </div>
<label class="small">Style</label><select class="input-small" ng-model="dashboard.current.style" ng-options="f for f in ['dark','light']"></select> <div class="editor-option">
<label class="small"> Hints <tip>Show 'Add panel' hints in empty spaces</tip></label><input type="checkbox" ng-model="dashboard.current.panel_hints" ng-checked="dashboard.current.panel_hints" />
</div>
</div> </div>
</div> </div>
</div> </div>
<div ng-if="editor.index == 1"> <div ng-if="editor.index == 1">
<div class="row-fluid"> <div class="editor-row">
<h4>Index Settings</h4> <div class="section">
<div ng-show="dashboard.current.index.interval != 'none'" class="row-fluid"> <h5>Index Settings</h5>
<div class="span12"> <div ng-show="dashboard.current.index.interval != 'none'" class="row-fluid">
<p class="small"> <div class="editor-option">
Time stamped indices use your selected time range to create a list of <p class="small">
indices that match a specified timestamp pattern. This can be very Time stamped indices use your selected time range to create a list of
efficient for some data sets (eg, logs) For example, to match the indices that match a specified timestamp pattern. This can be very
default logstash index pattern you might use efficient for some data sets (eg, logs) For example, to match the
<code>[logstash-]YYYY.MM.DD</code>. The [] in "[logstash-]" are default logstash index pattern you might use
important as they instruct Kibana not to treat those letters as a <code>[logstash-]YYYY.MM.DD</code>. The [] in "[logstash-]" are
pattern. important as they instruct Kibana not to treat those letters as a
Please also note that indices should rollover at midnight <strong>UTC</strong>. pattern.
</p> Please also note that indices should rollover at midnight <strong>UTC</strong>.
<p class="small"> </p>
See <a href="http://momentjs.com/docs/#/displaying/format/">http://momentjs.com/docs/#/displaying/format/</a> <p class="small">
for documentation on date formatting. See <a href="http://momentjs.com/docs/#/displaying/format/">http://momentjs.com/docs/#/displaying/format/</a>
</p> for documentation on date formatting.
</p>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="row-fluid"> <div class="editor-row">
<div class="span2"> <div class="section">
<h6>Timestamping</h6><select class="input-small" ng-model="dashboard.current.index.interval" ng-options="f for f in ['none','hour','day','week','month','year']"></select> <div class="editor-option">
</div> <h6>Timestamping</h6><select class="input-small" ng-model="dashboard.current.index.interval" ng-options="f for f in ['none','hour','day','week','month','year']"></select>
<div class="span4" ng-show="dashboard.current.index.interval != 'none'"> </div>
<h6>Index pattern <small>Absolutes in []</small></h6> <div class="editor-option" ng-show="dashboard.current.index.interval != 'none'">
<input type="text" class="input-medium" ng-model="dashboard.current.index.pattern"> <h6>Index pattern <small>Absolutes in []</small></h6>
</div> <input type="text" class="input-large" ng-model="dashboard.current.index.pattern">
<div class="span2" ng-show="dashboard.current.index.interval != 'none'"> </div>
<h6>Failover <i class="icon-question-sign" bs-tooltip="'If no indices match the pattern, failover to default index *NOT RECOMMENDED*'"></i></h6> <div class="editor-option" ng-show="dashboard.current.index.interval != 'none'">
<input type="checkbox" ng-model="dashboard.current.failover" ng-checked="dashboard.current.failover" /> <h6>Failover <i class="icon-question-sign" bs-tooltip="'If no indices match the pattern, failover to default index *NOT RECOMMENDED*'"></i></h6>
</div> <input type="checkbox" ng-model="dashboard.current.failover" ng-checked="dashboard.current.failover" />
<div class="span4" ng-show="dashboard.current.failover || dashboard.current.index.interval == 'none'"> </div>
<h6>Default Index <small ng-show="dashboard.current.index.interval != 'none'">If index not found</small></h6> <div class="editor-option" ng-show="dashboard.current.failover || dashboard.current.index.interval == 'none'">
<input type="text" class="input-medium" ng-model="dashboard.current.index.default"> <h6>Default Index <small ng-show="dashboard.current.index.interval != 'none'">If index not found</small></h6>
</div> <input type="text" class="input-medium" ng-model="dashboard.current.index.default">
<div class="span2"> </div>
<h6>Preload Fields <i class="icon-question-sign" bs-tooltip="'Preload available fields for the purpose of autocomplete. Turn this off if you have many fields'"></i></h6> <div class="editor-option">
<input type="checkbox" ng-model="dashboard.current.index.warm_fields" ng-checked="dashboard.current.index.warm_fields" /> <h6>Preload Fields <i class="icon-question-sign" bs-tooltip="'Preload available fields for the purpose of autocomplete. Turn this off if you have many fields'"></i></h6>
<input type="checkbox" ng-model="dashboard.current.index.warm_fields" ng-checked="dashboard.current.index.warm_fields" />
</div>
</div> </div>
</div> </div>
</div> </div>
<div ng-if="editor.index == 2"> <div ng-if="editor.index == 2">
<div class="row-fluid"> <div class="row-fluid">
<div class="span12"> <div class="span8">
<table class="table table-condensed table-striped"> <h4>Rows</h4>
<table class="table table-condensed table-bordered">
<thead> <thead>
<th>Title</th> <th width="1%"></th>
<th>Delete</th> <th width="1%"></th>
<th>Move</th> <th width="1%"></th>
<th width="97%">Title</th>
</thead> </thead>
<tr ng-repeat="row in dashboard.current.rows"> <tr ng-repeat="row in dashboard.current.rows">
<td>{{row.title}}</td>
<td><i ng-click="dashboard.current.rows = _.without(dashboard.current.rows,row)" class="pointer icon-remove"></i></td>
<td><i ng-click="_.move(dashboard.current.rows,$index,$index-1)" ng-hide="$first" class="pointer icon-arrow-up"></i></td> <td><i ng-click="_.move(dashboard.current.rows,$index,$index-1)" ng-hide="$first" class="pointer icon-arrow-up"></i></td>
<td><i ng-click="_.move(dashboard.current.rows,$index,$index+1)" ng-hide="$last" class="pointer icon-arrow-down"></i></td> <td><i ng-click="_.move(dashboard.current.rows,$index,$index+1)" ng-hide="$last" class="pointer icon-arrow-down"></i></td>
<td><i ng-click="dashboard.current.rows = _.without(dashboard.current.rows,row)" class="pointer icon-remove"></i></td>
<td>{{row.title}}</td>
</tr> </tr>
</table> </table>
</div> </div>
<div class="span4">
<h4>Add Row</h4>
<label class="small">Title</label>
<input type="text" class="input-medium" ng-model='row.title' placeholder="New row"></input>
<label class="small">Height</label>
<input type="text" class="input-mini" ng-model='row.height'></input>
</div>
</div> </div>
<div class="row-fluid"> <div class="row-fluid">
<form>
<div class="span5">
<label class="small">Title</label>
<input type="text" class="input-large" ng-model='row.title' placeholder="New row"></input>
</div>
<div class="span2">
<label class="small">Height</label>
<input type="text" class="input-mini" ng-model='row.height'></input>
</div>
<div class="span1">
<label class="small"> Editable </label>
<input type="checkbox" ng-model="row.editable" ng-checked="row.editable" />
</div>
</form>
</div>
</div>
<div ng-if="editor.index == 3">
<h5>Pulldowns</h5>
<div class="row-fluid">
<div class="span2" ng-repeat="pulldown in dashboard.current.pulldowns">
<label class="small" style="text-transform:capitalize;">{{pulldown.type}}</label><input type="checkbox" ng-model="pulldown.enable" ng-checked="pulldown.enable">
</div>
<div class="span2" ng-repeat="pulldown in dashboard.current.nav">
<label class="small" style="text-transform:capitalize;">{{pulldown.type}}</label><input type="checkbox" ng-model="pulldown.enable" ng-checked="pulldown.enable">
</div>
</div> </div>
</div> </div>
<div ng-if="editor.index == 3" ng-controller="dashLoader"> <div ng-if="editor.index == 3" ng-controller="dashLoader">
<h5>Save to</h5> <div class="editor-row">
<div class="row-fluid"> <div class="section">
<div class="span2"> <h5>Save to</h5>
<label class="small">Export</label><input type="checkbox" ng-model="dashboard.current.loader.save_local" ng-checked="dashboard.current.loader.save_local"> <div class="editor-option">
</div> <label class="small">Export</label><input type="checkbox" ng-model="dashboard.current.loader.save_local" ng-checked="dashboard.current.loader.save_local">
<div class="span2"> </div>
<label class="small">Browser</label><input type="checkbox" ng-model="dashboard.current.loader.save_default" ng-checked="dashboard.current.loader.save_default"> <div class="editor-option">
</div> <label class="small">Browser</label><input type="checkbox" ng-model="dashboard.current.loader.save_default" ng-checked="dashboard.current.loader.save_default">
<div class="span2"> </div>
<label class="small">Gist <tip>Requires your domain to be OAUTH registered with Github<tip></label><input type="checkbox" ng-model="dashboard.current.loader.save_gist" ng-checked="dashboard.current.loader.save_gist"> <div class="editor-option">
</div> <label class="small">Gist <tip>Requires your domain to be OAUTH registered with Github<tip></label><input type="checkbox" ng-model="dashboard.current.loader.save_gist" ng-checked="dashboard.current.loader.save_gist">
<div class="span2"> </div>
<label class="small">Elasticsearch</label><input type="checkbox" ng-model="dashboard.current.loader.save_elasticsearch" ng-checked="dashboard.current.loader.save_elasticsearch"> <div class="editor-option">
</div> <label class="small">Elasticsearch</label><input type="checkbox" ng-model="dashboard.current.loader.save_elasticsearch" ng-checked="dashboard.current.loader.save_elasticsearch">
</div> </div>
<h5>Load from</h5>
<div class="row-fluid">
<div class="span2">
<label class="small">Local file</label><input type="checkbox" ng-model="dashboard.current.loader.load_local" ng-checked="dashboard.current.loader.load_local">
</div>
<div class="span2">
<label class="small">Gist</label><input type="checkbox" ng-model="dashboard.current.loader.load_gist" ng-checked="dashboard.current.loader.load_gist">
</div> </div>
<div class="span2"> <div class="section">
<label class="small">Elasticsearch</label><input type="checkbox" ng-model="dashboard.current.loader.load_elasticsearch" ng-checked="dashboard.current.loader.load_elasticsearch"> <h5>Load from</h5>
<div class="editor-option">
<label class="small">Local file</label><input type="checkbox" ng-model="dashboard.current.loader.load_local" ng-checked="dashboard.current.loader.load_local">
</div>
<div class="editor-option">
<label class="small">Gist</label><input type="checkbox" ng-model="dashboard.current.loader.load_gist" ng-checked="dashboard.current.loader.load_gist">
</div>
<div class="editor-option">
<label class="small">Elasticsearch</label><input type="checkbox" ng-model="dashboard.current.loader.load_elasticsearch" ng-checked="dashboard.current.loader.load_elasticsearch">
</div>
<div class="editor-option" ng-show="dashboard.current.loader.load.elasticsearch">
<label class="small">ES list size</label><input class="input-mini" type="number" ng-model="dashboard.current.loader.load_elasticsearch_size">
</div>
</div> </div>
<div class="span3" ng-show="dashboard.current.loader.load.elasticsearch"> <div class="section">
<label class="small">ES list size</label><input class="input-mini" type="number" ng-model="dashboard.current.loader.load_elasticsearch_size"> <h5>Sharing</h5>
<div class="editor-option" >
<label class="small">Allow Sharing <tip>Allow generating adhoc links to dashboards</tip></label><input type="checkbox" ng-model="dashboard.current.loader.save_temp" ng-checked="dashboard.current.loader.save_temp">
</div>
<div class="editor-option" ng-show="dashboard.current.loader.save_temp">
<label class="small">TTL <tip>Expire temp urls</tip></label><input type="checkbox" ng-model="dashboard.current.loader.save_temp_ttl_enable">
</div>
<div class="editor-option" ng-show="dashboard.current.loader.save_temp &amp;&amp; dashboard.current.loader.save_temp_ttl_enable">
<label class="small">TTL Duration <tip>Elasticsearch date math, eg: 1m,1d,1w,30d </tip></label><input class="input-small" type="text" ng-model="dashboard.current.loader.save_temp_ttl">
</div>
</div> </div>
</div> </div>
<h5>Sharing</h5> </div>
<div class="row-fluid">
<div class="span2" > <div ng-if="editor.index == 3">
<label class="small">Allow Sharing <tip>Allow generating adhoc links to dashboards</tip></label><input type="checkbox" ng-model="dashboard.current.loader.save_temp" ng-checked="dashboard.current.loader.save_temp"> <div class="editor-row">
</div> <div class="section">
<div class="span2" ng-show="dashboard.current.loader.save_temp"> <h5>Pulldowns</h5>
<label class="small">TTL <tip>Expire temp urls</tip></label><input type="checkbox" ng-model="dashboard.current.loader.save_temp_ttl_enable"> <div class="editor-option" ng-repeat="pulldown in dashboard.current.pulldowns">
</div> <label class="small" style="text-transform:capitalize;">{{pulldown.type}}</label><input type="checkbox" ng-model="pulldown.enable" ng-checked="pulldown.enable">
<div class="span5" ng-show="dashboard.current.loader.save_temp &amp;&amp; dashboard.current.loader.save_temp_ttl_enable"> </div>
<label class="small">TTL Duration <tip>Elasticsearch date math, eg: 1m,1d,1w,30d </tip></label><input class="input-small" type="text" ng-model="dashboard.current.loader.save_temp_ttl"> <div class="editor-option" ng-repeat="pulldown in dashboard.current.nav">
<label class="small" style="text-transform:capitalize;">{{pulldown.type}}</label><input type="checkbox" ng-model="pulldown.enable" ng-checked="pulldown.enable">
</div>
</div> </div>
</div> </div>
</div> </div>
......
src/app/partials/paneladd.html
<div ng-include="'app/partials/panelgeneral.html'"></div> <div ng-include="'app/partials/panelgeneral.html'"></div>
<div ng-include="edit_path(panel.type)"></div> <div ng-include="edit_path(panel.type)"></div>
<div ng-repeat="tab in panelMeta.editorTabs"> <div ng-repeat="tab in panelMeta.editorTabs">
<h4>{{tab.title}}</h4> <h5>{{tab.title}}</h5>
<div ng-include="tab.src"></div> <div ng-include="tab.src"></div>
</div> </div>
\ No newline at end of file
src/app/partials/panelgeneral.html
<div class="row-fluid"> <div class="editor-row">
<div class="span12"> <div class="section">
<strong>{{panelMeta.status}}</strong> // <span ng-bind-html="panelMeta.description"></span> <strong>{{panelMeta.status}}</strong> // <span ng-bind-html="panelMeta.description"></span>
</div> </div>
</div> </div>
<div class="row-fluid"> <div class="editor-row">
<div class="span4"> <div class="section">
<label class="small">Title</label><input type="text" class="input-medium" ng-model='panel.title'></input> <div class="editor-option">
</div> <label class="small">Title</label><input type="text" class="input-medium" ng-model='panel.title'></input>
<div class="span2" ng-hide="panel.sizeable == false"> </div>
<label class="small">Span</label> <select class="input-mini" ng-model="panel.span" ng-options="f for f in [0,1,2,3,4,5,6,7,8,9,10,11,12]"></select> <div class="editor-option" ng-hide="panel.sizeable == false">
</div> <label class="small">Span</label> <select class="input-mini" ng-model="panel.span" ng-options="f for f in [0,1,2,3,4,5,6,7,8,9,10,11,12]"></select>
<div class="span2"> </div>
<label class="small">Editable</label><input type="checkbox" ng-model="panel.editable" ng-checked="panel.editable"> <div class="editor-option">
</div> <label class="small">Editable</label><input type="checkbox" ng-model="panel.editable" ng-checked="panel.editable">
<div class="span2" ng-show="!_.isUndefined(panel.spyable)"> </div>
<label class="small"> <div class="editor-option" ng-show="!_.isUndefined(panel.spyable)">
Inspect <i class="icon-question-sign" bs-tooltip="'Allow query reveal via <i class=icon-eye-open></i>'"></i> <label class="small">
</label> Inspect <i class="icon-question-sign" bs-tooltip="'Allow query reveal via <i class=icon-eye-open></i>'"></i>
<input type="checkbox" ng-model="panel.spyable" ng-checked="panel.spyable"> </label>
<input type="checkbox" ng-model="panel.spyable" ng-checked="panel.spyable">
</div>
</div> </div>
</div> </div>
\ No newline at end of file
src/css/bootstrap.dark.min.css
This source diff could not be displayed because it is too large. You can view the blob instead.
src/css/bootstrap.light.min.css
This source diff could not be displayed because it is too large. You can view the blob instead.
src/vendor/bootstrap/less/modals.less
...@@ -22,17 +22,10 @@ ...@@ -22,17 +22,10 @@
// Base modal // Base modal
.modal { .modal {
position: fixed; position: absolute;
top: 10%;
left: 50%;
z-index: @zindexModal; z-index: @zindexModal;
width: 560px; width: 100%;
margin-left: -280px;
background-color: @white; background-color: @white;
border: 1px solid #999;
border: 1px solid rgba(0,0,0,.3);
*border: 1px solid #999; /* IE6-7 */
.border-radius(6px);
.box-shadow(0 3px 7px rgba(0,0,0,0.3)); .box-shadow(0 3px 7px rgba(0,0,0,0.3));
.background-clip(padding-box); .background-clip(padding-box);
// Remove focus outline from opened modal // Remove focus outline from opened modal
...@@ -60,7 +53,7 @@ ...@@ -60,7 +53,7 @@
.modal-body { .modal-body {
position: relative; position: relative;
overflow-y: auto; overflow-y: auto;
max-height: 400px; max-height: 700px;
padding: 15px; padding: 15px;
} }
// Remove bottom margin if need be // Remove bottom margin if need be
...@@ -75,7 +68,6 @@ ...@@ -75,7 +68,6 @@
text-align: right; // right align buttons text-align: right; // right align buttons
background-color: #f5f5f5; background-color: #f5f5f5;
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
.border-radius(0 0 6px 6px);
.box-shadow(inset 0 1px 0 @white); .box-shadow(inset 0 1px 0 @white);
.clearfix(); // clear it in case folks use .pull-* classes on buttons .clearfix(); // clear it in case folks use .pull-* classes on buttons
......
src/vendor/bootstrap/less/overrides.less
...@@ -210,9 +210,8 @@ form input.ng-invalid { ...@@ -210,9 +210,8 @@ form input.ng-invalid {
} }
.modal { .modal {
width: 770px; width: 100%;
margin-left: -385px; top: 0px !important;
top: 10px !important;
} }
.tiny { .tiny {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment