#1153: Change to using Chart.js with a basic RoR library instead of Chartkick because Chartkick doesn't support combo charts.

Gemfile

@@ -89,4 +89,4 @@ group :test do
   gem "codeclimate-test-reporter", "1.0.7", group: :test, require: nil
 end
 
-gem "chartkick"
+gem 'chartjs-ror'

Gemfile.lock

@@ -66,7 +66,8 @@ GEM
       activesupport (>= 3.0.0)
       uniform_notifier (~> 1.11)
     byebug (11.0.1)
-    chartkick (3.0.2)
+    chartjs-ror (3.6.4)
+      rails (>= 3.1)
     childprocess (0.9.0)
       ffi (~> 1.0, >= 1.0.11)
     climate_control (0.2.0)
@@ -285,7 +286,7 @@ DEPENDENCIES
   bootstrap-sass (= 3.4.1)
   bullet
   byebug
-  chartkick
+  chartjs-ror
   codeclimate-test-reporter (= 1.0.7)
   coffee-rails (~> 4.2.0)
   database_cleaner

app/assets/javascripts/application.js

@@ -37,5 +37,5 @@
 //= require superfish
 //= require supersubs
 
-//= require Chart.bundle
-//= require chartkick
+//= require Chart.min
+//= require chartjs-plugin-colorschemes.min

app/models/stats/actions.rb

@@ -69,6 +69,11 @@ module Stats
   
       # get percentage done cumulative
       @cum_percent_done = convert_to_cumulative_array(@actions_running_time_array, @actions_running_time.count )
+
+      return [
+        {name: "Percentage", data: @cum_percent_done.each_with_index.map { |total, week| [week, total] } , type: "line"},
+	{name: "Actions", data: @actions_running_time_array.each_with_index.map { |total, week| [week, total] } }
+      ]
     end
 
     def open_per_week_data
@@ -101,10 +106,13 @@ module Stats
       @actions_completion_day.each { |t| @actions_completion_day_array[ t.completed_at.wday ] += 1 } 
   
       # FIXME: Day of week as string instead of number
-      return [
-        {name: "Created", data: @actions_creation_day_array.each_with_index.map { |total, day| [day, total] } },
-        {name: "Completed", data: @actions_completion_day_array.each_with_index.map { |total, day| [day, total] } }
-      ]
+      return {
+	datasets: [
+	  {label: "Created", data: @actions_creation_day_array.map { |total| [total] } },
+	  {label: "Completed", data: @actions_completion_day_array.map { |total| [total] } }
+	],
+	labels: @actions_creation_day_array.each_with_index.map { |total, day| [day] }
+      }
     end
 
     def day_of_week_30days_data
@@ -121,10 +129,13 @@ module Stats
       @actions_completion_day.each { |r| @actions_completion_day_array[r.completed_at.wday] += 1 }
   
       # FIXME: Day of week as string instead of number
-      return [
-        {name: "Created", data: @actions_creation_day_array.each_with_index.map { |total, day| [day, total] } },
-        {name: "Completed", data: @actions_completion_day_array.each_with_index.map { |total, day| [day, total] } }
-      ]
+      return {
+	datasets: [
+	  {label: "Created", data: @actions_creation_day_array.map { |total| [total] } },
+	  {label: "Completed", data: @actions_completion_day_array.map { |total| [total] } }
+	],
+	labels: @actions_creation_day_array.each_with_index.map { |total, day| [day] }
+      }
     end
 
     def time_of_day_all_data
@@ -139,10 +150,13 @@ module Stats
       @actions_completion_hour_array = Array.new(24) { |i| 0}
       @actions_completion_hour.each{|r| @actions_completion_hour_array[r.completed_at.hour] += 1 } 
   
-      return [
-        {name: "Created", data: @actions_creation_hour_array.each_with_index.map { |total, hour| [hour, total] } },
-        {name: "Completed", data: @actions_completion_hour_array.each_with_index.map { |total, hour| [hour, total] } }
-      ]
+      return {
+	datasets: [
+	  {label: "Created", data: @actions_creation_hour_array.map { |total| [total] } },
+	  {label: "Completed", data: @actions_completion_hour_array.map { |total| [total] } }
+	],
+	labels: @actions_creation_hour_array.each_with_index.map { |total, hour| [hour] }
+      }
     end
 
     def time_of_day_30days_data
@@ -157,10 +171,13 @@ module Stats
       @actions_completion_hour_array = Array.new(24) { |i| 0}
       @actions_completion_hour.each{|r| @actions_completion_hour_array[r.completed_at.hour] += 1 } 
   
-      return [
-        {name: "Created", data: @actions_creation_hour_array.each_with_index.map { |total, hour| [hour, total] } },
-        {name: "Completed", data: @actions_completion_hour_array.each_with_index.map { |total, hour| [hour, total] } }
-      ]
+      return {
+	datasets: [
+	  {label: "Created", data: @actions_creation_hour_array.map { |total| [total] } },
+	  {label: "Completed", data: @actions_completion_hour_array.map { |total| [total] } }
+	],
+	labels: @actions_creation_hour_array.each_with_index.map { |total, hour| [hour] }
+      }
     end
 
     private
@@ -218,5 +235,26 @@ module Stats
       end_week.upto(start_week) { |i| a << i };
       return a
     end
+
+    def convert_to_weeks_from_today_array(records, array_size, date_method_on_todo)
+      return convert_to_array(records, array_size) { |r| [difference_in_weeks(@today, r.send(date_method_on_todo))]}
+    end
+
+    def cut_off_array_with_sum(array, cut_off)
+      # +1 to hold sum of rest
+      a = Array.new(cut_off+1){|i| array[i]||0}
+      # add rest of array to last elem
+      a[cut_off] += array.inject(:+) - a.inject(:+)
+      return a
+    end
+
+    def convert_to_cumulative_array(array, max)
+      # calculate fractions
+      a = Array.new(array.size){|i| array[i]*100.0/max}
+      # make cumulative
+      1.upto(array.size-1){ |i| a[i] += a[i-1] }
+      return a
+    end
+
   end
 end

app/views/stats/_actions.html.erb

@@ -1,4 +1,17 @@
 <%= render :partial => 'time_to_complete', :locals => {:ttc => actions.ttc} -%>
+<%
+options = {
+        width: "400px",
+        height: "400px",
+        maintainAspectRatio: false,
+        responsive: false,
+        plugins: {
+          colorschemes: {
+            scheme: 'brewer.Paired12'
+          }
+        }
+}
+%>
 
 <p><%= t('stats.actions_actions_avg_created_30days', :count => (actions.created_last30days*10.0/30.0).round/10.0 )%>
 <%= t('stats.actions_avg_completed_30days', :count => (actions.done_last30days*10.0/30.0).round/10.0 )%>
@@ -15,21 +28,21 @@
     render :partial => 'chart', :locals => {:chart => chart}
 -%><% end %>
 
-<h2>Current running time of all incomplete actions</h2>
-<%= column_chart actions.running_time_data %>
+<%
+  Rails.logger.info actions.running_time_data
+%>
 
-<h2>Active (visible and hidden) next actions per week</h2>
-<%= column_chart actions.open_per_week_data, xtitle: "Weeks ago" %>
+<%= bar_chart actions.running_time_data, library: { :series => { 0 => {type: "line"} } }, title: "Current running time of all incomplete actions" %>
 
-<h2>Day of week (all actions)</h2>
-<%= column_chart actions.day_of_week_all_data %>
+<br style="clear:both">
 
-<h2>Day of week (past 30 days)</h2>
-<%= column_chart actions.day_of_week_30days_data %>
+<%= bar_chart actions.open_per_week_data, options.merge({scales: {yAxes: [{ scaleLabel: { display: true, labelString: 'Weeks ago'}}]}, 'title': {'display': true, 'text': 'Active (visible and hidden) next actions per week'}}) %>
 
-<h2>Time of day (all actions)</h2>
-<%= column_chart actions.time_of_day_all_data %>
+<%= bar_chart actions.day_of_week_all_data, options.merge({'title': {'display': true, 'text': 'Day of week (all actions)'}}) %>
 
-<h2>Time of day (last 30 days)</h2>
-<%= column_chart actions.time_of_day_30days_data %>
+<%= bar_chart actions.day_of_week_30days_data, options.merge({'title': {'display': true, 'text': 'Day of week (past 30 days)'}}) %>
+
+<%= bar_chart actions.time_of_day_all_data, options.merge({'title': {'display': true, 'text': 'Time of day (all actions)'}}) %>
+
+<%= bar_chart actions.time_of_day_30days_data, options.merge({'title': {'display': true, 'text': 'Time of day (last 30 days)'}}) %>
 

app/views/stats/_contexts.html.erb

@@ -1,14 +1,41 @@
 <br style="clear:both">
 
-<h2>Spread of actions for all contexts</h2>
-<%= pie_chart Stats::TopContextsQuery.new(current_user).result.map { |context|
-  [context.name, context.total]
-} %>
+<% data = {
+  datasets: [{
+    data: Array.new
+  }],
+  labels: Array.new
+}
+Stats::TopContextsQuery.new(current_user).result.map { |context|
+  data[:datasets][0][:data].append(context.total)
+  data[:labels].append(context.name)
+}
+options = {
+	width: "400px",
+	height: "400px",
+	maintainAspectRatio: false,
+	responsive: false,
+	plugins: {
+	  colorschemes: {
+            scheme: 'brewer.Paired12'
+	  }
+        }
+}
+%>
+<%= pie_chart data, options.merge({'title': {'display': true, 'text': 'Spread of actions for all contexts'}}) %>
 
-<h2>Spread of actions for visible contexts</h2>
-<%= pie_chart Stats::TopContextsQuery.new(current_user, :running => true).result.map { |context|
-  [context.name, context.total]
-} %>
+<% data = {
+  datasets: [{
+    data: Array.new
+  }],
+  labels: Array.new
+  }
+Stats::TopContextsQuery.new(current_user, :running => true).result.map { |context|
+  data[:datasets][0][:data].append(context.total)
+  data[:labels].append(context.name)
+}
+%>
+<%= pie_chart data, options.merge({'title': {'display': true, 'text': 'Spread of actions for visible contexts'}}) %>
 
 <%= render :partial => 'contexts_list', :locals => {:contexts => contexts.actions, :key => 'contexts'} -%>