Removing unnecesary watchers from the visualization directive

2024-11-07 02:15:24 +00:00 · 2017-11-29 10:06:13 -05:00 · 2017-11-29 10:06:13 -05:00 · 5e7f74094a
commit 5e7f74094a
parent 05983c9f27
10 changed files with 39 additions and 38 deletions
--- a/public/controllers/overview.js
+++ b/public/controllers/overview.js
@ -23,10 +23,6 @@ app.controller('overviewController', function ($scope, $location, $rootScope, ap
        $rootScope.currentImplicitFilter = "";
    }

-    $scope.hideRing = (items) => {
-        return $(".vis-container").length >= items;
-    };
-
    // Object for matching nav items and Wazuh groups
    let tabFilters = {
        "general": {
--- a/public/kibana-integrations/kibanaDiscoverDirective.js
+++ b/public/kibana-integrations/kibanaDiscoverDirective.js
@ -323,11 +323,6 @@ function discoverController(
          ////////////////////////////////////////////////////////////////////////////
          $rootScope.$broadcast('updateVis', $state.query, queryFilter.getFilters());
          $rootScope.$broadcast('fetch');
-
-          if ($rootScope.comeFromApplyAgent) {
-            loadFilters();
-            $rootScope.comeFromApplyAgent = false;
-          }
          ////////////////////////////////////////////////////////////////////////////
          ////////////////////////////////////////////////////////////////////////////
          ////////////////////////////////////////////////////////////////////////////
@ -494,7 +489,6 @@ function discoverController(
    ///////////////////////////////  WAZUH   ///////////////////////////////////
    ////////////////////////////////////////////////////////////////////////////
    $rootScope.$broadcast('updateVis', $state.query, queryFilter.getFilters());
-    $rootScope.loadedVisualizations = 0;
    $rootScope.$broadcast('fetch');
    ////////////////////////////////////////////////////////////////////////////
    ////////////////////////////////////////////////////////////////////////////
--- a/public/kibana-integrations/kibanaVisualizationDirective.js
+++ b/public/kibana-integrations/kibanaVisualizationDirective.js
@ -8,32 +8,33 @@ var app = require('ui/modules').get('apps/webinar_app', [])
            scope: {
                visID: '=visId',
            },
-            controller: function VisController($scope, $rootScope, savedVisualizations) {
+            controller: function VisController($scope, savedVisualizations) {

-                $scope.implicitFilter = '';
-                $scope.visTitle = '';
-                $scope.fullFilter = '';
+                var implicitFilter = '';
+                var visTitle = '';
+                var fullFilter = '';
+                var rendered = false;
+                var visualization = null;

                // Listen for changes
                var updateSearchSource = $scope.$on('updateVis', function (event, query, filters) {
-                    if ($scope.rendered === true) {
-                        if ($scope.visTitle !== 'Wazuh App Overview General Agents status') { // We don't want to filter that visualization as it uses another index-pattern
+                    if (rendered === true) {
+                        if (visTitle !== 'Wazuh App Overview General Agents status') { // We don't want to filter that visualization as it uses another index-pattern
                            if (query.query == '') {
-                                $scope.fullFilter = $scope.implicitFilter;
+                                fullFilter = implicitFilter;
                            }
                            else {
-                                if ($scope.implicitFilter != '') {
-                                    $scope.fullFilter = $scope.implicitFilter + ' AND ' + query.query;
+                                if (implicitFilter != '') {
+                                    fullFilter = implicitFilter + ' AND ' + query.query;
                                }
                                else {
-                                    $scope.fullFilter = query.query;
+                                    fullFilter = query.query;
                                }
                            }
-                            $scope.savedObj.searchSource.set('query',  {
-                                language: 'lucene',
-                                query: $scope.fullFilter 
-                            });
-                            $scope.savedObj.searchSource.set('filter', filters);
+
+                            visualization.searchSource
+                            .query({ language: 'lucene', query: $scope.fullFilter })
+                            .set('filter', filters);
                        }
                    }
                });
@ -41,14 +42,20 @@ var app = require('ui/modules').get('apps/webinar_app', [])
                // Initializing the visualization
                getVisualizeLoader().then(loader => {
                    savedVisualizations.get($scope.visID).then(savedObj => {
-                        $scope.implicitFilter = savedObj.searchSource.get('query')['query'];
-                        $scope.visTitle = savedObj.vis.title;
-                        $scope.savedObj = savedObj;
-                        loader.embedVisualizationWithSavedObject($("#"+$scope.visID), $scope.savedObj, {})
+                        implicitFilter = savedObj.searchSource.get('query')['query'];
+                        visTitle = savedObj.vis.title;
+                        visualization = savedObj;
+
+                        loader.embedVisualizationWithSavedObject($("#"+$scope.visID), visualization, {})
                        .then(handler => {
-                            $rootScope.loadedVisualizations++;
-                            //console.log('render complete', $scope.visTitle);
-                            $scope.rendered = true;
+
+                            // We bind the renderComplete event to watch for proper loading screen
+                            /*$("#"+$scope.visID).on('renderComplete', () => { 
+                                $rootScope.loadedVisualizations--;
+                                console.log("Finished updating", visTitle, $rootScope.loadedVisualizations);
+                            });*/
+
+                            rendered = true;
                        });
                    });
                });
--- a/public/templates/agents-general.html
+++ b/public/templates/agents-general.html
@ -7,12 +7,14 @@
            <md-card flex>
                <md-card-content class="agents-overview-top-metric-item">
                    <div class="metric-value ng-binding agents-overview-size-14">{{agent.name}}</div>
+                    <md-tooltip md-direction="bottom">{{ agent.name }}</md-tooltip>
                    <div class="ng-binding">Name</div>
                </md-card-content>
            </md-card>
            <md-card  flex="10">
                <md-card-content class="agents-overview-top-metric-item">
                    <div class="metric-value ng-binding agents-overview-size-14">{{agent.ip}}</div>
+                    <md-tooltip md-direction="bottom">{{ agent.ip }}</md-tooltip>
                    <div class="ng-binding">IP Address</div>
                </md-card-content>
            </md-card>
@ -36,12 +38,14 @@
            <md-card flex ng-show="agent.id != '000'">
                <md-card-content class="agents-overview-top-metric-item">
                    <div class="metric-value ng-binding agents-overview-size-14">{{agent.lastKeepAlive}}</div>
+                    <md-tooltip md-direction="bottom">{{ agent.lastKeepAlive }}</md-tooltip>
                    <div class="ng-binding">Last keep alive</div>
                </md-card-content>
            </md-card>
            <md-card flex>
                <md-card-content class="agents-overview-top-metric-item">
                    <div class="metric-value ng-binding agents-overview-size-14">{{agent.dateAdd}}</div>
+                    <md-tooltip md-direction="bottom">{{ agent.dateAdd }}</md-tooltip>
                    <div class="ng-binding">Registration date</div>
                </md-card-content>
            </md-card>
--- a/public/templates/overview-audit.html
+++ b/public/templates/overview-audit.html
@ -1,6 +1,6 @@
 <md-content flex layout="column" ng-if="tab == 'audit'" class="app-container wazuh-column" layout-align="space-around">

-    <div class='uil-ring-css' ng-show="!hideRing(11) && resultState === 'loading'"><div></div></div>
+    <div class='uil-ring-css' ng-show="resultState === 'loading' && tabView === 'panels'"><div></div></div>

    <!-- View: Panels -->
    <div ng-show="resultState === 'ready' && tabView === 'panels'" class="wazuh-column">
--- a/public/templates/overview-fim.html
+++ b/public/templates/overview-fim.html
@ -1,6 +1,6 @@
 <md-content flex layout="column" ng-if="tab == 'fim'" class="app-container wazuh-column">

-    <div class='uil-ring-css' ng-show="!hideRing(17) && resultState === 'loading'"><div></div></div>
+    <div class='uil-ring-css' ng-show="resultState === 'loading' && tabView === 'panels'"><div></div></div>

    <!-- View: Panels -->
    <div ng-show="resultState === 'ready' && tabView === 'panels'" class="wazuh-column">
--- a/public/templates/overview-general.html
+++ b/public/templates/overview-general.html
@ -1,6 +1,6 @@
 <md-content flex layout="column" ng-if="tab === 'general'" class="app-container wazuh-column" layout-align="start">

-    <div class='uil-ring-css' ng-show="!hideRing(15) && resultState === 'loading'"><div></div></div>
+    <div class='uil-ring-css' ng-show="resultState === 'loading' && tabView === 'panels'"><div></div></div>

    <!-- View: Panels -->
    <div ng-show="resultState === 'ready' && tabView === 'panels'" class="wazuh-column">
--- a/public/templates/overview-oscap.html
+++ b/public/templates/overview-oscap.html
@ -1,6 +1,6 @@
 <md-content flex layout="column" ng-if="tab == 'oscap'" class="app-container wazuh-column" layout-align="start">

-    <div class='uil-ring-css' ng-show="!hideRing(14) && resultState === 'loading'"><div></div></div>
+    <div class='uil-ring-css' ng-show="resultState === 'loading' && tabView === 'panels'"><div></div></div>

    <!-- View: Panels -->
    <div ng-show="resultState === 'ready' && tabView === 'panels'" class="wazuh-column">
--- a/public/templates/overview-pci.html
+++ b/public/templates/overview-pci.html
@ -1,6 +1,6 @@
 <md-content flex layout="column" ng-if="tab == 'pci'" class="app-container wazuh-column" layout-align="start">

-    <div class='uil-ring-css' ng-show="!hideRing(5) && resultState === 'loading'"><div></div></div>
+    <div class='uil-ring-css' ng-show="resultState === 'loading' && tabView === 'panels'"><div></div></div>

    <!-- View: Panels -->
    <div ng-show="resultState === 'ready' && tabView === 'panels'" class="wazuh-column">
--- a/public/templates/overview-pm.html
+++ b/public/templates/overview-pm.html
@ -1,6 +1,6 @@
 <md-content flex layout="column" ng-if="tab == 'pm'" class="app-container wazuh-column" layout-align="start">

-    <div class='uil-ring-css' ng-show="!hideRing(5) && resultState === 'loading'"><div></div></div>
+    <div class='uil-ring-css' ng-show="resultState === 'loading' && tabView === 'panels'"><div></div></div>

    <!-- View: Panels -->
    <div ng-show="resultState === 'ready' && tabView === 'panels'" class="wazuh-column">