Variety of fixes, see commit

common/css/main.css

@@ -151,3 +151,7 @@
   background-color: #A60000;
 }
 
+.faded {
+  opacity: 0.2;
+}
+

index.html

@@ -13,6 +13,7 @@
 
   <link rel="stylesheet" href="common/css/normalize.min.css">
   <link rel="stylesheet" href="common/css/bootstrap.min.css">
+  <link rel="stylesheet" href="common/css/animate.min.css">
   <link rel="stylesheet" href="common/css/bootstrap-responsive.min.css">
   <link rel="stylesheet" href="common/css/font-awesome.min.css">
   <link rel="stylesheet" href="common/css/main.css">

panels/histogram/module.html

@@ -5,12 +5,13 @@
   <div>
   <span ng-show='panel.zoomlinks && data'>
     <a class='small' ng-click='zoom(0.5)'><i class='icon-zoom-in'></i> Zoom In</a>
-    <a class='small' ng-click='zoom(2)'><i class='icon-zoom-out'></i> Zoom Out</a>
-  </span> | 
+    <a class='small' ng-click='zoom(2)'><i class='icon-zoom-out'></i> Zoom Out</a> | 
+  </span>
   <span ng-show="panel.legend" ng-repeat='series in plot.getData()' style='display:inline-block;padding-right:5px'>
     <div style="display:inline-block;background:{{series.color}};height:10px;width:10px;border-radius:5px;"></div>
     <div class='small' style='display:inline-block'>{{series.label}} ({{series.hits}})</div>
-  </span><span class="small"> per <strong>{{panel.interval}}</strong> | (<strong>{{hits}}</strong> total)</span>
+  </span>
+  <span ng-show="panel.legend" class="small"> per <strong>{{panel.interval}}</strong> | (<strong>{{hits}}</strong> total)</span>
   </div>
   <center><img ng-show='panel.loading && _.isUndefined(data)' src="common/img/load_big.gif"></center>
   <div histogram-chart params="{{panel}}" style="height:{{panel.height || row.height}};position:relative"></div>

panels/table/editor.html

@@ -20,23 +20,29 @@ <h6>Selected fields <small>Click to remove</small></h6>
       <span style="margin-left:3px" ng-click="toggle_field(field)" ng-repeat="field in $parent.panel.fields" class="label remove pointer">{{field}} </span>
     </div>
   </div>
-  <h5>Sorting</h5>
+  <h5>Options</h5>
   <div class="row-fluid">
     <div class="span1"> 
-      <h6>Enable</h6><input type="checkbox" ng-model="panel.sortable" ng-checked="panel.sortable">
+      <h6>Header</h6><input type="checkbox" ng-model="panel.header" ng-checked="panel.header">
+    </div>
+    <div class="span1"> 
+      <h6>Sorting</h6><input type="checkbox" ng-model="panel.sortable" ng-checked="panel.sortable">
     </div>
     <div class="span4" style="white-space:nowrap" ng-show='panel.sortable'>
       <h6>Sort</h6>
       <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>
       <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>
-  <h5>Paging and Appearence</h5>
-  <div class="row-fluid">
     <div class="span3"><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>
     </div>
+    <div class="span2"> 
+      <h6>Page Control</h6><input type="checkbox" ng-model="panel.paging" ng-checked="panel.paging">
+    </div>
+  </div>
+  <h5>Paging</h5>
+  <div class="row-fluid">
     <div class="span2">
       <h6>Per Page</h6>
       <input type="number" class="input-mini" ng-model="panel.size" ng-change="get_data()">

panels/table/module.html

@@ -5,7 +5,7 @@
   </span>
 
   <div style="height:{{panel.height || row.height}};overflow-y:auto;overflow-x:auto">
-    <div class="row-fluid">
+    <div class="row-fluid" ng-show="panel.paging">
       <div class="span1 offset1" style="text-align:right">
         <i ng-click="panel.offset = 0" ng-show="panel.offset > 0" class='icon-circle-arrow-left pointer'></i>
         <i ng-click="panel.offset = (panel.offset - panel.size)" ng-show="panel.offset > 0" class='icon-arrow-left pointer'></i>
@@ -20,7 +20,7 @@
     </div>
     <div class="small" ng-show="panel.fields.length == 0">No columns configured. You may want to add a <strong>fields panel</strong>, or click the edit button in the top right of this panel to add some columns</div>
     <table class="table-hover table table-condensed" ng-style="panel.style">
-      <thead>
+      <thead ng-show="panel.header">
 
         <th style="white-space:nowrap" ng-repeat="field in panel.fields">
           <i ng-show="!$first" class="pointer link icon-caret-left" ng-click="_.move(panel.fields,$index,$index-1)"></i>
@@ -59,7 +59,7 @@
         </tr>
       </tbody>
     </table>
-    <div class="row-fluid">
+    <div class="row-fluid" ng-show="panel.paging">>
       <div class="span1 offset3" style="text-align:right">
         <i ng-click="panel.offset = 0" ng-show="panel.offset > 0" class='icon-circle-arrow-left pointer'></i>
         <i ng-click="panel.offset = (panel.offset - panel.size)" ng-show="panel.offset > 0" class='icon-arrow-left pointer'></i>

panels/table/module.js

@@ -40,7 +40,9 @@ angular.module('kibana.table', [])
     style   : {'font-size': '9pt'},
     fields  : [],
     sortable: true,
-    spyable: true,
+    header  : true,
+    paging  : true, 
+    spyable: true
   }
   _.defaults($scope.panel,_d)
 

panels/timepicker/editor.html

@@ -59,10 +59,10 @@ <h5>Auto-refresh <small>settings</small></h5>
     </div>
     <div class="span2">
       <label class="small"> Interval (seconds) </label>
-      <input type="number" array-join class="input-mini" ng-model="panel.refresh.interval">
+      <input type="number" class="input-mini" ng-model="panel.refresh.interval">
     </div>
     <div class="span3">
       <label class="small"> Minimum Interval (seconds) </label>
-      <input type="number" array-join class="input-mini" ng-model="panel.refresh.min">
+      <input type="number" class="input-mini" ng-model="panel.refresh.min">
     </div>
   </div>