feat(sumologic-image-widget) : Hubot can display widget from a sumologic dashboard

.gitignore

@@ -2,3 +2,5 @@ node_modules
 .DS_Store*
 .hubot_history
 .idea
+custom
+dump.rdb

README.md

@@ -212,3 +212,134 @@ Add the subdomain hubot should connect to. If you web URL looks like
 
 You may want to get comfortable with `heroku logs` and `heroku restart` if
 you're having issues.
+
+
+# (Payou - Experiments) Display a widget from sumologic
+
+## Idea
+
+From a Sumologic dashboard widget, be able to display it as an image
+
+## How
+
+Step one : Target the good widget
+For now we can't do it easily while the dashboard API from Sumologic is broken.
+For now we should link manually id to widget :cry:
+
+Step two : Transform widget data to graph
+
+Thanks to jsdom and highcharts we can transform what sumologic return to a graph.
+This process will be manual in a first time for testing purpose, then a bit 
+industrialize to display all widget possible. Sumologic seems to use highcharts 
+for rendering their widget, so this part shouldn't be hard...
+
+Step three : Transform svg graph to image
+
+For now we will use svg2png, it use phamtomjs in background for extract png from
+svg. Not the nicer solution but the easiest for now. Other lib are only wrapper 
+of lower image libs. Maybe this latest solution is faster than the previous and 
+we should consider it on long term maybe. But this one is harder to implement and
+depend on which OS the hubot will run.
+
+Step Four : Host/Send the img to slack
+
+At first sight, Hubot should send image generated.
+Not the hardest part, seems slack api have what we need to do it !
+We just need to implement that part and we should be done !
+
+Could send it to a third part and just send link in a channel to.
+
+## usefull commands
+
+```
+// Will launch the test bouzin !
+coffee ./scripts/hubot-sumologic-image-widget/main.coffee
+
+// Will launch the gist test bouzin !
+node ./scripts/hubot-sumologic-image-widget/gist.js
+```
+
+## Now
+
+### Version 1.0
+- [x] Tests the all chain !
+- [x] Use real data from sumologic widget
+- [x] Implement some highchart adapters depending of widget
+- [x] Add Hubot hear for this dev
+- [x] Test on a true slack
+- [x] Graph can be built on highchart or svg template
+  - [x] Split how work graph builder for allowing multiple implementation
+  - [x] Base on graph type
+- [x] Use promises !
+   - [x] Break callback hell into promise composition
+- [x] Clean generated image file
+  - [x] Auto find tmp file
+  - [x] Use it
+- [x] Style graph
+- [x] Learn hubot to learn
+  - [x] Learn from a json file (brain used)
+  - [x] Allow to erase memory via a command
+- [x] Clean && Tidy && Refactor if needed
+  - [x] Clean todo's
+  - [x] SendToSlack (ensure work for common cases)
+- [ ] Package it !
+  - [ ] Boulangerie repo
+    - [ ] Issues followings subjects
+    - [ ] Millestone them ?
+  - [ ] Readme
+  - [ ] Npm publish 
+
+### Learn hubot to learn
+POC on fact hubot can get a json file through slack
+Can be a link to file but it's less safer
+Finally we can brainwash hubot if we want !
+Maybe if sumologic fix their API we could use it properly
+and avoid a lot of this stuff
+
+#### Edit
+Some of this feature have already been done.
+But this part of this package could improved a bit more
+
+- [] Erase brain should be possible only by some users
+- [] Should list all widget available...
+- [] Should add/update/remove unitary by a command
+
+### Learn hubot to make graphs with query
+Instead of using dashboard data, use true results from
+a custom query. The naive way should to transform query
+results into dashboard data format. Like this graphs implementation
+should work as expected without no update on it.
+
+We should use the same hubot command, but hubot have to warn user
+the result could not come as quickly as a widget result 
+
+- [ ] Associate a query with a name and a graph type
+- [ ] Implement logic to transform sumo data into something usable for graph
+- [ ] Add hubot behavior
+- [ ] (Depending of : Learn hubot to learn) Update or consider it
+
+
+### Learn hubot to make beautiful graphs
+- [ ] Missing infos
+  - [ ] Time range of current graph
+- [ ] Missing graph
+  - [ ] Donuts
+  - [ ] Text percentage
+  - [ ] Filled line chart
+- [ ] Upgrade logic behind how we format rawData from sumo (to dumb for now)
+- [ ] Style should be configurable
+- [ ] Apply Color rules on some of them when sumo will give us that details 
+
+### Learn hubot to leave rocks for find his bullshit ! 
+- [ ] Implement a true logger to see what hubot do
+
+### Improve filesystem management
+Instead of using promise of folder, use it or flag, this could avoid problem 
+with promise. Other solution should be to create it at module install
+
+- [ ] Spec it :)
+
+### Other points
+- [ ] Find a way to delete what hubot send to slack
+- [ ] Make this part of hubot more customisable via brain of something (theme ?)
+

