chartkick 0.0.2 → 0.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 7cff1f5410c612571c17f1d8e2f4dd0fef8a2a3f
-  data.tar.gz: a4b70704b7e4b5c233382dda51bb9a45a2b65f5c
+  metadata.gz: e5bfc65a915cb616197a9dbd513eabecc1329c77
+  data.tar.gz: 86d3cec3916edf351936d5db2255b55d4e9950f5
 SHA512:
-  metadata.gz: a2b0e9e917045bcafc1069ef5fc3743de290c4ae42b95adb3b96b403450f334336769144a638390e4b28f3587a734edc292792ad756b879312596ffb3a308177
-  data.tar.gz: 9a40777c914f017f637da7af79c4da86d87ba94de53dacf271a852d7097ac7c5ee92bf06cbf919db01033499f9f89b9b624ed9ad196d1a84e9c9c225494dd096
+  metadata.gz: 543d3fe3a54d083c5964d3e6a48b86e6ef206ce1e24c472b84aec713ce16860c1b7d025761d0f8c2e7dfa3f927573e0160331fe9ac53f062f57815d98408c4cd
+  data.tar.gz: 686b706c7bdc764a3919698a1b59a37ad41248ab265b813e88cd65d9f4719964e2070faac03815b7102e3075de1b91c819517d1aa8d199bda647bad5b52bf00a

data/README.md

@@ -31,7 +31,9 @@ Column chart
 Multiple series (except pie chart)
 
 ```erb
-<%= line_chart Goal.all.map{|goal| {:name => goal.name, :data => goal.feats.group_by_week(:created_at).count } } %>
+<%= line_chart @goals.map{|goal|
+    {:name => goal.name, :data => goal.feats.group_by_week(:created_at).count }
+} %>
 ```
 
 ### Say Goodbye To Timeouts
@@ -82,9 +84,10 @@ Pass data as a Hash or Array
 For multiple series, use the format
 
 ```erb
-<% series_a = {time_0 => 5, time_1 => 7} # Hash %>
-<% series_b = [[time_0, 8], [time_1, 9]] # or Array %>
-<%= line_chart [{:name => "Series A", :data => series_a, {:name => "Series B", :data => series_b}] %>
+<%= line_chart [
+  {:name => "Series A", :data => series_a},
+  {:name => "Series B", :data => series_b}
+] %>
 ```
 
 Times can be a time, a timestamp, or a string (strings are parsed)
