ember-highcharts - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

addon/components/high-charts.js

@@ -5,59 +5,59 @@ import Ember from 'ember';
 export default Ember.Component.extend(HighchartsThemeMixin, {
-    classNames: ['highcharts-wrapper'],
-    content: undefined,
-    chartOptions: undefined,
-    chart: null,
+  classNames: ['highcharts-wrapper'],
+  content: undefined,
+  chartOptions: undefined,
+  chart: null,
 
-    buildOptions: Em.computed('chartOptions', '[e-mail]', function() {
-        var chartContent, chartOptions, defaults;
-        chartOptions = this.getWithDefault('chartOptions', {});
-        chartContent = this.get('content.length') ? this.get('content') : [{
-            id: 'noData',
-            data: 0,
-            color: '#aaaaaa'
-        }];
-        defaults = {
-            series: chartContent
-        };
-        return Em.merge(defaults, chartOptions);
-    }),
+  buildOptions: Ember.computed('chartOptions', '[e-mail]', function() {
+    var chartContent, chartOptions, defaults;
+    chartOptions = this.getWithDefault('chartOptions', {});
+    chartContent = this.get('content.length') ? this.get('content') : [{
+      id: 'noData',
+      data: 0,
+      color: '#aaaaaa'
+    }];
+    defaults = {
+      series: chartContent
+    };
+    return Ember.merge(defaults, chartOptions);
+  }),
 
-    _renderChart: (function() {
-        this.drawLater();
-        this.buildTheme();
-    }).on('didInsertElement'),
+  _renderChart: (function() {
+    this.drawLater();
+    this.buildTheme();
+  }).on('didInsertElement'),
 
-    contentDidChange: Em.observer('[e-mail]', function() {
-        var chart;
-        if (!(this.get('content') && this.get('chart'))) {
-            return;
-        }
-        chart = this.get('chart');
-        return this.get('content').forEach(function(series, idx) {
-            var _ref;
-            if ((_ref = chart.get('noData')) != null) {
-                _ref.remove();
-            }
-            if (chart.series[idx]) {
-                return chart.series[idx].setData(series.data);
-            } else {
-                return chart.addSeries(series);
-            }
-        });
-    }),
+  contentDidChange: Ember.observer('[e-mail]', function() {
+    var chart;
+    if (!(this.get('content') && this.get('chart'))) {
+      return;
+    }
+    chart = this.get('chart');
+    return this.get('content').forEach(function(series, idx) {
+      var _ref;
+      if ((_ref = chart.get('noData')) != null) {
+        _ref.remove();
+      }
+      if (chart.series[idx]) {
+        return chart.series[idx].setData(series.data);
+      } else {
+        return chart.addSeries(series);
+      }
+    });
+  }),
 
-    drawLater: function() {
-        Ember.run.scheduleOnce('afterRender', this, 'draw');
-    },
+  drawLater: function() {
+    Ember.run.scheduleOnce('afterRender', this, 'draw');
+  },
 
-    draw: function() {
-        var options;
-        options = this.get('buildOptions');
-        this.set('chart', this.$().highcharts(options).highcharts());
-    },
+  draw: function() {
+    var options;
+    options = this.get('buildOptions');
+    this.set('chart', this.$().highcharts(options).highcharts());
+  },
 
-    _destroyChart: (function() {
-        this._super();
-        this.get('chart').destroy();
-    }).on('willDestroyElement')
+  _destroyChart: (function() {
+    this._super();
+    this.get('chart').destroy();
+  }).on('willDestroyElement')
 });

addon/mixins/highcharts-theme.js

 import Ember from 'ember';
 
 export default Ember.Mixin.create({
-    buildTheme: function() {
-        Highcharts.theme = {
-            colors: [
-                '#258be2',
-                '#666666',
-                '#f45b5b',
-                '#8085e9',
-                '#8d4654',
-                '#7798bf',
-                '#aaeeee',
-                '#ff0066',
-                '#eeaaee',
-                '#55bf3b',
-                '#df5353',
-                '#7798bf',
-                '#aaeeee'
-            ],
-            chart: {
-                backgroundColor: null,
-                style: {
-                    fontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"
-                }
-            },
-            title: {
-                style: {
-                    color: 'black',
-                    fontSize: '18px',
-                    fontWeight: 'bold'
-                }
-            },
-            subtitle: {
-                style: {
-                    color: 'black'
-                }
-            },
-            tooltip: {
-                borderWidth: 0,
-                style: {
-                    fontSize: '16px'
-                }
-            },
-            legend: {
-                itemStyle: {
-                    fontWeight: 'bold',
-                    fontSize: '14px'
-                }
-            },
-            xAxis: {
-                labels: {
-                    style: {
-                        color: '#6e6e70',
-                        fontSize: '16px'
-                    }
-                },
-                title: {
-                    style: {
-                        fontSize: '14px'
-                    }
-                }
-            },
-            yAxis: {
-                labels: {
-                    style: {
-                        color: '#6e6e70',
-                        fontSize: '16px'
-                    }
-                },
-                title: {
-                    style: {
-                        fontSize: '14px'
-                    }
-                }
-            },
-            plotOptions: {
-                series: {
-                    shadow: true
-                },
-                candlestick: {
-                    lineColor: '#404048'
-                }
-            },
-            navigator: {
-                xAxis: {
-                    gridLineColor: '#D0D0D8'
-                }
-            },
-            rangeSelector: {
-                buttonTheme: {
-                    fill: 'white',
-                    stroke: '#C0C0C8',
-                    'stroke-width': 1,
-                    states: {
-                        select: {
-                            fill: '#D0D0D8'
-                        }
-                    }
-                }
-            },
-            scrollbar: {
-                trackBorderColor: '#C0C0C8'
-            },
-            background2: '#E0E0E8',
-            global: {
-                timezoneOffset: new Date().getTimezoneOffset()
-            },
-            credits: {
-                enabled: false
+  buildTheme: function() {
+    Highcharts.theme = {
+      colors: [
+        '#258be2',
+        '#666666',
+        '#f45b5b',
+        '#8085e9',
+        '#8d4654',
+        '#7798bf',
+        '#aaeeee',
+        '#ff0066',
+        '#eeaaee',
+        '#55bf3b',
+        '#df5353',
+        '#7798bf',
+        '#aaeeee'
+      ],
+      chart: {
+        backgroundColor: null,
+        style: {
+          fontFamily: "'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"
+        }
+      },
+      title: {
+        style: {
+          color: 'black',
+          fontSize: '18px',
+          fontWeight: 'bold'
+        }
+      },
+      subtitle: {
+        style: {
+          color: 'black'
+        }
+      },
+      tooltip: {
+        borderWidth: 0,
+        style: {
+          fontSize: '16px'
+        }
+      },
+      legend: {
+        itemStyle: {
+          fontWeight: 'bold',
+          fontSize: '14px'
+        }
+      },
+      xAxis: {
+        labels: {
+          style: {
+            color: '#6e6e70',
+            fontSize: '16px'
+          }
+        },
+        title: {
+          style: {
+            fontSize: '14px'
+          }
+        }
+      },
+      yAxis: {
+        labels: {
+          style: {
+            color: '#6e6e70',
+            fontSize: '16px'
+          }
+        },
+        title: {
+          style: {
+            fontSize: '14px'
+          }
+        }
+      },
+      plotOptions: {
+        series: {
+          shadow: true
+        },
+        candlestick: {
+          lineColor: '#404048'
+        }
+      },
+      navigator: {
+        xAxis: {
+          gridLineColor: '#D0D0D8'
+        }
+      },
+      rangeSelector: {
+        buttonTheme: {
+          fill: 'white',
+          stroke: '#C0C0C8',
+          'stroke-width': 1,
+          states: {
+            select: {
+              fill: '#D0D0D8'
             }
-        };
-        return Highcharts.setOptions(Highcharts.theme);
-    }
-});
+          }
+        }
+      },
+      scrollbar: {
+        trackBorderColor: '#C0C0C8'
+      },
+      background2: '#E0E0E8',
+      global: {
+        timezoneOffset: new Date().getTimezoneOffset()
+      },
+      credits: {
+        enabled: false
+      }
+    };
+    return Highcharts.setOptions(Highcharts.theme);
+  }
+});