package.json

@@ -1,7 +1,11 @@
 {
-  "name": "hubot",
+  "name": "hubot-mill",
   "version": "0.0.0",
-  "description": "A simple helpful robot for your Company",
+  "description": "Our cool dear hubot which help us to make good things at Boulangerie",
+  "scripts": {
+    "dev": "./bin/hubot",
+    "payou-dev": "coffee ./scripts/hubot-sumologic-image-widget/main.coffee"
+  },
   "dependencies": {
     "gitio2": "^3.1.0",
     "hubot": "^2.18.0",
@@ -26,5 +30,15 @@
   "engines": {
     "node": "0.10.x",
     "npm": "2.14.7"
+  },
+  "devDependencies": {
+    "bluebird": "^3.3.4",
+    "form-data": "^0.2.0",
+    "highcharts": "^4.2.3",
+    "jsdom": "^8.1.0",
+    "moment": "^2.12.0",
+    "numeral": "^1.5.3",
+    "pn": "^1.0.0",
+    "svg2png": "^3.0.0"
   }
 }

scripts/dashboard.coffee

@@ -1,3 +1,7 @@
+Util = require "util"
+_ = require "lodash"
+getRandomItem = (items) => items[Math.floor(Math.random()*items.length)]
+
 # Description:
 #   Example scripts for you to examine and try out.
 #
@@ -10,7 +14,7 @@
 
 class Dashboard
   # Static
-  @SumologicToken: process.env.SUMOLOGIC_TOKEN || "ZnJvbnRlbmRAdGVhZHMudHY6RzhMZGNKdHVSTTh5IQ=="
+  @SumologicToken: process.env.SUMOLOGIC_TOKEN
   @sumoId: '140742254'
   @getSumoURLById: (id) -> 'https://service.sumologic.com/ui/dashboard.html?f=' + id + '&t=d'
 
@@ -36,10 +40,32 @@ class Dashboard
         @robot.brain.data.dashboard.sumologic.dashboards = dashboards
         done(@robot.brain.data.dashboard.sumologic.dashboards)
 
+  getSumologicDashboardData: (dashId) ->
+    @robot.http("https://api.sumologic.com/api/v1/dashboards/"+dashId+"/data")
+      .header('Authorization', 'Basic ' + Dashboard.SumologicToken)
+      .get() (err, res, body) =>
+        dashboardData = JSON.parse(body).dashboardMonitorDatas
+        console.log JSON.stringify(dashboardData, null, 4)
+
+  getSumologicDashboardInfo: (dashId) ->
+    @robot.http("https://api.sumologic.com/api/v1/dashboards/"+dashId)
+      .header('Authorization', 'Basic ' + Dashboard.SumologicToken)
+      .get() (err, res, body) =>
+        dashboardInfo = JSON.parse(body).dashboard
+        console.log JSON.stringify(dashboardInfo, null, 4)
+
+
+class WidgetDisplay
+  constructor: (@robot, widgetKey) ->
+    [@dashboardId, @widgetId] = @widgetKey.split('-')
+
+  show: () ->
+    console.log "This is the widget #{@widgetId} from dashboard #{@dashboardId}"
+
+  fetch: () ->
+    console.log "I will fetch something from sumo"
+
 
-Util = require "util"
-_ = require "lodash"
-getRandomItem = (items) => items[Math.floor(Math.random()*items.length)]
 
 module.exports = (robot) ->
 
@@ -49,6 +75,7 @@ module.exports = (robot) ->
                 Dashboard URL manager
                 `!dashboard set <url>` : Switch to given URL
                 `!dashboard sumo <dashboardId>` : Switch to the dashboardId URL
+                `!dashboard show <dashboardId>-<widgetId>` : Get picture of a widget
                 `!dashboard [-c|--current]` : Display current URL
                 `!dashboard [-l|--list]` : List sumologic dashboard
                 `!dashboard [-d|--default]` : Set default dashboard
@@ -82,6 +109,15 @@ module.exports = (robot) ->
     else if key in ["set"]
       msg.send(dashboard.setCurrentUrl(value))
 
+    else if key in ["info"]
+      dashboard.getSumologicDashboardInfo(value)
+
+    else if key in ["data"]
+      dashboard.getSumologicDashboardData(value)
+
+    else if key in ["show"]
+      new WidgetDisplay(value).show()
+
     else if key in ["sumo"]
       dashboard.setCurrentUrl(Dashboard.getSumoURLById(value))
       msg.send('Current url is now ' + dashboard.getCurrentUrl())
@@ -117,4 +153,5 @@ module.exports = (robot) ->
     res.json({
       url: dashboard.getCurrentUrl(),
       history: dashboard.getHistory()
-    })
+    })
+

