diff --git a/src/app/components/extend-jquery.js b/src/app/components/extend-jquery.js index 70a365ac2a3..3e7e74b22f7 100755 --- a/src/app/components/extend-jquery.js +++ b/src/app/components/extend-jquery.js @@ -20,6 +20,7 @@ function ($) { 'font-weight' : 200, 'background-color': '#1f1f1f', 'border-radius': '5px', + 'z-index': 9999 } }; diff --git a/src/app/directives/kibanaSimplePanel.js b/src/app/directives/kibanaSimplePanel.js index f99859949fc..74b781dcb9c 100644 --- a/src/app/directives/kibanaSimplePanel.js +++ b/src/app/directives/kibanaSimplePanel.js @@ -1,12 +1,19 @@ define([ - 'angular' + 'angular', + 'underscore' ], -function (angular) { +function (angular, _) { 'use strict'; angular .module('kibana.directives') .directive('kibanaSimplePanel', function($compile) { + var panelLoading = '' + + ''+ + ' loading ...' + + ''+ + ''; + return { restrict: 'E', link: function($scope, elem, attr) { @@ -22,10 +29,10 @@ function (angular) { elem.removeClass("ng-cloak"); } - $scope.$watch(attr.type, function (name) { + function loadController(name) { elem.addClass("ng-cloak"); - // load the panels module file, then render it in the dom. + $scope.require([ 'jquery', 'text!panels/'+name+'/module.html' @@ -37,6 +44,7 @@ function (angular) { $controllers = $controllers.add($module.find('ngcontroller, [ng-controller], .ng-controller')); if ($controllers.length) { + $controllers.first().prepend(panelLoading); $scope.require([ 'panels/'+name+'/module' ], function() { @@ -46,6 +54,19 @@ function (angular) { loadModule($module); } }); + } + + $scope.$watch(attr.type, function (name) { + loadController(name); + }); + + $scope.$watch(attr.panel, function (panel) { + // If the panel attribute is specified, create a new scope. This ruins configuration + // so don't do it with anything that needs to use editor.html + if(!_.isUndefined(panel)) { + $scope = $scope.$new(); + $scope.panel = angular.fromJson(panel); + } }); } }; diff --git a/src/app/panels/table/micropanel.html b/src/app/panels/table/micropanel.html index b3d08fb2053..1a785521808 100755 --- a/src/app/panels/table/micropanel.html +++ b/src/app/panels/table/micropanel.html @@ -41,4 +41,12 @@
-{{field}} ({{Math.round((count / micropanel.count) * 100)}}%), \ No newline at end of file +
+ {{field}} ({{Math.round((count / micropanel.count) * 100)}}%), +
+
+
+
Facets
+ +
+
\ No newline at end of file diff --git a/src/app/panels/table/modal.html b/src/app/panels/table/modal.html new file mode 100644 index 00000000000..713d36175fe --- /dev/null +++ b/src/app/panels/table/modal.html @@ -0,0 +1,45 @@ + + + \ No newline at end of file diff --git a/src/app/panels/table/module.html b/src/app/panels/table/module.html index 1e7f0ab886d..f596a789265 100755 --- a/src/app/panels/table/module.html +++ b/src/app/panels/table/module.html @@ -13,7 +13,7 @@ diff --git a/src/app/panels/table/module.js b/src/app/panels/table/module.js index a6c2f70ff17..137a372d923 100755 --- a/src/app/panels/table/module.js +++ b/src/app/panels/table/module.js @@ -33,7 +33,7 @@ function (angular, app, _, kbn, moment) { var module = angular.module('kibana.panels.table', []); app.useModule(module); - module.controller('table', function($rootScope, $scope, fields, querySrv, dashboard, filterSrv) { + module.controller('table', function($rootScope, $scope, $modal, $q, $compile, fields, querySrv, dashboard, filterSrv) { $scope.panelMeta = { modals : [ { @@ -93,8 +93,42 @@ function (angular, app, _, kbn, moment) { $scope.get_data(); }; + // Create a percent function for the view $scope.percent = kbn.to_percent; + $scope.termsModal = function(field) { + $scope.modalField = field; + showModal( + '{"height":"200px","chart":"bar","field":"'+field+'"}','terms'); + }; + + $scope.statsModal = function(field) { + $scope.modalField = field; + showModal( + '{"field":"'+field+'"}','statistics'); + }; + + var showModal = function(panel,type) { + + $scope.facetPanel = panel; + $scope.facetType = type; + + // create a new modal. Can't reuse one modal unforunately as the directive will not + // re-render on show. + var panelModal = $modal({ + template: './app/panels/table/modal.html', + persist: true, + show: false, + scope: $scope, + keyboard: false + }); + + // and show it + $q.when(panelModal).then(function(modalEl) { + modalEl.modal('show'); + }); + }; + $scope.toggle_micropanel = function(field,groups) { var docs = _.map($scope.data,function(_d){return _d.kibana._source;}); var topFieldValues = kbn.top_field_values(docs,field,10,groups); diff --git a/src/app/partials/dashLoader.html b/src/app/partials/dashLoader.html index 92ecfd54d40..685457030ea 100755 --- a/src/app/partials/dashLoader.html +++ b/src/app/partials/dashLoader.html @@ -4,7 +4,7 @@ } -
  • +