Просмотр исходного кода

More small table performance improvements

Rashid Khan 12 лет назад
Родитель
Сommit
56e82c0c1b

+ 14 - 11
src/app/panels/table/module.html

@@ -8,26 +8,29 @@
   </style>
 
   <div class="row-fluid">
-    <div ng-class="{'span3':panel.field_list}" ng-if="panel.field_list">
+    <div bindonce ng-class="{'span3':panel.field_list}" ng-if="panel.field_list">
       <div class="sidebar-nav">
         <strong>Fields <i class=" icon-chevron-sign-left pointer " ng-click="panel.field_list = !panel.field_list" bs-tooltip="'Hide field list'" ng-show="panel.field_list"></i></strong><p>
         <div class="small">
-          <span class="link" ng-click="panel.all_fields = true;" ng-class="{strong:panel.all_fields}">All</span> /
-           <span class="link" ng-click="panel.all_fields = false;" ng-class="{strong:!panel.all_fields}">Current</span>
+          <span class="link" ng-click="panel.all_fields = true;" ng-class="{strong:panel.all_fields}">
+            All ({{fields.list.length}})</span><br>
+          <span class="link" ng-click="panel.all_fields = false;" ng-class="{strong:!panel.all_fields}">
+            Current ({{current_fields.length || 0}})</span>
+
         </div>
         <div><input type="text" class="input-medium" placeholder="Type to filter..." ng-model="fieldFilter"></div>
 
         <ul class="unstyled" style="{{panel.overflow}}:{{panel.height || row.height}};overflow-y:auto;overflow-x:hidden;" ng-if="panel.all_fields">
           <li ng-style="panel.style" ng-repeat="field in fields.list|filter:fieldFilter|orderBy:identity">
-            <i class="pointer" ng-class="{'icon-check': _.contains(panel.fields,field),'icon-check-empty': !_.contains(panel.fields,field)}" ng-click="toggle_field(field)"></i>
-            <a class="pointer" data-unique="1" bs-popover="'app/panels/table/micropanel.html'" data-placement="rightTop" ng-click="toggle_micropanel(field,true)" ng-class="{label: _.contains(panel.fields,field)}">{{field}}</a>
+            <i class="pointer" ng-class="{'icon-check': columns[field],'icon-check-empty': _.isUndefined(columns[field])}" ng-click="toggle_field(field)"></i>
+            <a class="pointer" data-unique="1" bs-popover="'app/panels/table/micropanel.html'" data-placement="rightTop" ng-click="toggle_micropanel(field,true)" ng-class="{label: columns[field]}" bo-text="field"></a>
           </li>
         </ul>
 
         <ul class="unstyled" style="{{panel.overflow}}:{{panel.height || row.height}};overflow-y:auto;overflow-x:hidden;" ng-if="!panel.all_fields">
           <li ng-style="panel.style" ng-repeat="field in current_fields|filter:fieldFilter|orderBy:identity">
-            <i class="pointer" ng-class="{'icon-check': _.contains(panel.fields,field),'icon-check-empty': !_.contains(panel.fields,field)}" ng-click="toggle_field(field)"></i>
-            <a class="pointer" data-unique="1" bs-popover="'app/panels/table/micropanel.html'" data-placement="rightTop" ng-click="toggle_micropanel(field,true)" ng-class="{label: _.contains(panel.fields,field)}">{{field}}</a>
+            <i class="pointer" ng-class="{'icon-check': columns[field],'icon-check-empty': _.isUndefined(columns[field])}" ng-click="toggle_field(field)"></i>
+            <a class="pointer" data-unique="1" bs-popover="'app/panels/table/micropanel.html'" data-placement="rightTop" ng-click="toggle_micropanel(field,true)" ng-class="{label: columns[field]}" bo-text="field"></a>
           </li>
         </ul>
 
@@ -84,18 +87,18 @@
                   <th>Value</th>
                 </thead>
                 <tr ng-repeat="(key,value) in event.kibana._source track by $index" ng-class-odd="'odd'">
