From 586720e6898c236a46953b891205de82cc2f21e2 Mon Sep 17 00:00:00 2001
From: Timothy Sullivan <tsullivan@elastic.co>
Date: Mon, 12 Oct 2015 14:49:26 -0700
Subject: [PATCH] =?UTF-8?q?allow=20visualize=20view=20to=20hand=20off=20?=
 =?UTF-8?q?=E2=80=9Cno=20results=E2=80=9D=20scenario?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/plugins/metric_vis/public/metric_vis.html | 16 +++++++++++++---
 src/ui/public/visualize/visualize.html        |  4 ++--
 src/ui/public/visualize/visualize.js          | 18 ++++++++++++++++++
 3 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/src/plugins/metric_vis/public/metric_vis.html b/src/plugins/metric_vis/public/metric_vis.html
index ef30d0404d8c1..eae9eed3a00a8 100644
--- a/src/plugins/metric_vis/public/metric_vis.html
+++ b/src/plugins/metric_vis/public/metric_vis.html
@@ -1,6 +1,16 @@
 <div ng-controller="KbnMetricVisController" class="metric-vis">
-    <div class="metric-container" ng-repeat="metric in metrics">
-        <div class="metric-value" ng-style="{'font-size': vis.params.fontSize+'pt'}">{{metric.value}}</div>
-        <div>{{metric.label}}</div>
+  <div class="metric-container" ng-repeat="metric in metrics">
+    <div ng-hide="!metric.value">
+      <div class="metric-value" ng-style="{'font-size': vis.params.fontSize+'pt'}">{{metric.value}}</div>
+      <div>{{metric.label}}</div>
     </div>
+    <div ng-if="!metric.value">
+      <div class="item top"></div>
+      <div class="item">
+        <h2 aria-hidden="true"><i aria-hidden="true" class="fa fa-meh-o"></i></h2>
+        <div>No data available for {{metric.label}}</div>
+      </div>
+      <div class="item bottom"></div>
+    </div>
+  </div>
 </div>
diff --git a/src/ui/public/visualize/visualize.html b/src/ui/public/visualize/visualize.html
index 6b105e5c8fab9..efb7ea95db1bd 100644
--- a/src/ui/public/visualize/visualize.html
+++ b/src/ui/public/visualize/visualize.html
@@ -1,4 +1,4 @@
-<div ng-if="vis.type.requiresSearch && esResp.hits.total === 0"
+<div ng-show="showNoResultsMessage(this);"
   class="text-center visualize-error visualize-chart">
   <div class="item top"></div>
   <div class="item">
@@ -7,7 +7,7 @@ <h4>No results found</h4>
   </div>
   <div class="item bottom"></div>
 </div>
-<div ng-hide="vis.type.requiresSearch && esResp.hits.total === 0"
+<div ng-show="hasResults(this);"
   ng-style="loadingStyle"
   ng-class="{ loading: vis.type.requiresSearch && searchSource.activeFetchCount > 0 }"
   class="visualize-chart"></div>
diff --git a/src/ui/public/visualize/visualize.js b/src/ui/public/visualize/visualize.js
index 10d9b0dfd01a1..d9da5f2fd9edc 100644
--- a/src/ui/public/visualize/visualize.js
+++ b/src/ui/public/visualize/visualize.js
@@ -46,6 +46,24 @@ define(function (require) {
         $scope.spy = {};
         $scope.spy.mode = ($scope.uiState) ? $scope.uiState.get('spy.mode', {}) : {};
 
+        $scope.showNoResultsMessage = function (scope) {
+          var requiresSearch = _.get(scope, 'vis.type.requiresSearch');
+          var hasZeroHits = _.get(scope, 'esResp.hits.total') === 0;
+          if (requiresSearch && hasZeroHits) {
+            // check for any visType that can visualize zero hits
+            return _.get(scope, 'vis.type.name') !== 'metric';
+          }
+          return true;
+        };
+
+        $scope.hasResults = function (scope) {
+          var requiresSearch = _.get(scope, 'vis.type.requiresSearch');
+          var hasZeroHits = _.get(scope, 'esResp.hits.total') === 0;
+          var canBeZero = _.get(scope, 'vis.type.name') === 'metric';
+
+          return requiresSearch && (hasZeroHits || canBeZero);
+        };
+
         var applyClassNames = function () {
           var $spyEl = getSpyEl();
           var $visEl = getVisEl();