diff --git a/bower.json b/bower.json index ca3b755..7eedbf9 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "tc-angular-chartjs", - "version": "1.0.15", + "version": "1.0.16", "description": "Add Chart.js charts to your angular application", "homepage": "http://carlcraig.github.io/tc-angular-chartjs/", "author": "Carl Craig ", diff --git a/dist/tc-angular-chartjs.js b/dist/tc-angular-chartjs.js index 3ff3025..5504db9 100644 --- a/dist/tc-angular-chartjs.js +++ b/dist/tc-angular-chartjs.js @@ -1,5 +1,5 @@ /** - * tc-angular-chartjs - v1.0.15 - 2016-02-15 + * tc-angular-chartjs - v1.0.16 - 2016-06-03 * Copyright (c) 2016 Carl Craig * Dual licensed with the Apache-2.0 or MIT license. */ @@ -111,7 +111,11 @@ if (exposeChart) { $scope.chart = chartObj; } - chartObj.resize(); + if (angular.isFunction(chartObj.update)) { + chartObj.update(); + } else { + chartObj.resize(); + } } }, true); } diff --git a/dist/tc-angular-chartjs.min.js b/dist/tc-angular-chartjs.min.js index 3255d92..9f485c4 100644 --- a/dist/tc-angular-chartjs.min.js +++ b/dist/tc-angular-chartjs.min.js @@ -1,6 +1,6 @@ /** - * tc-angular-chartjs - v1.0.15 - 2016-02-15 + * tc-angular-chartjs - v1.0.16 - 2016-06-03 * Copyright (c) 2016 Carl Craig * Dual licensed with the Apache-2.0 or MIT license. */ -!function(){"use strict";function a(a){return new a}function b(a){return new a("line")}function c(a){return new a("bar")}function d(a){return new a("radar")}function e(a){return new a("polararea")}function f(a){return new a("pie")}function g(a){return new a("doughnut")}function h(){return function(a){function b(b,d,e){var f,g=d[0].getContext("2d"),h=new Chart(g),i=!1,j=!1,k=!1,l=null;for(var m in e)"chartLegend"===m?i=!0:"chart"===m?k=!0:"autoLegend"===m&&(j=!0);b.$on("$destroy",function(){f&&"function"==typeof f.destroy&&f.destroy()}),b.click&&(d[0].onclick=function(a){var c;void 0!==f.getSegmentsAtEvent?c=f.getSegmentsAtEvent(a):void 0!==f.getPointsAtEvent?c=f.getPointsAtEvent(a):void 0!==f.getBarsAtEvent&&(c=f.getBarsAtEvent(a)),b.click({data:c,event:a})}),b.$watch("data",function(e){if(e){if(f&&"function"==typeof f.destroy&&f.destroy(),a)f=h[c(a)](b.data,b.options);else{if(!b.type)throw"Error creating chart: Chart type required.";f=h[c(b.type)](b.data,b.options)}i&&(b.legend=f.generateLegend()),j&&(l&&l.remove(),angular.element(d[0]).after(f.generateLegend()),l=angular.element(d[0]).next()),k&&(b.chart=f),f.resize()}},!0)}function c(a){var b=a.toLowerCase();switch(b){case"line":return"Line";case"bar":return"Bar";case"radar":return"Radar";case"polararea":return"PolarArea";case"pie":return"Pie";case"doughnut":return"Doughnut";default:return a}}return{restrict:"A",scope:{data:"=chartData",options:"=chartOptions",type:"@chartType",legend:"=?chartLegend",chart:"=?chart",click:"&chartClick"},link:b}}}function i(){function a(a,b){a.$watch("legend",function(a){a&&b.html(a)},!0)}return{restrict:"A",scope:{legend:"=?chartLegend"},link:a}}angular.module("tc.chartjs",[]).directive("tcChartjs",a).directive("tcChartjsLine",b).directive("tcChartjsBar",c).directive("tcChartjsRadar",d).directive("tcChartjsPolararea",e).directive("tcChartjsPie",f).directive("tcChartjsDoughnut",g).directive("tcChartjsLegend",i).factory("TcChartjsFactory",h),a.$inject=["TcChartjsFactory"],b.$inject=["TcChartjsFactory"],c.$inject=["TcChartjsFactory"],d.$inject=["TcChartjsFactory"],e.$inject=["TcChartjsFactory"],f.$inject=["TcChartjsFactory"],g.$inject=["TcChartjsFactory"]}(); \ No newline at end of file +!function(){"use strict";function a(a){return new a}function b(a){return new a("line")}function c(a){return new a("bar")}function d(a){return new a("radar")}function e(a){return new a("polararea")}function f(a){return new a("pie")}function g(a){return new a("doughnut")}function h(){return function(a){function b(b,d,e){var f,g=d[0].getContext("2d"),h=new Chart(g),i=!1,j=!1,k=!1,l=null;for(var m in e)"chartLegend"===m?i=!0:"chart"===m?k=!0:"autoLegend"===m&&(j=!0);b.$on("$destroy",function(){f&&"function"==typeof f.destroy&&f.destroy()}),b.click&&(d[0].onclick=function(a){var c;void 0!==f.getSegmentsAtEvent?c=f.getSegmentsAtEvent(a):void 0!==f.getPointsAtEvent?c=f.getPointsAtEvent(a):void 0!==f.getBarsAtEvent&&(c=f.getBarsAtEvent(a)),b.click({data:c,event:a})}),b.$watch("data",function(e){if(e){if(f&&"function"==typeof f.destroy&&f.destroy(),a)f=h[c(a)](b.data,b.options);else{if(!b.type)throw"Error creating chart: Chart type required.";f=h[c(b.type)](b.data,b.options)}i&&(b.legend=f.generateLegend()),j&&(l&&l.remove(),angular.element(d[0]).after(f.generateLegend()),l=angular.element(d[0]).next()),k&&(b.chart=f),angular.isFunction(f.update)?f.update():f.resize()}},!0)}function c(a){var b=a.toLowerCase();switch(b){case"line":return"Line";case"bar":return"Bar";case"radar":return"Radar";case"polararea":return"PolarArea";case"pie":return"Pie";case"doughnut":return"Doughnut";default:return a}}return{restrict:"A",scope:{data:"=chartData",options:"=chartOptions",type:"@chartType",legend:"=?chartLegend",chart:"=?chart",click:"&chartClick"},link:b}}}function i(){function a(a,b){a.$watch("legend",function(a){a&&b.html(a)},!0)}return{restrict:"A",scope:{legend:"=?chartLegend"},link:a}}angular.module("tc.chartjs",[]).directive("tcChartjs",a).directive("tcChartjsLine",b).directive("tcChartjsBar",c).directive("tcChartjsRadar",d).directive("tcChartjsPolararea",e).directive("tcChartjsPie",f).directive("tcChartjsDoughnut",g).directive("tcChartjsLegend",i).factory("TcChartjsFactory",h),a.$inject=["TcChartjsFactory"],b.$inject=["TcChartjsFactory"],c.$inject=["TcChartjsFactory"],d.$inject=["TcChartjsFactory"],e.$inject=["TcChartjsFactory"],f.$inject=["TcChartjsFactory"],g.$inject=["TcChartjsFactory"]}(); \ No newline at end of file diff --git a/package.json b/package.json index aa81d8b..50a6783 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "tc-angular-chartjs", - "version": "1.0.15", + "version": "1.0.16", "description": "Add Chart.js charts to your angular application", "homepage": "http://carlcraig.github.io/tc-angular-chartjs/", "author": "Carl Craig ", diff --git a/src/tc-angular-chartjs.js b/src/tc-angular-chartjs.js index 0a0bf88..ad4e8a1 100644 --- a/src/tc-angular-chartjs.js +++ b/src/tc-angular-chartjs.js @@ -135,7 +135,12 @@ if ( exposeChart ) { $scope.chart = chartObj; } - chartObj.resize(); + + if (angular.isFunction(chartObj.update)) { + chartObj.update(); + } else { + chartObj.resize(); + } } }, diff --git a/test/unit/tc-angular-chartjs.spec.js b/test/unit/tc-angular-chartjs.spec.js index fcdc723..80380a8 100644 --- a/test/unit/tc-angular-chartjs.spec.js +++ b/test/unit/tc-angular-chartjs.spec.js @@ -3,22 +3,22 @@ describe('tc-chartjs directive', function () { var $compile, $scope, element, chartInstance, - ChartMock = function () { - this.Line = makeSpy('Line'); - this.Bar = makeSpy('Bar'); - this.Radar = makeSpy('Radar'); - this.PolarArea = makeSpy('PolarArea'); - this.Pie = makeSpy('Pie'); - this.Doughnut = makeSpy('Doughnut'); - this.CustomType = makeSpy('customType'); - }; + ChartMock = function () { + this.Line = makeSpy('Line'); + this.Bar = makeSpy('Bar'); + this.Radar = makeSpy('Radar'); + this.PolarArea = makeSpy('PolarArea'); + this.Pie = makeSpy('Pie'); + this.Doughnut = makeSpy('Doughnut'); + this.CustomType = makeSpy('customType'); + }; var makeSpy = function (name) { - var resize = jasmine.createSpy('resize'); + var update = jasmine.createSpy('update'); var generateLegend = jasmine.createSpy('generateLegend'); return jasmine.createSpy(name).and.callFake(function () { return { - resize: resize, + update: update, generateLegend: generateLegend }; }); @@ -85,21 +85,21 @@ describe('tc-chartjs directive', function () { element = $compile('')($scope); $scope.$digest(); expect(chartInstance.Line).toHaveBeenCalledWith($scope.data, $scope.options); - expect(chartInstance.Line().resize).toHaveBeenCalled(); + expect(chartInstance.Line().update).toHaveBeenCalled(); }); it('should normalise chart type values', function () { element = $compile('')($scope); $scope.$digest(); expect(chartInstance.PolarArea).toHaveBeenCalledWith($scope.data, $scope.options); - expect(chartInstance.PolarArea().resize).toHaveBeenCalled(); + expect(chartInstance.PolarArea().update).toHaveBeenCalled(); }); it('should pass through unknown types as-is', function () { element = $compile('')($scope); $scope.$digest(); expect(chartInstance.CustomType).toHaveBeenCalledWith($scope.data, $scope.options); - expect(chartInstance.CustomType().resize).toHaveBeenCalled(); + expect(chartInstance.CustomType().update).toHaveBeenCalled(); }); it('should throw an error if no chart type is supplied', function () { @@ -110,7 +110,27 @@ describe('tc-chartjs directive', function () { expect(testChartTypeRequiredException).toThrow('Error creating chart: Chart type required.'); }); - }); + describe('Chart.js resize() backward compatibility', function() { + beforeEach(function() { + makeSpy = function (name) { + var resize = jasmine.createSpy('resize'); + var generateLegend = jasmine.createSpy('generateLegend'); + return jasmine.createSpy(name).and.callFake(function () { + return { + resize: resize, + generateLegend: generateLegend + }; + }); + }; + }); + + it('tc-chartjs directive should call Chart.js resize() if update() is not available', function() { + element = $compile('')($scope); + $scope.$digest(); + expect(chartInstance.Line).toHaveBeenCalledWith($scope.data, $scope.options); + expect(chartInstance.Line().resize).toHaveBeenCalled(); + }); + }); });