Commit 514ef4b6 by Rashid Khan

added truncation configuration to table panel

parent 0a4bd071
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<div class="span1"> <label class="small">Lines</label><input type="checkbox" ng-model="panel.lines" ng-checked="panel.lines"></div> <div class="span1"> <label class="small">Lines</label><input type="checkbox" ng-model="panel.lines" ng-checked="panel.lines"></div>
<div class="span1"> <label class="small">Points</label><input type="checkbox" ng-model="panel.points" ng-checked="panel.points"></div> <div class="span1"> <label class="small">Points</label><input type="checkbox" ng-model="panel.points" ng-checked="panel.points"></div>
<div class="span1"> <label class="small">Stack</label><input type="checkbox" ng-model="panel.stack" ng-checked="panel.stack"></div> <div class="span1"> <label class="small">Stack</label><input type="checkbox" ng-model="panel.stack" ng-checked="panel.stack"></div>
<div class="span1" ng-show="panel.stack"> <label class="small" bs-tooltip="'Stack as a percentage of total'">Percent</label><input type="checkbox" ng-model="panel.percentage" ng-checked="panel.percentage"></div> <!--<div class="span1" ng-show="panel.stack"> <label class="small" bs-tooltip="'Stack as a percentage of total'">Percent</label><input type="checkbox" ng-model="panel.percentage" ng-checked="panel.percentage"></div>-->
<div class="span1"> <label class="small">Legend</label><input type="checkbox" ng-model="panel.legend" ng-checked="panel.legend"></div> <div class="span1"> <label class="small">Legend</label><input type="checkbox" ng-model="panel.legend" ng-checked="panel.legend"></div>
<div class="span1"> <label class="small">xAxis</label><input type="checkbox" ng-model="panel['x-axis']" ng-checked="panel['x-axis']"></div> <div class="span1"> <label class="small">xAxis</label><input type="checkbox" ng-model="panel['x-axis']" ng-checked="panel['x-axis']"></div>
<div class="span1"> <label class="small">yAxis</label><input type="checkbox" ng-model="panel['y-axis']" ng-checked="panel['y-axis']"></div> <div class="span1"> <label class="small">yAxis</label><input type="checkbox" ng-model="panel['y-axis']" ng-checked="panel['y-axis']"></div>
......
...@@ -306,7 +306,7 @@ angular.module('kibana.histogram', []) ...@@ -306,7 +306,7 @@ angular.module('kibana.histogram', [])
var options = { var options = {
legend: { show: false }, legend: { show: false },
series: { series: {
stackpercent: scope.panel.stack ? scope.panel.percentage : false, //stackpercent: scope.panel.stack ? scope.panel.percentage : false,
stack: scope.panel.percentage ? null : stack, stack: scope.panel.percentage ? null : stack,
lines: { lines: {
show: scope.panel.lines, show: scope.panel.lines,
......
...@@ -32,18 +32,22 @@ ...@@ -32,18 +32,22 @@
<div class="span1"> <div class="span1">
<h6>Sorting</h6><input type="checkbox" ng-model="panel.sortable" ng-checked="panel.sortable"> <h6>Sorting</h6><input type="checkbox" ng-model="panel.sortable" ng-checked="panel.sortable">
</div> </div>
<div class="span4" style="white-space:nowrap" ng-show='panel.sortable'> <div class="span3" style="white-space:nowrap" ng-show='panel.sortable'>
<h6>Sort</h6> <h6>Sort</h6>
<input ng-show="all_fields.length<=0 || !all_fields"style="width:85%" ng-model="panel.sort[0]" type="text"></input> <input ng-show="all_fields.length<=0 || !all_fields"style="width:85%" ng-model="panel.sort[0]" type="text"></input>
<select ng-show="all_fields.length>0"style="width:85%" ng-model="panel.sort[0]" ng-options="f for f in all_fields"></select> <select ng-show="all_fields.length>0"style="width:85%" ng-model="panel.sort[0]" ng-options="f for f in all_fields"></select>
<i ng-click="set_sort(panel.sort[0])" ng-class="{'icon-chevron-up': panel.sort[1] == 'asc','icon-chevron-down': panel.sort[1] == 'desc'}"></i> <i ng-click="set_sort(panel.sort[0])" ng-class="{'icon-chevron-up': panel.sort[1] == 'asc','icon-chevron-down': panel.sort[1] == 'desc'}"></i>
</div> </div>
<div class="span3"><h6>Font Size</h6> <div class="span2"><h6>Font Size</h6>
<select class="input-small" 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-small" 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="span2"> <div class="span2">
<h6>Page Control</h6><input type="checkbox" ng-model="panel.paging" ng-checked="panel.paging"> <h6>Page Control</h6><input type="checkbox" ng-model="panel.paging" ng-checked="panel.paging">
</div> </div>
<div class="span2">
<h6>Trim Factor <i class="icon-question-sign" bs-tooltip="'Trim fields to this long divided by # of rows'"></i></h6>
<input type="number" class="input-small" ng-model="panel.trimFactor">
</div>
</div> </div>
<h5>Paging</h5> <h5>Paging</h5>
<div class="row-fluid"> <div class="row-fluid">
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
</thead> </thead>
<tbody> <tbody>
<tr ng-repeat='field in micropanel.values'> <tr ng-repeat='field in micropanel.values'>
<td>{{{true: "__blank__",false:field[0]}[field[0] == ""]}}</td> <td>{{{true: "__blank__",false:field[0]}[field[0] == ""]|tableTruncate:panel.trimFactor:3}}</td>
<td> <td>
<i class="pointer icon-search" ng-click="build_search(micropanel.field,field[0]);dismiss();"></i> <i class="pointer icon-search" ng-click="build_search(micropanel.field,field[0]);dismiss();"></i>
<i class="pointer icon-ban-circle" ng-click="build_search(micropanel.field,field[0],true);dismiss();"></i> <i class="pointer icon-ban-circle" ng-click="build_search(micropanel.field,field[0],true);dismiss();"></i>
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
.table-doc-table { .table-doc-table {
margin-left: 0px !important; margin-left: 0px !important;
overflow-y: auto; overflow-y: auto;
overflow-x: auto; overflow-x: scroll;
} }
</style> </style>
...@@ -57,7 +57,7 @@ ...@@ -57,7 +57,7 @@
</thead> </thead>
<tbody ng-repeat="row in data | slice:panel.offset:panel.offset+panel.size" ng-class-odd="'odd'"> <tbody ng-repeat="row in data | slice:panel.offset:panel.offset+panel.size" ng-class-odd="'odd'">
<tr ng-click="toggle_details(row)" class="pointer"> <tr ng-click="toggle_details(row)" class="pointer">
<td ng-repeat="field in panel.fields" ng-bind-html-unsafe="(row.highlight[field]||row._source[field]) | highlight"></td> <td ng-repeat="field in panel.fields" ng-bind-html-unsafe="(row.highlight[field]||row._source[field]) | tableHighlight | tableTruncate:panel.trimFactor:panel.fields.length"></td>
</tr> </tr>
<tr ng-show="row.kibana.details"> <tr ng-show="row.kibana.details">
<td colspan=1000> <td colspan=1000>
......
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
* fields :: columns to show in table * fields :: columns to show in table
* overflow :: 'height' or 'min-height' controls wether the row will expand (min-height) to * overflow :: 'height' or 'min-height' controls wether the row will expand (min-height) to
to fit the table, or if the table will scroll to fit the row (height) to fit the table, or if the table will scroll to fit the row (height)
* trimFactor :: If line is > this many characters, divided by the number of columns, trim it.
* sortable :: Allow sorting? * sortable :: Allow sorting?
* spyable :: Show the 'eye' icon that reveals the last ES query for this panel * spyable :: Show the 'eye' icon that reveals the last ES query for this panel
...@@ -49,7 +50,8 @@ angular.module('kibana.table', []) ...@@ -49,7 +50,8 @@ angular.module('kibana.table', [])
sortable: true, sortable: true,
header : true, header : true,
paging : true, paging : true,
field_list: true, field_list: true,
trimFactor: 300,
spyable : true spyable : true
}; };
_.defaults($scope.panel,_d); _.defaults($scope.panel,_d);
...@@ -249,7 +251,7 @@ angular.module('kibana.table', []) ...@@ -249,7 +251,7 @@ angular.module('kibana.table', [])
}) })
.filter('highlight', function() { .filter('tableHighlight', function() {
return function(text) { return function(text) {
if (!_.isUndefined(text) && !_.isNull(text) && text.toString().length > 0) { if (!_.isUndefined(text) && !_.isNull(text) && text.toString().length > 0) {
return text.toString(). return text.toString().
...@@ -262,4 +264,12 @@ angular.module('kibana.table', []) ...@@ -262,4 +264,12 @@ angular.module('kibana.table', [])
} }
return ''; return '';
}; };
})
.filter('tableTruncate', function() {
return function(text,length,factor) {
if (!_.isUndefined(text) && !_.isNull(text) && text.toString().length > 0) {
return text.length > length/factor ? text.substr(0,length/factor)+'...' : text;
}
return '';
};
}); });
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