Search code examples
angularjskibana-4streaming-video

kibana: How to inject controller function with custom visualization plugin


i am trying to create a simple video plugin for kibana. currently am getting this error : "[ng:areq] Argument 'VideoController' is not a function, got undefined". i had executed and tested the statically before trying to pack this up in kibana as a plugin. any help would be appreciated.

  define(function(require) {
  require('plugins/kvideo/kvideo.css');
  require('angular');  
  require('ng-video/dist/ng-video');  
  //require('plugins/kvideo/default');    
  const APP_NAME = 'myApp';

  (function Default($angular) {      
    $angular.module(APP_NAME, ['ngVideo']);
  })(window.angular);
  var module = require('ui/modules').get('kvideo');
  //testing this plugin1
  module = (function VideoController($angular) {    
    $angular.module(APP_NAME).controller('VideoController',function videoController($scope, video) {
        $scope.playlistOpen = false;
        $scope.videos = {
            first:  '/home/test/Downloads/SampleVideo_1280x720_1mb.mp4',
            second: '/home/test/Downloads/SampleVideo_1280x720_2mb.mp4'
        };
        $scope.playVideo = function playVideo(sourceUrl) {
            video.addSource('mp4', sourceUrl, true);
        };        
        $scope.getVideoName = function getVideoName(videoModel) {
            switch (videoModel.src) {
                case ($scope.videos.first): return "Big Buck Bunny";
                case ($scope.videos.second): return "The Bear";
                default: return "Unknown Video";
            }
        };
        video.addSource('mp4', $scope.videos.first);
        video.addSource('mp4', $scope.videos.second);
    });
  })(window.angular);

  function VideoProvider(Private) {
    var TemplateVisType = Private(require('ui/template_vis_type/TemplateVisType'));
    return new TemplateVisType({
      name: 'trVideo',
      title: 'Video',
      icon: 'fa-camera-retro',
      description: 'Display random video on kibana dashboard',
      requiresSearch: false,
      template: require('plugins/kvideo/kvideo.html')
      // params: {
      //   //editor: require('plugins/kvideo/kvideo-editor.html')        
      // }      
    });
  }

  require('ui/registry/vis_types').register(VideoProvider);  
  return VideoProvider;
});

screenshot error


Solution

  • You can't name all of these the same thing, try:

    module = (function VideoControllerModule($angular) {    
        $angular.module(APP_NAME).controller('VideoController',function videoController($scope, video) {