From d840645dd742054c8b4bf6146220576e1feb96be Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Sat, 20 May 2017 22:55:36 +0200
Subject: [PATCH] feat: metrics tab, minor change

---
 public/app/core/services/backend_srv.ts           |  2 +-
 public/app/features/panel/query_troubleshooter.ts | 11 +++++++++--
 public/sass/_variables.dark.scss                  |  6 +++---
 3 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/public/app/core/services/backend_srv.ts b/public/app/core/services/backend_srv.ts
index 85cc63d057f..5965793d738 100644
--- a/public/app/core/services/backend_srv.ts
+++ b/public/app/core/services/backend_srv.ts
@@ -170,7 +170,7 @@ export class BackendSrv {
         });
       }
 
-      //populate error obj on Internal Error
+      // populate error obj on Internal Error
       if (_.isString(err.data) && err.status === 500) {
         err.data = {
           error: err.statusText,
diff --git a/public/app/features/panel/query_troubleshooter.ts b/public/app/features/panel/query_troubleshooter.ts
index 68c2bf35c10..84ae2045dc7 100644
--- a/public/app/features/panel/query_troubleshooter.ts
+++ b/public/app/features/panel/query_troubleshooter.ts
@@ -40,6 +40,7 @@ export class QueryTroubleshooterCtrl {
     this.onRequestErrorEventListener = this.onRequestError.bind(this);
     this.onRequestResponseEventListener = this.onRequestResponse.bind(this);
 
+    appEvents.on('ds-request-response', this.onRequestResponseEventListener);
     appEvents.on('ds-request-error', this.onRequestErrorEventListener);
     $scope.$on('$destroy',  this.removeEventsListeners.bind(this));
   }
@@ -57,7 +58,6 @@ export class QueryTroubleshooterCtrl {
 
   stateChanged() {
     if (this.isOpen) {
-      appEvents.on('ds-request-response', this.onRequestResponseEventListener);
       this.panelCtrl.refresh();
       this.isLoading = true;
     }
@@ -70,6 +70,11 @@ export class QueryTroubleshooterCtrl {
   }
 
   onRequestResponse(data) {
+    // ignore if closed
+    if (!this.isOpen) {
+      return;
+    }
+
     this.isLoading = false;
     data = _.cloneDeep(data);
 
@@ -135,7 +140,9 @@ export function queryTroubleshooter() {
       ctrl.renderJsonExplorer = function(data) {
         var jsonElem = elem.find('.query-troubleshooter-json');
 
-        ctrl.jsonExplorer =  new JsonExplorer(data, 3, { });
+        ctrl.jsonExplorer =  new JsonExplorer(data, 3, {
+          animateOpen: true,
+        });
 
         const html = ctrl.jsonExplorer.render(true);
         jsonElem.html(html);
diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss
index c6bee53b14b..30b769c3cda 100644
--- a/public/sass/_variables.dark.scss
+++ b/public/sass/_variables.dark.scss
@@ -286,9 +286,9 @@ $collapse-box-body-error-border: $red;
 
 // json-explorer
 $json-explorer-default-color: white;
-$json-explorer-string-color: #31F031;
-$json-explorer-number-color: #66C2FF;
-$json-explorer-boolean-color: #EC4242;
+$json-explorer-string-color: #23d662;
+$json-explorer-number-color: $variable;
+$json-explorer-boolean-color: $variable;
 $json-explorer-null-color: #EEC97D;
 $json-explorer-undefined-color: rgb(239, 143, 190);
 $json-explorer-function-color: #FD48CB;