@@ -132,6 +135,10 @@ Chartkick doesn’t require Ruby.
 
 Download [chartkick.js](https://raw.github.com/ankane/chartkick/master/app/assets/javascripts/chartkick.js)
 
+## Credits
+
+Chartkick uses [iso8601.js](https://github.com/Do/iso8601.js) to parse dates and times.
+
 ## Contributing
 
 1. Fork it

data/app/assets/javascripts/chartkick.js

@@ -1,13 +1,11 @@
 /*jslint browser: true, indent: 2, plusplus: true */
-/*global google*/
+/*global google, $*/
 
 (function() {
   'use strict';
 
-  // vendor
-
   // http://stackoverflow.com/questions/728360/most-elegant-way-to-clone-a-javascript-object
-  var clone = function(obj) {
+  function clone(obj) {
     var copy, i, attr, len;
 
     // Handle the 3 simple types, and null or undefined
@@ -43,18 +41,21 @@
     }
 
     throw new Error("Unable to copy obj! Its type isn't supported.");
-  };
+  }
 
   // https://github.com/Do/iso8601.js
-  var DECIMAL_SEPARATOR, ISO8601_PATTERN;
-  ISO8601_PATTERN = /(\d\d\d\d)(\-)?(\d\d)(\-)?(\d\d)(T)?(\d\d)(:)?(\d\d)?(:)?(\d\d)?([\.,]\d+)?($|Z|([\+\-])(\d\d)(:)?(\d\d)?)/i;
-  DECIMAL_SEPARATOR = String(1.5).charAt(1);
+  var ISO8601_PATTERN = /(\d\d\d\d)(\-)?(\d\d)(\-)?(\d\d)(T)?(\d\d)(:)?(\d\d)?(:)?(\d\d)?([\.,]\d+)?($|Z|([\+\-])(\d\d)(:)?(\d\d)?)/i;
+  var DECIMAL_SEPARATOR = String(1.5).charAt(1);
 
-  var parseISO8601 = function(input) {
+  function parseISO8601(input) {
     var day, hour, matches, milliseconds, minutes, month, offset, result, seconds, type, year;
     type = Object.prototype.toString.call(input);
-    if (type === '[object Date]') return input;
-    if (type !== '[object String]') return;
+    if (type === '[object Date]') {
+      return input;
+    }
+    if (type !== '[object String]') {
+      return;
+    }
     if (matches = input.match(ISO8601_PATTERN)) {
       year = parseInt(matches[1], 10);
       month = parseInt(matches[3], 10) - 1;
@@ -66,15 +67,19 @@
       result = Date.UTC(year, month, day, hour, minutes, seconds, milliseconds);
       if (matches[13] && matches[14]) {
         offset = matches[15] * 60;
-        if (matches[17]) offset += parseInt(matches[17], 10);
+        if (matches[17]) {
+          offset += parseInt(matches[17], 10);
+        }
         offset *= matches[14] === '-' ? -1 : 1;
         result -= offset * 60 * 1000;
       }
       return new Date(result);
     }
-  };
+  }
+  // end iso8601.js
 
-  // source
+  // only functions that need defined specific to charting library
+  var renderLineChart, renderPieChart, renderColumnChart;
 
   if ("Highcharts" in window) {
 
@@ -122,9 +127,9 @@
         options.yAxis.max = opts.max;
       }
       return options;
-    }
+    };
 
-    var renderLineChart = function(element, series, opts) {
+    renderLineChart = function(element, series, opts) {
       var options = jsOptions(opts), data, i, j;
       options.xAxis.type = "datetime";
       options.chart = {type: "spline"};
@@ -138,13 +143,13 @@
       }
       options.series = series;
 
-      if (series.length == 1) {
+      if (series.length === 1) {
         options.legend = {enabled: false};
       }
       $(element).highcharts(options);
     };
 
-    var renderPieChart = function(element, series, opts) {
+    renderPieChart = function(element, series, opts) {
       var options = jsOptions(opts);
       options.series = [{
         type: "pie",
@@ -154,11 +159,10 @@
       $(element).highcharts(options);
     };
 
-    var renderColumnChart = function(element, series, opts) {
-      var options = jsOptions(opts), data, i, j;
+    renderColumnChart = function(element, series, opts) {
+      var options = jsOptions(opts), i, j, s, d, rows = [];
       options.chart = {type: "column"};
 
-      var i, j, s, d, rows = [];
       for (i = 0; i < series.length; i++) {
         s = series[i];
 
@@ -173,7 +177,9 @@
 
       var categories = [];
       for (i in rows) {
-        categories.push(i);
+        if (rows.hasOwnProperty(i)) {
+          categories.push(i);
+        }
       }
       options.xAxis.categories = categories;
 
@@ -191,16 +197,15 @@
       }
       options.series = newSeries;
 
-      if (series.length == 1) {
+      if (series.length === 1) {
         options.legend.enabled = false;
       }
       $(element).highcharts(options);
     };
-  }
-  else { // Google charts
-
+  } else if ("google" in window) { // Google charts
+    // load from google
     var loaded = false;
-    google.setOnLoadCallback( function() {
+    google.setOnLoadCallback(function() {
       loaded = true;
     });
     google.load("visualization", "1.0", {"packages": ["corechart"]});
@@ -210,7 +215,7 @@
       if (loaded) {
         callback();
       }
-    }
+    };
 
     // Set chart options
     var defaultOptions = {
@@ -251,7 +256,7 @@
           fontSize: 12
         }
       }
-    }
+    };
 
     // cant use object as key
     var createDataTable = function(series, columnType) {
@@ -275,7 +280,9 @@
 
       var rows2 = [];
       for (i in rows) {
-        rows2.push([(columnType === "datetime") ? new Date(toFloat(i)) : i].concat(rows[i]));
+        if (rows.hasOwnProperty(i)) {
+          rows2.push([(columnType === "datetime") ? new Date(toFloat(i)) : i].concat(rows[i]));
+        }
       }
       data.addRows(rows2);
 
@@ -291,23 +298,23 @@
         options.vAxis.viewWindow.max = opts.max;
       }
       return options;
-    }
+    };
 
-    var renderLineChart = function(element, series, opts) {
+    renderLineChart = function(element, series, opts) {
       waitForLoaded(function() {
         var data = createDataTable(series, "datetime");
 
         var options = jsOptions(opts);
-        if (series.length == 1) {
+        if (series.length === 1) {
           options.legend.position = "none";
         }
 
         var chart = new google.visualization.LineChart(element);
         chart.draw(data, options);
-      })
+      });
     };
 
-    var renderPieChart = function(element, series, opts) {
+    renderPieChart = function(element, series, opts) {
       waitForLoaded(function() {
         var data = new google.visualization.DataTable();
         data.addColumn("string", "");
@@ -325,12 +332,12 @@
       });
     };
 
-    var renderColumnChart = function(element, series, opts) {
+    renderColumnChart = function(element, series, opts) {
       waitForLoaded(function() {
         var data = createDataTable(series, "string");
 
         var options = jsOptions(opts);
-        if (series.length == 1) {
+        if (series.length === 1) {
           options.legend.position = "none";
         }
 
@@ -338,98 +345,78 @@
         chart.draw(data, options);
       });
     };
+  } else { // no chart library installed
+    renderLineChart = renderPieChart = renderColumnChart = function() {
+      throw new Error("Please install Google Charts or Highcharts");
+    };
   }
 
-  var chartError = function(element) {
-    element.innerHTML = "Error Loading Chart";
-    element.style.color = "red";
-  };
+  var hasInnerText = (document.getElementsByTagName("body")[0].innerText !== undefined) ? true : false;
+  function setText(element, text) {
+    if (hasInnerText) {
+      element.innerText = text;
+    } else {
+      element.textContent = text;
+    }
+  }
 
-  var getJSON = function(element, url, success) {
-    // TODO no jquery
-    // TODO parse JSON in older browsers
-    // https://raw.github.com/douglascrockford/JSON-js/master/json2.js
+  function chartError(element, message) {
+    setText(element, "Error Loading Chart: " + message);
+    element.style.color = "#ff0000";
+  }
+
+  function getJSON(element, url, success) {
     $.ajax({
       dataType: "json",
       url: url,
       success: success,
-      error: function() {
-        chartError(element);
+      error: function(jqXHR, textStatus, errorThrown) {
+        var message = (typeof errorThrown === "string") ? errorThrown : errorThrown.message;
+        chartError(element, message);
       }
     });
-  };
+  }
 
-  // not working all the time
-  var errorCatcher = function(element, data, opts, callback) {
+  function errorCatcher(element, data, opts, callback) {
     try {
       callback(element, data, opts);
     } catch (err) {
-      chartError(element);
+      chartError(element, err.message);
       throw err;
     }
-  };
+  }
 
-  // TODO catch errors for callback
-  var fetchDataSource = function(element, dataSource, opts, callback) {
+  function fetchDataSource(element, dataSource, opts, callback) {
     if (typeof dataSource === "string") {
       getJSON(element, dataSource, function(data, textStatus, jqXHR) {
         errorCatcher(element, data, opts, callback);
       });
-    }
-    else {
+    } else {
       errorCatcher(element, dataSource, opts, callback);
     }
-  };
-
-  var isArray = function(variable) {
-    return Object.prototype.toString.call(variable) === "[object Array]"
-  };
-
-  var standardSeries = function(series, time) {
-    var i, j, data, r, key;
-
-    // clean data
-    if (!isArray(series) || typeof series[0] !== "object" || isArray(series[0])) {
-      series = [{name: "Value", data: series}];
-    }
+  }
 
-    // right format
-    for (i = 0; i < series.length; i++) {
-      data = toArr(series[i].data);
-      r = [];
-      for (j = 0; j < data.length; j++) {
-        key = data[j][0];
-        if (time) {
-          key = toDate(key);
-        }
-        else {
-          key = toStr(key);
-        }
-        r.push([key, toFloat(data[j][1])]);
-      }
-      if (time) {
-        r.sort(function(a,b){ return a[0].getTime() - b[0].getTime() });
-      }
-      series[i].data = r;
-    }
+  // helpers
 
-    return series;
+  function isArray(variable) {
+    return Object.prototype.toString.call(variable) === "[object Array]";
   }
 
-  var toStr = function(n) {
+  // type conversions
+
+  function toStr(n) {
     return "" + n;
   }
 
-  var toFloat = function(n) {
+  function toFloat(n) {
     return parseFloat(n);
-  };
+  }
 
-  var toDate = function(n) {
+  function toDate(n) {
     if (typeof n !== "object") {
       if (typeof n === "number") {
         n = new Date(n * 1000); // ms
-      }
-      else { // str
+      } else { // str
         // try our best to get the str into iso8601
         // TODO be smarter about this
         var str = n.replace(/ /, "T").replace(" ", "").replace("UTC", "Z");
@@ -437,9 +424,9 @@
       }
     }
     return n;
-  };
+  }
 
-  var toArr = function(n) {
+  function toArr(n) {
     if (!isArray(n)) {
       var arr = [], i;
       for (i in n) {
@@ -452,15 +439,47 @@
     return n;
   }
 
-  var processLineData = function(element, data, opts) {
-    renderLineChart(element, standardSeries(data, true), opts);
+  // process data
+
+  function sortByTime(a, b) {
+    return a[0].getTime() - b[0].getTime();
   }
 
-  var processColumnData = function(element, data, opts) {
-    renderColumnChart(element, standardSeries(data, false), opts);
+  function processSeries(series, time) {
+    var i, j, data, r, key;
+
+    // see if one series or multiple
+    if (!isArray(series) || typeof series[0] !== "object" || isArray(series[0])) {
+      series = [{name: "Value", data: series}];
+    }
+
+    // right format
+    for (i = 0; i < series.length; i++) {
+      data = toArr(series[i].data);
+      r = [];
+      for (j = 0; j < data.length; j++) {
+        key = data[j][0];
+        key = time ? toDate(key) : toStr(key);
+        r.push([key, toFloat(data[j][1])]);
+      }
+      if (time) {
+        r.sort(sortByTime);
+      }
+      series[i].data = r;
+    }
+
+    return series;
   }
 
-  var processPieData = function(element, data, opts) {
+  function processLineData(element, data, opts) {
+    renderLineChart(element, processSeries(data, true), opts);
+  }
+
+  function processColumnData(element, data, opts) {
+    renderColumnChart(element, processSeries(data, false), opts);
+  }
+
+  function processPieData(element, data, opts) {
     var perfectData = toArr(data), i;
     for (i = 0; i < perfectData.length; i++) {
       perfectData[i] = [toStr(perfectData[i][0]), toFloat(perfectData[i][1])];
@@ -468,6 +487,8 @@
     renderPieChart(element, perfectData, opts);
   }
 
+  // define classes
+
   var Chartkick = {
     LineChart: function(element, dataSource, opts) {
       fetchDataSource(element, dataSource, opts || {}, processLineData);

data/lib/chartkick/version.rb

@@ -1,3 +1,3 @@
 module Chartkick
-  VERSION = "0.0.2"
+  VERSION = "0.0.3"
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: chartkick
 version: !ruby/object:Gem::Version
-  version: 0.0.2
+  version: 0.0.3
 platform: ruby
 authors:
 - Andrew Kane
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-05-10 00:00:00.000000000 Z
+date: 2013-05-12 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties