highcharts-ng-rails 0.0.3 → 0.0.7

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 2d44849fc5f006276f6f570d58cc84cd977e0dfd
-  data.tar.gz: 47a5f57fc5653de34d947dff8d2dc78ebfff2c5b
+  metadata.gz: 5efcce932c820f3505f256d788b361a40c3bd804
+  data.tar.gz: c8c84695a4acd68e52c3c751844343cadc892666
 SHA512:
-  metadata.gz: c99170b2331eaba3c511d6c7fa98b5c79ce878e3f1f42bb6292d4ca070828f2fcd24b80564f4e501eed8ea159262be7ffa6b303afaeff4fcd7cd62d7e717b370
-  data.tar.gz: 5e6507837b3b63f84fe381e1c16e7ead84dbb690d4f56208857257708a1eb227d715393404db3442898f3bcf4bba2164f6e32fa470c67464151d4229bd558edf
+  metadata.gz: 44f698b6e1775a9ff8226b9f069215a3e784300bc45e5d5e7f8466d0d28c9cc390b88226027a8054c850f10bb29d6bee7b56276383a30f723460e14941046e52
+  data.tar.gz: 9daae96317a7a6de351d74b1541df97c36ed83ce977dfed2f40d49e5d1bc673179e2138a995c316345a07a8da0e69d6b40d3f73c15969c8c14d9e47faf170d0b

data/README.markdown

