Timepicker and top navigation fixes

[panda01]

Changes the configObject directive to kbnTopNavbar.

continuation of #6502.

This and #6645 change how one goes about using the timepicker. you still need instantiate the timefilter and set timefilter.enabled = true, the only extra step is you also have to use this directive, or kbn-global-timepicker. Timepicker is no longer a part of kbn-chrome-append-nav-controls.

[spalger]

I strongly object to removing the class in src/ui/public/config_template.js and then embedding it into the config directive.

[rashidkpc]

@spalger why?

[spalger]

I misunderstood the way this was working and thought that the config template was being decorated with is() and such. This seems to be defining an API in the config directive, and then trying to export it to the parent scopes so that they can manipulate the current template.

The idea of exporting an API up to your parent directives is strange, but I suppose stranger things have happened. I don't really have strong arguments against it.

[panda01]

I don't like this name thing.

[rashidkpc]

presumably this should be something like

<kbn-top-nav name="dashboard" kbn-top-nav-button="kbnTopNav">

[spalger]

jenkins, test it

[rashidkpc]

Pretty sure this doesn't exist in master?

[panda01]

Addressed your concerns @rashidkpc. Waiting for these tests to pass.

[rashidkpc]

Also broken:

[tsullivan]

I got the controls added to my page by adding the kbn-global-timepicker directive. It looks like it will take some playing to get it to appear next to tabs.

When I click the controls, they don't do anything - just the play/pause button works.

[panda01]

Leaving the dojo now. Will fix the tests soon. Also @tsullivan maybe try
adding it further up in the Dom. It doesn't matter where you put it in the
Dom as long as you put time filter enabled.
On Mar 30, 2016 19:09, "Tim Sullivan" [email protected] wrote:

I got the controls added to my page by adding the kbn-global-timepicker
directive. It looks like it will take some playing to get it to appear next
to tabs.

When I click the controls, they don't do anything - just the play/pause
button works.

[image: image]
https://cloud.githubusercontent.com/assets/908371/14160460/5932a88e-f691-11e5-8754-8476812811ca.png

—
You are receiving this because you were mentioned.
Reply to this email directly or view it on GitHub
#6657 (comment)

[rashidkpc]

Grab my commits from this pull. I also noted the failing tests there.

@panda01 #6711

[rashidkpc]

This directive has no tests

[panda01]

It does have tests. Not the most comprehensive, but they exist. I just check for the existence of the functions is, open, close, and toggle. Should I add more?

[tsullivan]

I figured out the issues I need to do to get the tabs navigation / timepicker elements cleaned up and working again.

I see Rashid gave a LGTM but some things have changed since. Passing back to Rashid.

[rashidkpc]

Because this directive isn't isolate, and adds properties to $scope, is has the non-obvious side effect of causing every view that uses it to end up with a property on $scope called kbnTopNav

However, because that property is not defined until after the directive is compiled, it isn't available in the controller until after the initial setup. That means if you wish to toggle something when your controller starts you'll need to wait until the directive links:

  $timeout(function () {
    if (config.get('timelion:showTutorial', true)) {
      $scope.kbnTopNav.open('docs');
    }
  }, 0);

[rashidkpc]

Not a blocker, but something to watch out for.

[panda01]

Hmm, I would think that because I define kbnTopNav in the controller it
would work. But I can make an issue if it's really a nuisance and
investigate.
On Mar 31, 2016 11:48, "Rashid Khan" [email protected] wrote:

In src/ui/public/directives/kbn_top_nav.js
#6657 (comment):

•    }
  

•    const templateToCompile = ctrlObj.templates[ctrlObj.curr] || false;
  

•    $scope.kbnTopNav.currTemplate = templateToCompile ? $compile(templateToCompile)($scope) : false;
  

•  };
  

•  const normalizeOpts = _.partial(optionsNormalizer, (item) => {
  

•    ctrlObj.toggleCurrTemplate(item.key);
  

•  });
  

•  const niceMenuItems = _.compact(($scope[$attrs.config] || []).map(normalizeOpts));
  

•  ctrlObj.templates = _.assign({
  

•    interval: intervalTemplate,
  

•    filter: filterTemplate,
  

•  }, getTemplatesMap(niceMenuItems));
  

•  $scope.kbnTopNav = {
  

Not a blocker, but something to watch out for.

—
You are receiving this because you were mentioned.
Reply to this email directly or view it on GitHub
https://github.com/elastic/kibana/pull/6657/files/8ccbc124822eecd23477ea4aed97c7e3ccaa021e#r58077811

[rashidkpc]

I'd like to point out how much easier this is to use than the old way of doing buttons. Much less code, much easier to read and update.

[rashidkpc]

Upgraded timelion for this: elastic/timelion@7010b75