scripts/hubot-sumologic-image-widget/constants/momentTimeUnitMapping.json

@@ -0,0 +1,18 @@
+[
+  {
+    "unit": "milliseconds",
+    "format": "ms"
+  },
+  {
+    "unit": "seconds",
+    "format": "s"
+  },
+  {
+    "unit": "minutes",
+    "format": "m"
+  },
+  {
+    "unit": "hours",
+    "format": "h"
+  }
+]

scripts/hubot-sumologic-image-widget/graphs/counterChart.coffee

@@ -0,0 +1,33 @@
+_                 = require 'lodash'
+numeral           = require 'numeral'
+counterTpl        = require './svgTpl/counter.tpl'
+SvgHelper         = require '../helpers/graphs/svgHelper'
+
+class CounterChart
+  constructor: (@name, @config, @rawData) ->
+    @template = _.template(counterTpl)
+    @variables = SvgHelper.getDimensions(@config)
+    @svg = @template(_.merge(@variables, @format(@rawData)))
+
+  getSvg: () ->
+    @svg
+
+  format: (rawData) ->
+    fieldName =  @extractFieldName(_.get(rawData, 'fields', []))
+    value  = _.parseInt(_.get(rawData, "records.0.map.#{fieldName}"))
+    numberFormatted = numeral(value).format('0a').match(/([0-9]*)([a-zA-Z])?$/)
+    if _.isUndefined(numberFormatted[2])
+      numberFormatted[2] = ''
+    return {value : numberFormatted[1], metric: numberFormatted[2]}
+
+  extractFieldName: (fields) ->
+    allowedFieldTypes = ['int', 'double']
+    field = _.filter(fields, (item) ->
+      _.includes(allowedFieldTypes, item.fieldType)
+    )
+    if field.length is 1
+      return _.first(field).name
+    else
+      throw "Counter Graph : Don't find an eligible field, in JSON after #{JSON.stringify(fields, null, 4)}"
+
+module.exports = CounterChart

scripts/hubot-sumologic-image-widget/graphs/linesChart.coffee

@@ -0,0 +1,66 @@
+_                 = require 'lodash'
+HighchartsHelper  = require '../helpers/highcharts/highchartsHelper'
+
+class LinesChart
+  constructor: (@name, @config, @rawData) ->
+    @svg = HighchartsHelper.getNewPlayground(@format(@rawData))
+
+  getSvg: () ->
+    @svg  
+
+  format: (rawData) ->
+    @data = {
+      chart:
+        forExport: true
+        width: 800
+        height: 600
+      title:
+        text: @name
+      xAxis:
+        type: 'datetime'
+        min: rawData.resolvedTimeRange.startMillis
+        max: rawData.resolvedTimeRange.endMillis
+      plotOptions:
+        series:
+          marker:
+            enabled: false
+      series: @formatSeries(rawData)
+    }
+
+  #rawData is like raw.stackedbar.json
+  #Function goal format it like highchart.stackedbar.js (series)
+  formatSeries: (rawData) ->
+    flatData = _.mapValues(rawData.records, 'map')
+
+    seriesKeys = _(flatData)
+      .mapValues(_.keys)
+      .toArray()
+      .flattenDeep()
+      .uniq()
+      .zipObject()
+      .mapValues( (v, k) ->
+        return k
+      )
+      .value()
+
+    createSerie = (v, k) ->
+      return {name : k, data:[]}
+
+    xKeyFinder = _.partial(_.startsWith, _, '_')
+    xKey = _(seriesKeys).chain().pickBy(xKeyFinder).values().first().value()
+    series = _(seriesKeys).chain().omitBy(xKeyFinder).mapValues(createSerie).value()
+
+
+    _.forEach(flatData, (record) ->
+      _.forIn(record, (value, key, item) ->
+        if (key isnt xKey)
+          series[key].data.push({
+            x: _.parseInt(item[xKey])
+            y: _.parseInt(value)
+          })
+      )
+    )
+    return _.toArray(series);
+
+
+module.exports = LinesChart