Migrate visualization to work with Kibana 5.0.0.

bitsensor · Nov 8, 2016 · 5f5aff7 · 5f5aff7
1 parent d042365
commit 5f5aff7
Show file tree

Hide file tree

Showing 5 changed files with 284 additions and 285 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "prelert_swimlane_vis",
-  "version": "0.1.1",
+  "version": "5.0.0",
   "description": "Prelert swimlane visualization plugin",
   "license": "Apache-2.0"
 }
diff --git a/public/prelert_swimlane_vis.html b/public/prelert_swimlane_vis.html
@@ -11,12 +11,12 @@
       info="This interval creates {{ vis.params.interval.scale > 1 ? 'buckets that are too large' : 'too many buckets' }} to show in the selected time range, so it has been scaled to {{ vis.params.interval.description }}">
     </kbn-info>
     </div>
-    
+
     <div style="float:right; display:inline; margin-right: 35px; line-height: 30px;">
-      <img alt="Prelert logo" width="24" height="24" src="/plugins/prelert_swimlane_vis/prelert_logo_24.png" />   
+      <img alt="Prelert logo" width="24" height="24" src="{{prelertLogoSrc}}" />
     </div>
-  </div>   
+  </div>
   <div style="display:flex;">
     <prl-swimlane-vis style="width: 100%; height: 200px;"></prl-swimlane-vis>
-  </div> 
+  </div>
 </div>
diff --git a/public/prelert_swimlane_vis.js b/public/prelert_swimlane_vis.js
@@ -18,79 +18,76 @@
  ****************************************************************************
  */
 