@@ -7,7 +7,7 @@ This gem just includes [highcharts-ng](https://github.com/pablojim/highcharts-ng
 Add the gem to the Gemfile
 
     gem "highcharts-rails"
-    gem "highcharts-ng-rails", "~> 0.0.3"
+    gem "highcharts-ng-rails", "~> 0.0.7"
     # The gem version mirrors the included version of highcharts-ng
 
 ## Usage

data/app/assets/javascripts/highcharts-ng.js

@@ -1,199 +1,352 @@
-'use strict';
-
-angular.module('highcharts-ng', [])
-  .directive('highchart', function () {
-
-    function prependMethod(obj, method, func) {
-      var original = obj[method];
-      obj[method] = function () {
-        var args = Array.prototype.slice.call(arguments);
-        func.apply(this, args);
-        if(original) {
-          return original.apply(this, args);
-        }  else {
-          return;
-        }
+(function () {
+  'use strict';
+  /*global angular: false, Highcharts: false */
 
-      };
-    }
-
-    function deepExtend(destination, source) {
-      for (var property in source) {
-        if (source[property] && source[property].constructor &&
-            source[property].constructor === Object) {
-          destination[property] = destination[property] || {};
-          deepExtend(destination[property], source[property]);
+  angular.module('highcharts-ng', [])
+    .factory('highchartsNGUtils', highchartsNGUtils)
+    .directive('highchart', ['highchartsNGUtils', highchart]);
+
+  function highchartsNGUtils() {
+
+    return {
+
+      //IE8 support
+      indexOf: function (arr, find, i /*opt*/) {
+        if (i === undefined) i = 0;
+        if (i < 0) i += arr.length;
+        if (i < 0) i = 0;
+        for (var n = arr.length; i < n; i++)
+          if (i in arr && arr[i] === find)
+            return i;
+        return -1;
+      },
+
+      prependMethod: function (obj, method, func) {
+        var original = obj[method];
+        obj[method] = function () {
+          var args = Array.prototype.slice.call(arguments);
+          func.apply(this, args);
+          if (original) {
+            return original.apply(this, args);
+          } else {
+            return;
+          }
+
+        };
+      },
+
+      deepExtend: function deepExtend(destination, source) {
+        //Slightly strange behaviour in edge cases (e.g. passing in non objects)
+        //But does the job for current use cases.
+        if (angular.isArray(source)) {
+          destination = angular.isArray(destination) ? destination : [];
+          for (var i = 0; i < source.length; i++) {
+            destination[i] = deepExtend(destination[i] || {}, source[i]);
+          }
+        } else if (angular.isObject(source)) {
+          for (var property in source) {
+            destination[property] = deepExtend(destination[property] || {}, source[property]);
+          }
         } else {
-          destination[property] = source[property];
+          destination = source;
         }
+        return destination;
       }
-      return destination;
-    }
+    };
+  }
+
+  function highchart(highchartsNGUtils) {
 
+    // acceptable shared state
     var seriesId = 0;
     var ensureIds = function (series) {
-      series.forEach(function (s) {
+      var changed = false;
+      angular.forEach(series, function(s) {
         if (!angular.isDefined(s.id)) {
-          s.id = "series-" + seriesId++;
+          s.id = 'series-' + seriesId++;
+          changed = true;
         }
       });
-    }
+      return changed;
+    };
 
-    var defaultOptions = {
-      chart: {
-        events: {}
-      },
-      title: {},
-      series: [],
-      navigator: {enabled: false}
-    }
+    // immutable
+    var axisNames = [ 'xAxis', 'yAxis' ];
 
     var getMergedOptions = function (scope, element, config) {
-      var mergedOptions = {}
+      var mergedOptions = {};
+
+      var defaultOptions = {
+        chart: {
+          events: {}
+        },
+        title: {},
+        subtitle: {},
+        series: [],
+        credits: {},
+        plotOptions: {},
+        navigator: {enabled: false}
+      };
+
       if (config.options) {
-        mergedOptions = deepExtend(defaultOptions, config.options);
+        mergedOptions = highchartsNGUtils.deepExtend(defaultOptions, config.options);
       } else {
         mergedOptions = defaultOptions;
       }
       mergedOptions.chart.renderTo = element[0];
-      if(config.xAxis) {
-        prependMethod(mergedOptions.chart.events, 'selection', function(e){
-          var thisChart = this;
-          if(e.xAxis) {
-            scope.$apply(function () {
-              scope.config.xAxis.currentMin = e.xAxis[0].min;
-              scope.config.xAxis.currentMax = e.xAxis[0].max;
+
+      angular.forEach(axisNames, function(axisName) {
+        if(angular.isDefined(config[axisName])) {
+          mergedOptions[axisName] = angular.copy(config[axisName]);
+
+          if(angular.isDefined(config[axisName].currentMin) ||
+              angular.isDefined(config[axisName].currentMax)) {
+
+            highchartsNGUtils.prependMethod(mergedOptions.chart.events, 'selection', function(e){
+              var thisChart = this;
+              if (e[axisName]) {
+                scope.$apply(function () {
+                  scope.config[axisName].currentMin = e[axisName][0].min;
+                  scope.config[axisName].currentMax = e[axisName][0].max;
+                });
+              } else {
+                //handle reset button - zoom out to all
+                scope.$apply(function () {
+                  scope.config[axisName].currentMin = thisChart[axisName][0].dataMin;
+                  scope.config[axisName].currentMax = thisChart[axisName][0].dataMax;
+                });
+              }
             });
-          } else {
-            //handle reset button - zoom out to all
-            scope.$apply(function () {
-              scope.config.xAxis.currentMin = thisChart.xAxis[0].dataMin;
-              scope.config.xAxis.currentMax = thisChart.xAxis[0].dataMax;
+
+            highchartsNGUtils.prependMethod(mergedOptions.chart.events, 'addSeries', function(e){
+              scope.config[axisName].currentMin = this[axisName][0].min || scope.config[axisName].currentMin;
+              scope.config[axisName].currentMax = this[axisName][0].max || scope.config[axisName].currentMax;
             });
           }
-        });
+        }
+      });
 
-        prependMethod(mergedOptions.chart.events, 'addSeries', function(e){
-            scope.config.xAxis.currentMin = this.xAxis[0].min || scope.config.xAxis.currentMin;
-            scope.config.xAxis.currentMax = this.xAxis[0].max || scope.config.xAxis.currentMax;
-        });
+      if(config.title) {
+        mergedOptions.title = config.title;
       }
-
-      if(config.xAxis) {
-        mergedOptions.xAxis = angular.copy(config.xAxis)
+      if (config.subtitle) {
+        mergedOptions.subtitle = config.subtitle;
       }
-      if(config.title) {
-        mergedOptions.title = config.title
+      if (config.credits) {
+        mergedOptions.credits = config.credits;
+      }
+      if(config.size) {
+        if (config.size.width) {
+          mergedOptions.chart.width = config.size.width;
+        }
+        if (config.size.height) {
+          mergedOptions.chart.height = config.size.height;
+        }
       }
-      return mergedOptions
-    }
+      return mergedOptions;
+    };
 
     var updateZoom = function (axis, modelAxis) {
       var extremes = axis.getExtremes();
       if(modelAxis.currentMin !== extremes.dataMin || modelAxis.currentMax !== extremes.dataMax) {
         axis.setExtremes(modelAxis.currentMin, modelAxis.currentMax, false);
       }
-    }
+    };
 
-    var processExtremes = function(chart, axis) {
+    var processExtremes = function(chart, axis, axisName) {
       if(axis.currentMin || axis.currentMax) {
-        chart.xAxis[0].setExtremes(axis.currentMin, axis.currentMax, true);
-      }
-    }
-
-    var processSeries = function(chart, series) {
-      var ids = []
-      if(series) {
-        ensureIds(series);
-
-        //Find series to add or update
-        series.forEach(function (s) {
-          ids.push(s.id)
-          var chartSeries = chart.get(s.id);
-          if (chartSeries) {
-            chartSeries.update(angular.copy(s), false);
-          } else {
-            chart.addSeries(angular.copy(s), false)
-          }
-        });
-      }
-
-      //Now remove any missing series
-      for(var i = chart.series.length - 1; i >= 0; i--) {
-        var s = chart.series[i];
-        if (ids.indexOf(s.options.id) < 0) {
-          s.remove(false);
-        }
-      };
-
-    }
-
-    var initialiseChart = function(scope, element, config) {
-      config || (config = {});
-      var mergedOptions = getMergedOptions(scope, element, config);
-      var chart = config.useHighStocks ? new Highcharts.StockChart(mergedOptions) : new Highcharts.Chart(mergedOptions);
-      if(config.xAxis) {
-        processExtremes(chart, config.xAxis);
-      }
-      processSeries(chart, config.series);
-      if(config.loading) {
-        chart.showLoading()
+        chart[axisName][0].setExtremes(axis.currentMin, axis.currentMax, true);
       }
-      chart.redraw();
-      return chart;
-    }
+    };
 
+    var chartOptionsWithoutEasyOptions = function (options) {
+      return angular.extend({}, options, {data: null, visible: null});
+    };
 
     return {
       restrict: 'EAC',
       replace: true,
       template: '<div></div>',
       scope: {
-        config: '='
+        config: '=',
+        disableDataWatch: '='
       },
       link: function (scope, element, attrs) {
+        // We keep some chart-specific variables here as a closure
+        // instead of storing them on 'scope'.
 
-        var chart = initialiseChart(scope, element, scope.config);
+        // prevSeriesOptions is maintained by processSeries
+        var prevSeriesOptions = {};
 
-        scope.$watch("config.series", function (newSeries, oldSeries) {
-          //do nothing when called on registration
-          if (newSeries === oldSeries) return;
-          processSeries(chart, newSeries);
-          chart.redraw();
-        }, true);
+        var processSeries = function(series) {
+          var i;
+          var ids = [];
+
+          if(series) {
+            var setIds = ensureIds(series);
+            if(setIds) {
+              //If we have set some ids this will trigger another digest cycle.
+              //In this scenario just return early and let the next cycle take care of changes
+              return false;
+            }
+
+            //Find series to add or update
+            angular.forEach(series, function(s) {
+              ids.push(s.id);
+              var chartSeries = chart.get(s.id);
+              if (chartSeries) {
+                if (!angular.equals(prevSeriesOptions[s.id], chartOptionsWithoutEasyOptions(s))) {
+                  chartSeries.update(angular.copy(s), false);
+                } else {
+                  if (s.visible !== undefined && chartSeries.visible !== s.visible) {
+                    chartSeries.setVisible(s.visible, false);
+                  }
+                  chartSeries.setData(angular.copy(s.data), false);
+                }
+              } else {
+                chart.addSeries(angular.copy(s), false);
+              }
+              prevSeriesOptions[s.id] = chartOptionsWithoutEasyOptions(s);
+            });
+
+            //  Shows no data text if all series are empty
+            if(scope.config.noData) {
+              var chartContainsData = false;
+
+              for(i = 0; i < series.length; i++) {
+                if (series[i].data && series[i].data.length > 0) {
+                  chartContainsData = true;
+
+                  break;
+                }
+              }
+
+              if (!chartContainsData) {
+                chart.showLoading(scope.config.noData);
+              } else {
+                chart.hideLoading();
+              }
+            }
+          }
+
+          //Now remove any missing series
+          for(i = chart.series.length - 1; i >= 0; i--) {
+            var s = chart.series[i];
+            if (s.options.id !== 'highcharts-navigator-series' && highchartsNGUtils.indexOf(ids, s.options.id) < 0) {
+              s.remove(false);
+            }
+          }
+
+          return true;
+        };
+
+        // chart is maintained by initChart
+        var chart = false;
+        var initChart = function() {
+          if (chart) chart.destroy();
+          prevSeriesOptions = {};
+          var config = scope.config || {};
+          var mergedOptions = getMergedOptions(scope, element, config);
+          var func = config.func || undefined;
+          chart = config.useHighStocks ?
+            new Highcharts.StockChart(mergedOptions, func) :
+            new Highcharts.Chart(mergedOptions, func);
+          for (var i = 0; i < axisNames.length; i++) {
+            if (config[axisNames[i]]) {
+              processExtremes(chart, config[axisNames[i]], axisNames[i]);
+            }
+          }
+          if(config.loading) {
+            chart.showLoading();
+          }
+
+        };
+        initChart();
+
+
+        if(scope.disableDataWatch){
+          scope.$watchCollection('config.series', function (newSeries, oldSeries) {
+            processSeries(newSeries);
+            chart.redraw();
+          });
+        } else {
+          scope.$watch('config.series', function (newSeries, oldSeries) {
+            var needsRedraw = processSeries(newSeries);
+            if(needsRedraw) {
+              chart.redraw();
+            }
+          }, true);
+        }
 
-        scope.$watch("config.title", function (newTitle) {
+        scope.$watch('config.title', function (newTitle) {
           chart.setTitle(newTitle, true);
         }, true);
 
-        scope.$watch("config.loading", function (loading) {
+        scope.$watch('config.subtitle', function (newSubtitle) {
+          chart.setTitle(true, newSubtitle);
+        }, true);
+
+        scope.$watch('config.loading', function (loading) {
           if(loading) {
-            chart.showLoading()
+            chart.showLoading();
           } else {
-            chart.hideLoading()
+            chart.hideLoading();
           }
         });
 
-        scope.$watch("config.useHighStocks", function (useHighStocks) {
-          chart.destroy();
-          chart = initialiseChart(scope, element, scope.config);
+        scope.$watch('config.credits.enabled', function (enabled) {
+          if (enabled) {
+            chart.credits.show();
+          } else if (chart.credits) {
+            chart.credits.hide();
+          }
         });
 
-        scope.$watch("config.xAxis", function (newAxes, oldAxes) {
-          if (newAxes === oldAxes) return;
-          if(newAxes) {
-            chart.xAxis[0].update(newAxes);
-            updateZoom(chart.xAxis[0], angular.copy(newAxes));
-            chart.redraw();
-          }
-        }, true);
-        scope.$watch("config.options", function (newOptions, oldOptions, scope) {
+        scope.$watch('config.useHighStocks', function (useHighStocks, oldUseHighStocks) {
+          if(useHighStocks === oldUseHighStocks) return;
+          initChart();
+        });
+
+        angular.forEach(axisNames, function(axisName) {
+          scope.$watch('config.' + axisName, function (newAxes, oldAxes) {
+            if (newAxes === oldAxes) return;
+            if(newAxes) {
+              chart[axisName][0].update(newAxes, false);
+              updateZoom(chart[axisName][0], angular.copy(newAxes));
+              chart.redraw();
+            }
+          }, true);
+        });
+        scope.$watch('config.options', function (newOptions, oldOptions, scope) {
           //do nothing when called on registration
           if (newOptions === oldOptions) return;
-          chart.destroy();
-          chart = initialiseChart(scope, element, scope.config);
+          initChart();
+          processSeries(scope.config.series);
+          chart.redraw();
+        }, true);
 
+        scope.$watch('config.size', function (newSize, oldSize) {
+          if(newSize === oldSize) return;
+          if(newSize) {
+            chart.setSize(newSize.width || undefined, newSize.height || undefined);
+          }
         }, true);
+
+        scope.$on('highchartsng.reflow', function () {
+          chart.reflow();
+        });
+
+        scope.$on('$destroy', function() {
+          if (chart) {
+            chart.destroy();
+            setTimeout(function(){
+              element.remove();
+            }, 0);
+          }
+        });
+
       }
-    }
-  });
+    };
+  }
+
+}());

data/lib/highcharts-ng/version.rb

@@ -1,3 +1,3 @@
 module HighchartsNG
-  VERSION = "0.0.3"
+  VERSION = "0.0.7"
 end

metadata

@@ -1,55 +1,55 @@
 --- !ruby/object:Gem::Specification
 name: highcharts-ng-rails
 version: !ruby/object:Gem::Version
-  version: 0.0.3
+  version: 0.0.7
 platform: ruby
 authors:
 - Iven Hsu
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-11-01 00:00:00.000000000 Z
+date: 2014-10-31 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: railties
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - '>='
+    - - ">="
       - !ruby/object:Gem::Version
         version: '3.1'
   type: :runtime
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - '>='
+    - - ">="
       - !ruby/object:Gem::Version
         version: '3.1'
 - !ruby/object:Gem::Dependency
   name: bundler
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - ~>
+    - - "~>"
       - !ruby/object:Gem::Version
         version: '1.0'
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - ~>
+    - - "~>"
       - !ruby/object:Gem::Version
         version: '1.0'
 - !ruby/object:Gem::Dependency
   name: rails
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - '>='
+    - - ">="
       - !ruby/object:Gem::Version
         version: '3.1'
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - '>='
+    - - ">="
       - !ruby/object:Gem::Version
         version: '3.1'
 description: Gem that includes AngularJS directive for Highcharts (Interactive JavaScript
@@ -60,7 +60,7 @@ executables: []
 extensions: []
 extra_rdoc_files: []
 files:
-- .gitignore
+- ".gitignore"
 - Gemfile
 - LICENSE
 - README.markdown
@@ -80,17 +80,17 @@ require_paths:
 - lib
 required_ruby_version: !ruby/object:Gem::Requirement
   requirements:
-  - - '>='
+  - - ">="
     - !ruby/object:Gem::Version
       version: '0'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
-  - - '>='
+  - - ">="
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.0.3
+rubygems_version: 2.2.2
 signing_key: 
 specification_version: 4
 summary: AngularJS directive for Highcharts