blueprints/ember-highcharts/index.js

 module.exports = {
   normalizeEntityName: function() {},
 
-   afterInstall: function() {
+  afterInstall: function() {
     return this.addBowerPackageToProject('highcharts-release#~4.0.4');
   }
-};
+};

index.js

@@ -0,1 +1,2 @@
+/* jshint node: true */
 'use strict';
@@ -7,6 +8,6 @@
   included: function(app) {
-      this._super.included(app);
+    this._super.included(app);
 
-      app.import(app.bowerDirectory + '/highcharts-release/highcharts.js');
-    }
-};
+    app.import(app.bowerDirectory + '/highcharts-release/highcharts.js');
+  }
+};

package.json

 {
   "name": "ember-highcharts",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "A Highcharts component for ember cli",
@@ -21,12 +21,15 @@ "directories": {
   "devDependencies": {
-    "body-parser": "^1.2.0",
-    "broccoli-asset-rev": "0.3.1",
+    "broccoli-asset-rev": "^2.0.0",
     "broccoli-ember-hbs-template-compiler": "^1.6.1",
-    "ember-cli": "0.1.2",
+    "ember-cli": "0.1.12",
+    "ember-cli-6to5": "^3.0.0",
     "ember-cli-content-security-policy": "0.3.0",
-    "ember-export-application-global": "^1.0.0",
+    "ember-cli-dependency-checker": "0.0.7",
     "ember-cli-ic-ajax": "0.1.1",
     "ember-cli-inject-live-reload": "^1.3.0",
-    "ember-cli-qunit": "0.1.0",
-    "ember-data": "1.0.0-beta.10",
+    "ember-cli-qunit": "0.3.1",
+    "ember-cli-app-version": "0.3.1",
+    "ember-cli-uglify": "1.0.1",
+    "ember-data": "1.0.0-beta.12",
+    "ember-export-application-global": "^1.0.0",
     "express": "^4.8.5",
@@ -33,0 +36,0 @@ "glob": "^4.0.5"

README.md

@@ -7,13 +7,45 @@ # Ember-highcharts
 
-* `npm install --save-dev ember-highcharts`
-* `ember g ember-highcharts`
+* `ember install:addon ember-highcharts`
 
 ## Usage
 
+In your template:
 ```handlebars
 {{high-charts content=chartData chartOptions=chartOptions}}
 ```
+Then in a controller you can set the `chartData` and `chartOptions` values:
+```
+import Ember from 'ember';
 
+export default Ember.Controller.extend({
+  chartOptions: {
+    chart: {
+        type: 'bar'
+    },
+    title: {
+      text: 'Fruit Consumption'
+    },
+    xAxis: {
+      categories: ['Apples', 'Bananas', 'Oranges']
+    },
+    yAxis: {
+      title: {
+          text: 'Fruit eaten'
+      }
+    }
+  },
+  chartData: [
+    {
+      name: 'Jane',
+      data: [1, 0, 4]
+    }, {
+      name: 'John',
+      data: [5, 7, 3]
+    }
+  ]
+});
+```
+
 ## Credit
 
-This add-on is built based on the [gist](https://gist.github.com/poteto/cd2bb47e77bf87c94d33) and [medium](https://medium.com/delightful-ui-for-ember-apps/using-highcharts-js-in-an-ember-app-18a65d611644) by [@poteto](https://github.com/poteto)
+This add-on is built based on the [gist](https://gist.github.com/poteto/cd2bb47e77bf87c94d33) and [medium](https://medium.com/delightful-ui-for-ember-apps/using-highcharts-js-in-an-ember-app-18a65d611644) by [@poteto](https://github.com/poteto)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

51

increased by183.33%

Worsened metrics

Total package byte prevSize

8375

decreased by-52.94%

Dev dependency count

15

increased by25%

Number of package files

12

decreased by-74.47%

Lines of code

190

decreased by-45.24%

No dependency changes