-define(function(require) {
+import 'plugins/prelert_swimlane_vis/prelert_swimlane_vis_controller.js';
+import 'plugins/prelert_swimlane_vis/prelert_swimlane_vis.less';
 
-  require('plugins/prelert_swimlane_vis/prelert_swimlane_vis_controller.js');
-  require('plugins/prelert_swimlane_vis/prelert_swimlane_vis.less');
+import visTypes from 'ui/registry/vis_types';
+import TemplateVisTypeProvider from 'ui/template_vis_type/template_vis_type';
+import VisSchemasProvider from 'ui/vis/schemas';
 
-  // Register the PrelertSwimlaneVisProvider with the visualization registry.
-  require('ui/registry/vis_types').register(PrelertSwimlaneVisProvider);
+// Register the PrelertSwimlaneVisProvider with the visualization registry.
+visTypes.register(PrelertSwimlaneVisProvider);
 
-  function PrelertSwimlaneVisProvider(Private) {
-    var TemplateVisType = Private(require('ui/template_vis_type/TemplateVisType'));
-    var Schemas = Private(require('ui/Vis/Schemas'));
+function PrelertSwimlaneVisProvider(Private) {
+  const TemplateVisType = Private(TemplateVisTypeProvider);
+  const Schemas = Private(VisSchemasProvider);
 
-    // Return a new instance describing this visualization.
-    return new TemplateVisType({
-      name : 'prelert_swimlane',
-      title : 'Swimlane',
-      icon : 'fa-bars',
-      description : 'Swimlane visualization displaying the behavior of a metric ' +
-                    'over time across a field from the results. ' +
-                    'Each lane displays a different value of the field, with the ' +
-                    'relative size of the metric over each interval indicated ' +
-                    'by the color of the symbol at that time. ' +
-                    'Created by Prelert for Behavioral Analytics www.prelert.com',
-      template : require('plugins/prelert_swimlane_vis/prelert_swimlane_vis.html'),
-      params : {
-        editor : require('plugins/prelert_swimlane_vis/prelert_swimlane_vis_params.html'),
-        defaults : {
-          interval : { display : 'Auto', val : 'auto' },
-          lowThreshold: 0,
-          warningThreshold: 3,
-          minorThreshold: 25,
-          majorThreshold: 50,
-          criticalThreshold: 75,
-          tooltipNumberFormat: '0.0'
-        },
-        intervalOptions: [{display:'Auto', val:'auto'},
-                          {display:'5 minutes', val:'custom', customInterval:'5m'},
-                          {display:'10 minutes', val:'custom', customInterval:'10m'},
-                          {display:'30 minutes', val:'custom', customInterval:'30m'},
-                          {display:'1 hour', val:'h'},
-                          {display:'3 hours', val:'custom', customInterval:'3h'},
-                          {display:'12 hours', val:'custom', customInterval:'12h'},
-                          {display:'1 day', val:'d'}]
+  // Return a new instance describing this visualization.
+  return new TemplateVisType({
+    name : 'prelert_swimlane',
+    title : 'Swimlane',
+    icon : 'fa-bars',
+    description : 'Swimlane visualization displaying the behavior of a metric ' +
+                  'over time across a field from the results. ' +
+                  'Each lane displays a different value of the field, with the ' +
+                  'relative size of the metric over each interval indicated ' +
+                  'by the color of the symbol at that time. ' +
+                  'Created by Prelert for Behavioral Analytics www.prelert.com',
+    template : require('plugins/prelert_swimlane_vis/prelert_swimlane_vis.html'),
+    params : {
+      editor : require('plugins/prelert_swimlane_vis/prelert_swimlane_vis_params.html'),
+      defaults : {
+        interval : { display : 'Auto', val : 'auto' },
+        lowThreshold: 0,
+        warningThreshold: 3,
+        minorThreshold: 25,
+        majorThreshold: 50,
+        criticalThreshold: 75,
+        tooltipNumberFormat: '0.0'
       },
-      schemas : new Schemas([ {
-        group : 'metrics',
-        name : 'metric',
-        title : 'Value',
-        min : 1,
-        max : 1,
-        aggFilter : [ 'count', 'avg', 'sum', 'min', 'max' ]
-      }, {
-        group : 'buckets',
-        name : 'viewBy',
-        icon : 'fa fa-eye',
-        title : 'View by',
-        mustBeFirst : true,
-        min : 0,
-        max : 1,
-        aggFilter : 'terms'
-      }, {
-        group : 'buckets',
-        name : 'timeSplit',
-        icon : 'fa fa-th',
-        title : 'Time field',
-        min : 1,
-        max : 1,
-        aggFilter : 'date_histogram'
-      } ])
-    });
-  }
-
-  // export the provider so that the visType can be required with Private()
-  return PrelertSwimlaneVisProvider;
-
-});
+      intervalOptions: [{display:'Auto', val:'auto'},
+                        {display:'5 minutes', val:'custom', customInterval:'5m'},
+                        {display:'10 minutes', val:'custom', customInterval:'10m'},
+                        {display:'30 minutes', val:'custom', customInterval:'30m'},
+                        {display:'1 hour', val:'h'},
+                        {display:'3 hours', val:'custom', customInterval:'3h'},
+                        {display:'12 hours', val:'custom', customInterval:'12h'},
+                        {display:'1 day', val:'d'}]
+    },
+    schemas : new Schemas([ {
+      group : 'metrics',
+      name : 'metric',
+      title : 'Value',
+      min : 1,
+      max : 1,
+      aggFilter : [ 'count', 'avg', 'sum', 'min', 'max', 'cardinality' ]
+    }, {
+      group : 'buckets',
+      name : 'viewBy',
+      icon : 'fa fa-eye',
+      title : 'View by',
+      mustBeFirst : true,
+      min : 0,
+      max : 1,
+      aggFilter : 'terms'
+    }, {
+      group : 'buckets',
+      name : 'timeSplit',
+      icon : 'fa fa-th',
+      title : 'Time field',
+      min : 1,
+      max : 1,
+      aggFilter : 'date_histogram'
+    } ])
+  });
+};
diff --git a/public/prelert_swimlane_vis.less b/public/prelert_swimlane_vis.less
@@ -15,7 +15,7 @@
     padding-right: 5px;
     padding-left: 5px;
   }
-  
+
   .flot-y-axis {
 
     .flot-tick-label {
@@ -28,22 +28,22 @@
       z-index: 1;
     }
   }
-  
+
   .prl-swimlane-vis-point-over {
     cursor: pointer !important;
   }
 }
 
 .prl-swimlane-vis-options {
   div.threshold-input-container {
-    display: block; 
+    display: block;
     padding-bottom: 7px;
-     
+
     .fa-circle {
-      display:inline; 
+      display:inline;
       font-size:16px;
     }
-    
+
     .icon-severity-critical {
       color: #fe5050;
     }
@@ -59,20 +59,20 @@
     .icon-severity-warning {
       color: #8bc8fb;
     }
-    
+
     .icon-severity-low {
       color: #d2e9f7;
     }
 
     .icon-severity-unknown {
       color: #e6e6e6;
     }
-    
+
     input[type="number"] {
       display:inline;
       width: 110px;
       font-size: 12px;
-    } 
+    }
   }
 }
 
@@ -86,7 +86,7 @@
   background-color: #303030;
   font-family: Roboto, Droid, Helvetica Neue, Helvetica, Arial, sans-serif;
   font-size: 12px;
-    
+
   hr {
     margin-top: 3px;
     margin-bottom: 3px;
@@ -98,9 +98,8 @@
   .prl-swimlane-vis {
     color: #cecece;
   }
-  
+
   .flot-tick-label {
     color: #cecece;
   }
 }
-