-                  <td>{{key}}</td>
+                  <td bo-text="key"></td>
                   <td style="white-space:nowrap">
                     <i class='icon-search pointer' ng-click="build_search(key,value)" bs-tooltip="'Add filter to match this value'"></i>
                     <i class='icon-ban-circle pointer' ng-click="build_search(key,value,true)" bs-tooltip="'Add filter to NOT match this value'"></i>
                     <i class="pointer icon-th" ng-click="toggle_field(key)" bs-tooltip="'Toggle table column'"></i>
                   </td>
                   <!-- At some point we need to create a more efficient way of applying the filter pipeline -->
-                  <td style="white-space:pre-wrap" ng-bind-html-unsafe="value|noXml|urlLink|stringify"></td>
+                  <td style="white-space:pre-wrap" bo-html="value|noXml|urlLink|stringify"></td>
                 </tr>
               </table>
-              <pre style="white-space:pre-wrap"  ng-bind-html="without_kibana(event)|tableJson:2" ng-switch-when="json"></pre>
-              <pre ng-bind-html="without_kibana(event)|tableJson:1" ng-switch-when="raw"></pre>
+              <pre style="white-space:pre-wrap"  bo-html="without_kibana(event)|tableJson:2" ng-switch-when="json"></pre>
+              <pre bo-html="without_kibana(event)|tableJson:1" ng-switch-when="raw"></pre>
             </td>
           </tr>
         </tbody>

+ 7 - 0
src/app/panels/table/module.js

@@ -85,6 +85,11 @@ function (angular, app, _, kbn, moment) {
     _.defaults($scope.panel,_d);
 
     $scope.init = function () {
+      $scope.columns = {};
+      _.each($scope.panel.fields,function(field) {
+        $scope.columns[field] = true;
+      });
+
       $scope.Math = Math;
       $scope.identity = angular.identity;
       $scope.$on('refresh',function(){$scope.get_data();});
@@ -159,8 +164,10 @@ function (angular, app, _, kbn, moment) {
     $scope.toggle_field = function(field) {
       if (_.indexOf($scope.panel.fields,field) > -1) {
         $scope.panel.fields = _.without($scope.panel.fields,field);
+        delete $scope.columns[field];
       } else {
         $scope.panel.fields.push(field);
+        $scope.columns[field] = true;
       }
     };
 

+ 11 - 8
src/app/services/fields.js

@@ -14,20 +14,22 @@ function (angular, _, config) {
 
     this.list = ['_type'];
     this.mapping = {};
+    this.fullMapping = {};
 
     $rootScope.$watch(function(){return dashboard.indices;},function(n) {
       if(!_.isUndefined(n) && n.length) {
         // Only get the mapping for indices we don't know it for
-        var indices = _.difference(n,_.keys(self.mapping));
+        var indices = _.difference(n,_.keys(self.fullMapping));
         // Only get the mapping if there are new indices
         if(indices.length > 0) {
           self.map(indices).then(function(result) {
-            self.mapping = _.extend(self.mapping,result);
-            self.list = mapFields(self.mapping);
+            self.fullMapping = _.extend(self.fullMapping,result);
+            self.list = mapFields(self.fullMapping);
           });
         // Otherwise just use the cached mapping
         } else {
-          self.list = mapFields(_.pick(self.mapping,n));
+          // This is inefficient, should not need to reprocess?
+          self.list = mapFields(_.pick(self.fullMapping,n));
         }
       }
     });
@@ -57,12 +59,13 @@ function (angular, _, config) {
         }
       });
 
+      // Flatten the mapping of each index into dot notated keys.
       return request.then(function(p) {
         var mapping = {};
-        _.each(p.data, function(v,k) {
-          mapping[k] = {};
-          _.each(v, function (v,f) {
-            mapping[k][f] = flatten(v);
+        _.each(p.data, function(type,index) {
+          mapping[index] = {};
+          _.each(type, function (fields,typename) {
+            mapping[index][typename] = flatten(fields);
           });
         });
         return mapping;

+ 0 - 1
src/vendor/angular/bindonce.js

@@ -11,7 +11,6 @@
 
  .directive('bindonce', function()
  {
-  console.log('called');
   var toBoolean = function(value)
   {
     if (value && value.length !== 0)