Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[plugins] allow breaking a nut #6122

Merged
merged 2 commits into from
Feb 5, 2016

Conversation

spalger
Copy link
Contributor

@spalger spalger commented Feb 5, 2016

Don't use a sledgehammer to break a nut

This allows users to inject arbitrary "user scripts" into kibana. These "sledgehammer"s can accomplish just about anything, and are injected into every page so users can experiment with extending Kibana without modifying the code base or waiting for a blessed API.

Lets say you wanted to implement #6136. You would create a plugin that exported a sledgehammer, and that sledge hammer might look something like this:

import $ from 'jquery';
import uiModules from 'ui/modules';

import ConfigTemplate from 'ui/ConfigTemplate';
import filterHtml from 'ui/chrome/config/filter.html';
import intervalHtml from 'ui/chrome/config/interval.html';

// hook into angular's application lifecycle
uiModules.get('kibana').run(function ($rootScope) {
  // attempt to inject the control every time the route changes or updates
  $rootScope.$on('$routeChangeSuccess', injectControl);
  $rootScope.$on('$routeUpdate', injectControl);

  function injectControl() {
    const $timepicker = $('nav .navbar-timepicker');

    if ($timepicker.children('.my-config-toggle').size() > 0) {
      // prevent double-injecting
      return;
    }

    // overwrite $scope.pickerTemplate so we can inject our template
    const $pickerScope = $timepicker.scope();
    $pickerScope.pickerTemplate = new ConfigTemplate({
      filter: filterHtml,
      interval: intervalHtml,
      myConfigPanel: `<h1>I'm a teapot</h1>`
    });

    // create the button that will open our config dropdown
    const $navControlButton = $('<a>Show my Config</a>');
    $navControlButton.on('click', function () {
      $pickerScope.pickerTemplate.toggle('myConfigPanel');
    });

    // inject the button into the navbar
    $timepicker.prepend(
      $('<li class="my-config-toggle">').append($navControlButton)
    );
  }
});

@w33ble
Copy link
Contributor

w33ble commented Feb 5, 2016

sledgehammer

@epixa
Copy link
Contributor

epixa commented Feb 5, 2016

Errr... wat?

@kimjoar
Copy link
Contributor

kimjoar commented Feb 5, 2016

⁉️

@rashidkpc
Copy link
Contributor

@spalger Can you update the description of this bad boy. I generate the weekly emails off these :-)

@spalger spalger changed the title [plugins] allow breaking nuts [plugins] allow breaking a nut Feb 5, 2016
spalger added a commit that referenced this pull request Feb 5, 2016
@spalger spalger merged commit efeeacb into elastic:master Feb 5, 2016
@spalger spalger deleted the implement/sledgehammer branch February 25, 2016 22:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants