hawk-eye 0.0.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 21679c4d16ca79235bea0cbffd1234c722788621
+  data.tar.gz: d3ffe869b2b75ffc64177a6057178dedb25dcb92
+SHA512:
+  metadata.gz: e6f4abe501fc7bd1fc742a9f2443b742e37e749cbe44a6e62aa03dd20edb5bac3466974405957cf309e2d87ae8f84a1075a2c04379dabb64e9b25f24cc3eb7cd
+  data.tar.gz: b8eba4492c36cee2054e9ab1576767775d8478c395eb147a3910b497ca4bf39c0a9cd31037a1a1b580c377460b8d871f3bc67f44fa1dca7eddd69d6f2f460a99

data/LICENSE

@@ -0,0 +1 @@
+Copyright 2016 Companytools

data/README.md

@@ -0,0 +1,2 @@
+HawkEye
+========================================

data/Rakefile

@@ -0,0 +1,26 @@
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+require 'rdoc/task'
+
+RDoc::Task.new(:rdoc) do |rdoc|
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title    = 'HawkEye'
+  rdoc.options << '--line-numbers'
+  rdoc.rdoc_files.include('README.rdoc')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end
+
+APP_RAKEFILE = File.expand_path("../spec/dummy/Rakefile", __FILE__)
+load 'rails/tasks/engine.rake'
+
+
+load 'rails/tasks/statistics.rake'
+
+
+
+Bundler::GemHelper.install_tasks
+

data/app/assets/javascripts/hawk-eye.js.coffee

@@ -0,0 +1,2 @@
+#= require ./hawk-eye/base
+#= require_directory ./hawk-eye

data/app/assets/javascripts/hawk-eye/base.js.coffee

@@ -0,0 +1,17 @@
+class HawkEye
+  constructor: ->
+    @setup_callbacks = {}
+
+  setup: (target = $(document))->
+    for setup_label, callbacks_of_label of @setup_callbacks
+      callbacks_of_label.forEach (callback)=>
+        callback.call(@, target)
+
+  register_setup: (label_or_callback, labelled_callback)->
+    unless labelled_callback?
+      labelled_callback = label_or_callback
+      label_or_callback = 'anonymous'
+    (@setup_callbacks[label_or_callback] ||= []).push labelled_callback
+
+@HawkEye = new HawkEye()
+Dunlop.register_setup 'hawk-eye', (target) => @HawkEye.setup(target)

data/app/assets/javascripts/hawk-eye/date-bin-variable.js.coffee

@@ -0,0 +1,256 @@
+class DateBinVariable
+  constructor: ->
+    @config = {}
+  configure: (config)->
+    @config = config
+    @setup()
+  setup: (data)->
+    @data = data if data
+    return unless @data
+    #window.data = data
+    @has_no_date = !!data.payload['no_date']
+    @container = $(data.target).html('')
+    @min_date = moment(@data.min_date)
+    @max_date = moment(@data.max_date)
+    @bin_type = data.bin_type
+    @date_key_format = "YYYY-MM-DD"
+    @active_facets = []
+
+    @generate_bar_chart()
+    @generate_facet_charts()
+
+
+  generate_bar_chart: ->
+    @bar_chart_container = $('<div></div>').addClass('bar-chart').appendTo(@container)
+    @set_bar_chart_keys()
+    columns = []
+    for variable in @data.variables
+      columns.push @get_variable_column(variable)
+    columns.unshift @bar_chart_ticks()
+
+    # Activating focus date helpers
+    number_of_ticks = columns[0].length - 1
+    number_of_variables = @data.variables.length
+
+    @bar_chart = c3.generate
+      bindto: @bar_chart_container.get(0)
+      data:
+        x: 'x'
+        columns: columns
+        type: 'bar'
+        #onmouseover: (d) => @recalculate_facets(date: d.x, variable: d.id)
+        #onmouseout: => @recalculate_facets()
+        onclick: (d, path)=>
+          return if @active_facets.length
+          `var graph=this`
+          color_def = {}
+          date_key = @bar_chart_keys[d.index]
+
+          if @focus_date is date_key
+            @focus_date = null
+            graph.data.colors @original_bar_chart_colors
+          else
+            #color_def[d.id] = "#aaaaaa"
+            for var_name in Object.keys(graph.data.colors())
+              color_def[var_name] = "#aaaaaa"
+
+            graph.data.colors(color_def)
+            # ugly solution to manually color the svg paths another color after render
+            delay 500, ->
+              bar_paths = $(graph.element).find('path.c3-bar')
+              for ivar in [0...number_of_variables]
+                bar_paths.get(d.x + ivar*number_of_ticks).style.fill = "rgb(200,100,100)"
+            @focus_date = date_key
+          @recalculate_facets(date: @focus_date)
+      axis:
+        x:
+          type: 'category'
+    @original_bar_chart_colors = $.extend({}, @bar_chart.data.colors())
+
+  reload_bar_chart: ->
+    columns = []
+    for variable in @data.variables
+      columns.push @get_variable_column(variable)
+    #columns.unshift @bar_chart_ticks()
+    @bar_chart.load
+      columns: columns
+
+  recalculate_facets: (options = {})->
+    for variable in @data.variables
+      #continue if options.variable and (options.variable is variable.name or options.variable is variable.label)
+      for facet, facet_index in @data.facets
+        facet_columns = []
+        for facet_value in facet.values
+          facet_total = @get_facet_total(variable.name, facet_index, facet_value, options)
+          facet_columns.push [facet_value, facet_total]
+        @facets[variable.name][facet.name].chart.load(columns: facet_columns)
+        @set_facet_legend_rows @facets[variable.name][facet.name].container.find('tbody'), facet_columns
+
+  generate_facet_charts: ->
+    @facets = {}
+    for variable in @data.variables
+      @facets[variable.name] = {}
+      for facet, facet_index in @data.facets
+        facet_container = $('<div></div>').addClass('facet-container').addClass(facet.name).data('variable', variable.name).data('facet', facet.name).appendTo(@container)
+        facet_graph_container = $('<div></div>').addClass('facet-graph').addClass(facet.name).appendTo(facet_container)
+        facet_legend = $("<div><table><thead><tr><th colspan='99'>#{facet.label}</th></tr></thead><tbody></tbody></table></div>").addClass('facet-legend').addClass(facet.name).addClass(variable.name).appendTo(facet_container)
+        facet_legend_body = facet_legend.find('tbody')
+        facet_container.append()
+        @facets[variable.name][facet.name] = {container: facet_container, index: facet_index}
+        facet_columns = []
+        for facet_value in facet.values
+          facet_columns.push [facet_value, @get_facet_total(variable.name, facet_index, facet_value)]
+        @set_facet_legend_rows(facet_legend_body, facet_columns)
+        do (variable, facet, facet_index) => # lock iteration closure
+          graph_settings =
+            bindto: facet_graph_container.get(0)
+            data:
+              columns: facet_columns
+              type: 'pie'
+              onclick: (d)=>
+                return if @focus_date
+                @set_active_facet variable, facet, d.id
+                true
+            pie:
+              label:
+                format: (value, ratio, id) -> value
+            legend:
+              item:
+                onclick: (facet_value)=>
+                  @set_active_facet(variable, facet, facet_value)
+                  true
+                #format: (value, ratio, id) -> "#{value} #{d3.format('%')(ratio)}"
+          if colors = @config.facet?.colors?[facet.name]
+            graph_settings.data.colors = colors
+          @facets[variable.name][facet.name].chart = c3.generate graph_settings
+
+  set_active_facet: (variable, facet, facet_value) ->
+    facet_css_class = facet.name
+    $(".facet-container.#{facet_css_class} .facet-legend tr").removeClass('facet-active')
+    $(".facet-container.#{facet_css_class} .c3-chart-arc").removeClass("facet-active").removeClass("facet-inactive")
+    facet_already_active = false
+    for active_facet in @active_facets
+      if active_facet.name is facet.name
+        facet_already_active = true
+        if active_facet.values[0] is facet_value # second click on same face value removes the facet lock
+          @active_facets = @active_facets.filter( (active_facet) -> active_facet.name isnt facet.name )
+        else # other facet value is chosen
+          active_facet.values = [facet_value]
+          $(".facet-container.#{facet_css_class} .facet-legend tr.legend-var-#{facet_value.dasherize()}").addClass('facet-active')
+          $(".facet-container.#{facet_css_class} .c3-chart-arc").addClass('facet-inactive')
+          $(".facet-container.#{facet_css_class} .c3-chart-arc.c3-target-#{facet_value.dasherize()}").removeClass("facet-inactive").addClass('facet-active')
+      else
+        # limit other facets
+    unless facet_already_active
+      @active_facets.push
+        name: facet.name
+        label: facet.label
+        values: [facet_value]
+        variable: variable.name
+        index: @facets[variable.name][facet.name].index
+      $(".facet-container.#{facet_css_class} .c3-chart-arc").addClass('facet-inactive')
+      $(".facet-container.#{facet_css_class} .c3-chart-arc.c3-target-#{facet_value.dasherize()}").removeClass("facet-inactive").addClass('facet-active')
+      $(".facet-container.#{facet_css_class} .facet-legend tr.legend-var-#{facet_value.dasherize()}").addClass('facet-active')
+    @reload_bar_chart()
+
+  set_facet_legend_rows: (tbody, rows)->
+    total = rows.reduce( ((t, r)-> t + r[1]), 0)
+    tbody.html('')
+    for row in rows
+      html_row = $('<tr></tr>').addClass("legend-var-#{String(row[0]).dasherize()}")
+      html_row.append $('<td></td>').text row[0]
+      html_row.append $('<td></td>').text row[1]
+      html_row.append $('<td></td>').text d3.format('%')(row[1]/total)
+      tbody.append html_row
+    tbody
+
+  get_facet_total: (variable, facet_index, facet_value, options = {})->
+    return @get_facet_total_for_date(options.date, variable, facet_index, facet_value) if options.date
+    total = 0
+    for date, results of @data.payload
+      total += @get_facet_total_for_date(date, variable, facet_index, facet_value, results)
+    total
+
+  get_facet_total_for_date: (date, variable, facet_index, facet_value, results)->
+    results ||= @data.payload[date]
+    results ||= []
+    total = 0
+    for result in results
+      total += result[variable] if result[variable] and result.facets[facet_index] is facet_value
+    total
+
+  get_variable_column: (variable)->
+    ary = [variable.label]
+    for bar_chart_key in @bar_chart_keys
+      ary.push @get_variable_total(variable.name, bar_chart_key)
+    ary
+
+  set_bar_chart_keys: ->
+    @bar_chart_keys = []
+    if @has_no_date
+      @bar_chart_keys.push 'no_date'
+    date_key = @min_date.format(@date_key_format)
+    @bar_chart_keys.push date_key
+    next_date = moment(@min_date).add(1, @bin_type)
+    while next_date <= @max_date
+      date_key = next_date.format(@date_key_format)
+      @bar_chart_keys.push date_key
+      next_date.add 1, @bin_type
+    @bar_chart_keys
+
+  get_variable_total: (variable, num)->
+    return 0 unless result_parts = @data.payload[num]
+    if @active_facets.length
+      total = 0
+      for result_part in result_parts
+        # do not add the value to the total if the facet value is not present in the result part
+        should_be_added_to_total = true
+        for active_facet in @active_facets
+          should_be_added_to_total = false unless active_facet.values.indexOf(result_part.facets[active_facet.index]) > -1
+        total += result_part[variable] if should_be_added_to_total
+      return total
+    else
+      return result_parts.map((part)->part[variable]).reduce (t, v) -> t + v
+
+  bar_chart_ticks: ->
+    x_row = ['x'] # tick below the bar
+    start_index = 0
+    if @has_no_date
+      x_row.push 'x'
+      start_index += 1 # first key will be 'no_date'
+    for key in @bar_chart_keys.slice(start_index)
+      x_row.push @format_bar_tick(key)
+    #x_row = x_row.concat ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
+    x_row
+
+  format_bar_tick: (key)->
+    date = moment(key)
+    format = "YYYY-MM-DD"
+    switch @bin_type
+      when "quarter" then return "#{date.quarter()}/#{date.year()}"
+      when "month"
+        format = "MMM"
+        format += " YY" if @min_date.year() isnt @max_date.year()
+      when "week"
+        result = "#{date.week()}"
+        result += "/#{date.year()}" if @min_date.year() isnt @max_date.year()
+        return result
+
+    date.format format
+HawkEye.DateBinVariable = new DateBinVariable()
+HawkEye.DateBinVariable.configure
+  facet:
+    colors:
+      state:
+        uncategorized: "#eee"
+        unplanned: "#aaa"
+        planned: "#aaa"
+        active: "#55f"
+        overdue: "#ffa500"
+        any_rejected: "#e44"
+        all_completed: "#5b5"
+        # workflow_step - duplicates
+        pending: "#eee"
+        processing: "#55f"
+        rejected: "#e44"
+        completed: "#5b5"

data/app/assets/javascripts/hawk-eye/test.js.coffee

@@ -0,0 +1,256 @@
+@dashboard = (id, fData) ->
+  barColor = 'steelblue'
+  # compute total for each state.
+
+  segColor = (c) ->
+    {
+      stateO: '#807dba'
+      stateP: '#e08214'
+      stateT: '#41ab5d'
+    }[c]
+
+  # function to handle histogram.
+
+  histoGram = (fD) ->
+    hG = {}
+    hGDim =
+      t: 60
+      r: 0
+      b: 30
+      l: 0
+
+    mouseover = (d) ->
+      # utility function to be called on mouseover.
+      # filter for selected state.
+      st = fData.filter((s) ->
+        s.State == d[0]
+      )[0]
+      nD = d3.keys(st.freq).map((s) ->
+        {
+          type: s
+          freq: st.freq[s]
+        }
+      )
+      # call update functions of pie-chart and legend.
+      pC.update nD
+      leg.update nD
+      return
+
+    mouseout = (d) ->
+      # utility function to be called on mouseout.
+      # reset the pie-chart and legend
+      pC.update tF
+      leg.update tF
+      return
+
+    hGDim.w = 500 - (hGDim.l) - (hGDim.r)
+    hGDim.h = 300 - (hGDim.t) - (hGDim.b)
+    #create svg for histogram.
+    hGsvg = d3.select(id).append('svg').attr('width', hGDim.w + hGDim.l + hGDim.r).attr('height', hGDim.h + hGDim.t + hGDim.b + 100).append('g').attr('transform', 'translate(' + hGDim.l + ',' + hGDim.t + ')')
+    # create function for x-axis mapping.
+    x = d3.scale.ordinal().rangeRoundBands([
+      0
+      hGDim.w
+    ], 0.1).domain(fD.map((d) ->
+      d[0]
+    ))
+    # Add x-axis to the histogram svg.
+    hGsvg.append('g').attr('class', 'x axis').attr('transform', 'translate(0,' + hGDim.h + ')')
+      .call(d3.svg.axis().scale(x).orient('bottom'))
+      .selectAll('text')
+      .style("text-anchor", "end")
+      .attr("dx", "-.8em")
+      .attr("dy", ".15em")
+      .attr("transform", "rotate(-65)" )
+    # Create function for y-axis map.
+    y = d3.scale.linear().range([
+      hGDim.h
+      0
+    ]).domain([
+      0
+      d3.max(fD, (d) ->
+        d[1]
+      )
+    ])
+    # Create bars for histogram to contain rectangles and freq labels.
+    bars = hGsvg.selectAll('.bar').data(fD).enter().append('g').attr('class', 'bar')
+    #create the rectangles.
+    bars.append('rect').attr('x', (d) ->
+      x d[0]
+    ).attr('y', (d) ->
+      y d[1]
+    ).attr('width', x.rangeBand()).attr('height', (d) ->
+      hGDim.h - y(d[1])
+    ).attr('fill', barColor).on('mouseover', mouseover).on 'mouseout', mouseout
+    # mouseout is defined below.
+    #Create the frequency labels above the rectangles.
+    bars.append('text').text((d) ->
+      d3.format(',') d[1]
+    ).attr('x', (d) ->
+      x(d[0]) + x.rangeBand() / 2
+    ).attr('y', (d) ->
+      y(d[1]) - 5
+    ).attr 'text-anchor', 'middle'
+    # create function to update the bars. This will be used by pie-chart.
+
+    hG.update = (nD, color) ->
+      # update the domain of the y-axis map to reflect change in frequencies.
+      y.domain [
+        0
+        d3.max(nD, (d) ->
+          `var bars`
+          d[1]
+        )
+      ]
+      # Attach the new data to the bars.
+      bars = hGsvg.selectAll('.bar').data(nD)
+      # transition the height and color of rectangles.
+      bars.select('rect').transition().duration(500).attr('y', (d) ->
+        y d[1]
+      ).attr('height', (d) ->
+        hGDim.h - y(d[1])
+      ).attr 'fill', color
+      # transition the frequency labels location and change value.
+      bars.select('text').transition().duration(500).text((d) ->
+        d3.format(',') d[1]
+      ).attr 'y', (d) ->
+        y(d[1]) - 5
+      return
+
+    hG
+
+  # function to handle pieChart.
+
+  pieChart = (pD) ->
+    pC = {}
+    pieDim =
+      w: 250
+      h: 250
+    # Utility function to be called on mouseover a pie slice.
+
+    mouseover = (d) ->
+      # call the update function of histogram with new data.
+      hG.update fData.map((v) ->
+        [
+          v.State
+          v.freq[d.data.type]
+        ]
+      ), segColor(d.data.type)
+      return
+
+    #Utility function to be called on mouseout a pie slice.
+
+    mouseout = (d) ->
+      # call the update function of histogram with all data.
+      hG.update fData.map((v) ->
+        [
+          v.State
+          v.total
+        ]
+      ), barColor
+      return
+
+    # Animating the pie-slice requiring a custom function which specifies
+    # how the intermediate paths should be drawn.
+
+    arcTween = (a) ->
+      i = d3.interpolate(@_current, a)
+      @_current = i(0)
+      (t) ->
+        arc i(t)
+
+    pieDim.r = Math.min(pieDim.w, pieDim.h) / 2
+    # create svg for pie chart.
+    piesvg = d3.select(id).append('svg').attr('width', pieDim.w).attr('height', pieDim.h).append('g').attr('transform', 'translate(' + pieDim.w / 2 + ',' + pieDim.h / 2 + ')')
+    # create function to draw the arcs of the pie slices.
+    arc = d3.svg.arc().outerRadius(pieDim.r - 10).innerRadius(0)
+    # create a function to compute the pie slice angles.
+    pie = d3.layout.pie().sort(null).value((d) ->
+      d.freq
+    )
+    # Draw the pie slices.
+    piesvg.selectAll('path').data(pie(pD)).enter().append('path').attr('d', arc).each((d) ->
+      @_current = d
+      return
+    ).style('fill', (d) ->
+      segColor d.data.type
+    ).on('mouseover', mouseover).on 'mouseout', mouseout
+    # create function to update pie-chart. This will be used by histogram.
+
+    pC.update = (nD) ->
+      piesvg.selectAll('path').data(pie(nD)).transition().duration(500).attrTween 'd', arcTween
+      return
+
+    pC
+
+  # function to handle legend.
+
+  legend = (lD) ->
+    `var legend`
+    leg = {}
+    # create table for legend.
+    legend = d3.select(id).append('table').attr('class', 'legend')
+    # create one row per segment.
+    tr = legend.append('tbody').selectAll('tr').data(lD).enter().append('tr')
+    # create the first column for each segment.
+
+    getLegend = (d, aD) ->
+      # Utility function to compute percentage.
+      d3.format('%') d.freq / d3.sum(aD.map((v) ->
+        v.freq
+      ))
+
+    tr.append('td').append('svg').attr('width', '16').attr('height', '16').append('rect').attr('width', '16').attr('height', '16').attr 'fill', (d) ->
+      segColor d.type
+    # create the second column for each segment.
+    tr.append('td').text (d) ->
+      d.type
+    # create the third column for each segment.
+    tr.append('td').attr('class', 'legendFreq').text (d) ->
+      d3.format(',') d.freq
+    # create the fourth column for each segment.
+    tr.append('td').attr('class', 'legendPerc').text (d) ->
+      getLegend d, lD
+    # Utility function to be used to update the legend.
+
+    leg.update = (nD) ->
+      # update the data attached to the row elements.
+      l = legend.select('tbody').selectAll('tr').data(nD)
+      # update the frequencies.
+      l.select('.legendFreq').text (d) ->
+        d3.format(',') d.freq
+      # update the percentage column.
+      l.select('.legendPerc').text (d) ->
+        getLegend d, nD
+      return
+
+    leg
+
+  fData.forEach (d) ->
+    d.total = d.freq.stateO + d.freq.stateP + d.freq.stateT
+    return
+  # calculate total frequency by segment for all state.
+  tF = [
+    'stateO'
+    'stateP'
+    'stateT'
+  ].map((d) ->
+    {
+      type: d
+      freq: d3.sum(fData.map((t) ->
+        t.freq[d]
+      ))
+    }
+  )
+  # calculate total frequency by state for all segment.
+  sF = fData.map((d) ->
+    [
+      d.State
+      d.total
+    ]
+  )
+  hG = histoGram(sF)
+  pC = pieChart(tF)
+  leg = legend(tF)
+  # create the legend.
+  return