Merge pull request #7443 from w33ble/navbar-extension-config

Navbar extensions - config controls

src/plugins/kibana/public/dashboard/index.html

@@ -84,6 +84,7 @@
           <i aria-hidden="true" class="fa fa-gear"></i>
         </button>
       </kbn-tooltip>
+      <navbar-extensions config-template="configTemplate" name="dashboard"></navbar-extensions>
     </div>
   </navbar>
 

src/plugins/kibana/public/dashboard/index.js

@@ -10,7 +10,7 @@ define(function (require) {
   require('ui/config');
   require('ui/notify');
   require('ui/typeahead');
-  require('ui/navbar');
+  require('ui/navbar_extensions');
   require('ui/share');
 
   require('plugins/kibana/dashboard/directives/grid');

src/plugins/kibana/public/discover/index.html

@@ -60,6 +60,7 @@
           <i aria-hidden="true" class="fa fa-external-link"></i>
         </button>
       </kbn-tooltip>
+      <navbar-extensions config-template="configTemplate" name="discover"></navbar-extensions>
     </div>
   </navbar>
 

src/plugins/kibana/public/discover/index.js

@@ -1,7 +1,7 @@
 define(function (require, module, exports) {
   require('plugins/kibana/discover/saved_searches/saved_searches');
   require('plugins/kibana/discover/directives/timechart');
-  require('ui/navbar');
+  require('ui/navbar_extensions');
   require('ui/collapsible_sidebar');
   require('plugins/kibana/discover/components/field_chooser/field_chooser');
   require('plugins/kibana/discover/controllers/discover');

src/plugins/kibana/public/visualize/editor/editor.html

@@ -112,6 +112,7 @@
           <i aria-hidden="true" class="fa fa-refresh"></i>
         </button>
       </kbn-tooltip>
+      <navbar-extensions config-template="configTemplate" name="visualize"></navbar-extensions>
     </div>
   </navbar>
 

src/plugins/kibana/public/visualize/editor/editor.js

@@ -4,7 +4,7 @@ define(function (require) {
   require('plugins/kibana/visualize/editor/sidebar');
   require('plugins/kibana/visualize/editor/agg_filter');
 
-  require('ui/navbar');
+  require('ui/navbar_extensions');
   require('ui/visualize');
   require('ui/collapsible_sidebar');
   require('ui/share');

src/ui/public/ConfigTemplate.js

@@ -22,6 +22,10 @@ define(function (require) {
       return newState;
     }
 
+    template.push = function (name, tpl) {
+      templates[name] = tpl;
+    };
+
     template.is = function (name) {
       return template.current === templates[name];
     };

src/ui/public/navbar_extensions/navbar_extensions.js

@@ -0,0 +1,45 @@
+const _ = require('lodash');
+const $ = require('jquery');
+const navbar = require('ui/modules').get('kibana');
+
+navbar.directive('navbarExtensions', function (Private, $compile) {
+  const navbarExtensionsRegistry = Private(require('ui/registry/navbar_extensions'));
+  const getExtensions = _.memoize(function (name) {
+    if (!name) throw new Error('navbar directive requires a name attribute');
+    return _.sortBy(navbarExtensionsRegistry.byAppName[name], 'order');
+  });
+
+  return {
+    scope: {
+      configTemplate: '='
+    },
+    restrict: 'E',
+    link: function ($scope, $el, $attr) {
+      if (!$scope.configTemplate) throw new Error('navbar extensions require a configTemplate');
+
+      const extensions = getExtensions($attr.name);
+
+      extensions.forEach(function (extension) {
+        $scope.configTemplate.push(extension.name, extension.template);
+
+        const extScope = $scope.$new();
+        const $ext = $(`
+          <kbn-tooltip text="${extension.description}" placement="bottom" append-to-body="1">
+            <button
+              aria-label="${extension.description}"
+              aria-haspopup="true"
+              ng-click="configTemplate.toggle('${extension.name}')">
+              <i aria-hidden="true" class="fa ${extension.icon}"></i>
+            </button>
+          </kbn-tooltip>
+        `);
+        const $ctrl = $compile($ext)(extScope);
+        $el.append($ctrl);
+      });
+    },
+    controllerAs: 'navbarExtensions',
+    controller: function ($attrs) {
+      this.extensions = getExtensions($attrs.name);
+    }
+  };
+});