began work in inspector feature for easy troubleshooting, Issue #265

src/app/controllers/all.js

@@ -10,4 +10,5 @@ define([
   './graphiteImport',
   './influxTargetCtrl',
   './playlistCtrl',
-], function () {});
+  './inspectCtrl',
+], function () {});

src/app/directives/kibanaPanel.js

@@ -16,9 +16,10 @@ function (angular, $, _) {
       var panelHeader =
       '<div class="panel-header">'+
         '<div class="row-fluid">' +
-          '<div class="span12 alert-error panel-error" ng-hide="!panel.error">' +
+          '<div class="span12 alert-error panel-error" ng-if="panel.error">' +
             '<a class="close" ng-click="panel.error=false">&times;</a>' +
-            '<i class="icon-exclamation-sign"></i> <strong>Oops!</strong> {{panel.error}}' +
+            '<span><i class="icon-exclamation-sign"></i> <strong>Oops!</strong> {{panel.error}} </span>' +
+            '<span class="pointer" config-modal="app/partials/inspector.html"> &nbsp;&nbsp; (inspect)</span>' +
           '</div>' +
         '</div>\n' +
 

src/app/panels/graphite/module.js

@@ -261,6 +261,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
       return $scope.datasource.query(graphiteQuery)
         .then($scope.dataHandler)
         .then(null, function(err) {
+          $scope.inspector_info = { error: err };
           $scope.panel.error = err.message || "Graphite HTTP Request Error";
         });
     };

src/app/partials/inspector.html

@@ -1,14 +1,44 @@
-<div class="modal-header">
-  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
-  <h3>Last Elasticsearch Query</h3>
-</div>
-<div class="modal-body">
+<div class="modal-body" ng-controller="InspectCtrl" ng-init="init()">
+  <div class="pull-right editor-title">Inspector</div>
+
+  <div ng-model="editor.index" bs-tabs>
+    <div ng-repeat="tab in ['Request','Response']" data-title="{{tab}}">
+    </div>
+  </div>
+
+  <div class="editor-row" ng-if="editor.index == 0">
 
-  <div>
-    <pre>curl -XGET '{{config.elasticsearch}}/{{dashboard.indices|stringify}}/_search?pretty' -d '{{inspector}}'
-    </pre>
+    <table class="table table-striped">
+      <tr>
+        <td>Url</td>
+        <td>{{inspector_info.error.config.url}}</td>
+      </tr>
+      <tr>
+        <td>Method</td>
+        <td>{{inspector_info.error.config.method}}</td>
+      </tr>
+      <tr ng-repeat="(key, value) in inspector_info.error.config.headers">
+        <td>
+          {{key}}
+        </td>
+        <td>
+          {{value}}
+        </td>
+      </tr>
+      <tr>
+        <td>Data</td>
+        <td>{{inspector_info.error.config.data}}</td>
+      </tr>
+    </table>
+
+  </div>
+
+  <div class="editor-row" ng-if="editor.index == 1">
+    <div ng-if="response_html">
+      <div iframe-content="response_html"></div>
+    </div>
   </div>
-  
+
 </div>
 <div class="modal-footer">
   <button type="button" class="btn btn-success" ng-click="dismiss()">Close</button>

src/app/partials/roweditor.html

@@ -62,5 +62,5 @@
 <div class="modal-footer">
   <button ng-show="editor.index == 1" ng-click="editor.index = 2;" class="btn btn-success" ng-disabled="panel.loadingEditor">Add Panel</button>
   <button ng-show="panel.type && editor.index == 2" ng-click="add_panel(row,panel); reset_panel(); editor.index = 1;" class="btn btn-success" ng-disabled="panel.loadingEditor">Add Panel</button>
-  <button type="button" class="btn btn-danger" ng-click="editor.index=0;dismiss();reset_panel();close_edit()">Close</button>
+  <button type="button" class="btn btn-info" ng-click="editor.index=0;dismiss();reset_panel();close_edit()">Close</button>
 </div>