Display log lines in tooltip of WinRM stream

Signed-off-by: Mykola Mandra <mykola.mandra@cloudsoftcorp.com>
diff --git a/ui-modules/app-inspector/app/components/stream/stream.directive.js b/ui-modules/app-inspector/app/components/stream/stream.directive.js
index 0f9a943..2196885 100644
--- a/ui-modules/app-inspector/app/components/stream/stream.directive.js
+++ b/ui-modules/app-inspector/app/components/stream/stream.directive.js
@@ -46,6 +46,11 @@
         // Content filtering features
         $scope.filteredStream = [];
         $scope.streamProcessedUpTo = 0;
+        $scope.otherLogLines = 0;
+        $scope.errorLogLines = 0;
+        $scope.debugLogLines = 0;
+        $scope.traceLogLines = 0;
+        $scope.warningLogLines = 0;
         $scope.isDisplayOther = $scope.isDisplayOther !== false;
         $scope.isDisplayError = $scope.isDisplayError !== false;
         $scope.isDisplayDebug = $scope.isDisplayDebug !== false;
@@ -62,7 +67,7 @@
         $scope.isCliXmlSupported = isCliXmlSupported;
         $scope.cliXmlVerificationRequired = isWinRmStream(); // CLI XML verification is required only when stream is WinRM
 
-        let autoScrollableElement = Array.from(document.getElementsByClassName('auto-scrollable'));
+        let autoScrollableElement = Array.from($element.find('pre')).filter(item => item.classList.contains('auto-scrollable'));
         let refreshFunction;
 
         // Set up cancellation of auto-scrolling on scrolling up.
@@ -224,14 +229,19 @@
                 };
 
                 if (/<s s="warning">/i.test(item)) {
+                    $scope.warningLogLines++;
                     formattedItem.isWarning = true;
                 } else if (/<s s="debug">/i.test(item)) {
+                    $scope.debugLogLines++;
                     formattedItem.isDebug = true;
                 } else if (/<s s="verbose">/i.test(item)) {
+                    $scope.traceLogLines++;
                     formattedItem.isTrace = true;
                 } else if (/<s s="error">/i.test(item)) {
+                    $scope.errorLogLines++;
                     formattedItem.isError = true;
                 } else {
+                    $scope.otherLogLines++;
                     formattedItem.isOther = true;
                 }
 
diff --git a/ui-modules/app-inspector/app/components/stream/stream.template.html b/ui-modules/app-inspector/app/components/stream/stream.template.html
index b044ed7..0322874 100644
--- a/ui-modules/app-inspector/app/components/stream/stream.template.html
+++ b/ui-modules/app-inspector/app/components/stream/stream.template.html
@@ -20,29 +20,29 @@
 
 <div ng-show="stream.length >= 0">
   <pre ng-show="stream.length > 0 && !isFilterContent()" class="auto-scrollable">{{stream}}</pre>
-  <pre ng-show="stream.length > 0 && isFilterContent()" class="auto-scrollable"><pre ng-repeat="item in filteredStream track by item.id" ng-show="isDisplayFormattedItem(item)" class="log-section" ng-class="getFormattedItemLogLevel(item)">{{item.text}}</pre><p ng-show="!isDisplayTrace && !isDisplayDebug && !isDisplayWarning && !isDisplayError" class="text-center"><i>(select filter)</i></p></pre>
+  <pre ng-show="stream.length > 0 && isFilterContent()" class="auto-scrollable"><pre ng-repeat="item in filteredStream track by item.id" ng-show="isDisplayFormattedItem(item)" class="log-section" ng-class="getFormattedItemLogLevel(item)">{{item.text}}</pre><p ng-show="!isDisplayTrace && !isDisplayDebug && !isDisplayWarning && !isDisplayError && !isDisplayOther" class="text-center"><i>(select filter)</i></p></pre>
   <pre ng-show="stream.length == 0" class="text-center"><i>(no content)</i></pre>
   <div class="log-actions">
 
     <!-- Content filtering -->
-    <span class="log-action" ng-click="isDisplayOther = !isDisplayOther" ng-class="{'active': isDisplayOther, 'hidden': !isFilterContent()}"
-          uib-tooltip="{{ isDisplayOther ? 'Hide' : 'Show' }} other" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
+    <span class="log-action" ng-click="isDisplayOther = !isDisplayOther" ng-class="{'active': isDisplayOther}" ng-show="isFilterContent()"
+          uib-tooltip="{{ isDisplayOther ? 'Hide' : 'Show' }} other ({{otherLogLines}} lines)" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
         <i class="fa fa-question"></i></span>
-    <span class="log-action" ng-click="isDisplayTrace = !isDisplayTrace" ng-class="{'active': isDisplayTrace, 'hidden': !isFilterContent()}"
-          uib-tooltip="{{ isDisplayTrace ? 'Hide' : 'Show' }} trace" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
+    <span class="log-action" ng-click="isDisplayTrace = !isDisplayTrace" ng-class="{'active': isDisplayTrace}" ng-show="isFilterContent()"
+          uib-tooltip="{{ isDisplayTrace ? 'Hide' : 'Show' }} trace ({{traceLogLines}} lines)" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
         <i class="fa fa-bullhorn"></i></span>
-    <span class="log-action" ng-click="isDisplayDebug = !isDisplayDebug" ng-class="{'active': isDisplayDebug, 'hidden': !isFilterContent()}"
-          uib-tooltip="{{ isDisplayDebug ? 'Hide' : 'Show' }} debug" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
+    <span class="log-action" ng-click="isDisplayDebug = !isDisplayDebug" ng-class="{'active': isDisplayDebug}" ng-show="isFilterContent()"
+          uib-tooltip="{{ isDisplayDebug ? 'Hide' : 'Show' }} debug ({{debugLogLines}} lines)" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
         <i class="fa fa-bug"></i></span>
-    <span class="log-action" ng-click="isDisplayWarning = !isDisplayWarning" ng-class="{'active': isDisplayWarning, 'hidden': !isFilterContent()}"
-          uib-tooltip="{{ isDisplayWarning ? 'Hide' : 'Show' }} warnings" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
+    <span class="log-action" ng-click="isDisplayWarning = !isDisplayWarning" ng-class="{'active': isDisplayWarning}" ng-show="isFilterContent()"
+          uib-tooltip="{{ isDisplayWarning ? 'Hide' : 'Show' }} warnings ({{warningLogLines}} lines)" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
         <i class="fa fa-bolt"></i></span>
-    <span class="log-action" ng-click="isDisplayError = !isDisplayError" ng-class="{'active': isDisplayError, 'hidden': !isFilterContent()}"
-          uib-tooltip="{{ isDisplayError ? 'Hide' : 'Show' }} errors" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
+    <span class="log-action" ng-click="isDisplayError = !isDisplayError" ng-class="{'active': isDisplayError}" ng-show="isFilterContent()"
+          uib-tooltip="{{ isDisplayError ? 'Hide' : 'Show' }} errors ({{errorLogLines}} lines)" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
         <i class="fa fa-exclamation-triangle"></i></span>
 
     <!-- CLI XML output mode -->
-    <span class="log-action" ng-click="toggleCliXml()" ng-class="{'active': cliXml, 'hidden': !isCliXmlSupported()}"
+    <span class="log-action" ng-click="toggleCliXml()" ng-class="{'active': cliXml}" ng-show="isCliXmlSupported()"
           uib-tooltip="Display {{ cliXml ? 'formatted output' : 'CLI XML' }}" tooltip-placement="top" tooltip-popup-delay="500" tooltip-append-to-body="true">
         <i class="fa fa-code"></i></span>