From 7f7cc074d12470cbe8f2f630591ddd54c043a8fa Mon Sep 17 00:00:00 2001
From: Denys Vuika <denis.vuyka@gmail.com>
Date: Sat, 4 Mar 2017 17:30:22 +0000
Subject: [PATCH] upgrade to latest ng2-charts (#1686)

---
 demo-shell-ng2/app/app.module.ts              |  4 ++-
 demo-shell-ng2/app/vendor.ts                  |  3 +-
 demo-shell-ng2/package.json                   |  6 ++--
 .../ng2-activiti-analytics/gulpfile.ts        |  2 +-
 .../ng2-activiti-analytics/index.ts           |  6 ++--
 .../ng2-activiti-analytics/karma-test-shim.js |  3 +-
 .../ng2-activiti-analytics/package.json       |  6 ++--
 .../analytics-generator.component.html        | 31 ++++++++++---------
 .../analytics-generator.component.spec.ts     |  6 ++--
 .../components/analytics.component.spec.ts    |  6 ++--
 10 files changed, 39 insertions(+), 34 deletions(-)

diff --git a/demo-shell-ng2/app/app.module.ts b/demo-shell-ng2/app/app.module.ts
index 5dde42379f..7a09e8d4f4 100644
--- a/demo-shell-ng2/app/app.module.ts
+++ b/demo-shell-ng2/app/app.module.ts
@@ -36,6 +36,7 @@ import { AppComponent } from './app.component';
 import { routing } from './app.routes';
 import { CustomEditorsModule } from './components/activiti/custom-editor/custom-editor.component';
 import { Editor3DModule } from 'ng2-3d-editor';
+import { ChartsModule } from 'ng2-charts';
 
 import {
     HomeComponent,
@@ -73,7 +74,8 @@ import {
         UserInfoComponentModule.forRoot(),
         AnalyticsModule.forRoot(),
         CustomEditorsModule,
-        Editor3DModule.forRoot()
+        Editor3DModule.forRoot(),
+        ChartsModule
     ],
     declarations: [
         AppComponent,
diff --git a/demo-shell-ng2/app/vendor.ts b/demo-shell-ng2/app/vendor.ts
index 2c8431a2be..780035eb6a 100644
--- a/demo-shell-ng2/app/vendor.ts
+++ b/demo-shell-ng2/app/vendor.ts
@@ -9,7 +9,7 @@ import '@angular/router';
 // RxJS
 import 'rxjs';
 
-//Alfresco
+// Alfresco
 import 'ng2-alfresco-core';
 import 'ng2-alfresco-datatable';
 import 'ng2-activiti-diagrams';
@@ -42,6 +42,7 @@ import '@angular/material/core/theming/prebuilt/deeppurple-amber.css'
 import 'ng2-activiti-form/stencils/runtime.ng1';
 import 'ng2-activiti-form/stencils/runtime.adf';
 
+import 'ng2-charts';
 import 'chart.js';
 require('script!raphael/raphael.min.js');
 
diff --git a/demo-shell-ng2/package.json b/demo-shell-ng2/package.json
index 5daedb6d34..8fcc15f256 100644
--- a/demo-shell-ng2/package.json
+++ b/demo-shell-ng2/package.json
@@ -74,9 +74,9 @@
     "pdfjs-dist": "1.5.404",
     "flag-icon-css": "2.3.0",
     "moment": "2.15.1",
-    "chart.js": "2.3.0",
-    "ng2-charts": "1.1.0",
-    "raphael": "^2.2.6",
+    "chart.js": "2.5.0",
+    "ng2-charts": "1.5.0",
+    "raphael": "2.2.7",
     "md-date-time-picker": "^2.2.0",
     "alfresco-js-api": "~1.2.0",
     "ng2-3d-editor": "0.0.15",
diff --git a/ng2-components/ng2-activiti-analytics/gulpfile.ts b/ng2-components/ng2-activiti-analytics/gulpfile.ts
index 57011140d1..4b65120d4f 100755
--- a/ng2-components/ng2-activiti-analytics/gulpfile.ts
+++ b/ng2-components/ng2-activiti-analytics/gulpfile.ts
@@ -183,7 +183,7 @@ gulp.task('build.bundles.app', (done) => {
             'ng2-alfresco-userinfo': 'node_modules/ng2-alfresco-userinfo/',
             'ng2-alfresco-viewer': 'node_modules/ng2-alfresco-viewer/',
             'ng2-alfresco-webscript': 'node_modules/ng2-alfresco-webscript/',
-            'ng2-charts': 'node_modules/ng2-charts',
+            'ng2-charts': 'node_modules/ng2-charts/bundles/ng2-charts.umd',
             'moment': 'node_modules/moment/min/moment.min'
 
         },
diff --git a/ng2-components/ng2-activiti-analytics/index.ts b/ng2-components/ng2-activiti-analytics/index.ts
index bdc34240d0..8eef12bc86 100644
--- a/ng2-components/ng2-activiti-analytics/index.ts
+++ b/ng2-components/ng2-activiti-analytics/index.ts
@@ -25,7 +25,7 @@ import { AnalyticsComponent } from './src/components/analytics.component';
 import { AnalyticsGeneratorComponent } from './src/components/analytics-generator.component';
 import { AnalyticsReportHeatMapComponent } from './src/components/analytics-report-heat-map.component';
 import { AnalyticsService } from './src/services/analytics.service';
-import { CHART_DIRECTIVES } from 'ng2-charts/ng2-charts';
+import { ChartsModule } from 'ng2-charts';
 
 import { WIDGET_DIRECTIVES } from './src/components/widgets/index';
 
@@ -52,11 +52,11 @@ export const ANALYTICS_PROVIDERS: any[] = [
 @NgModule({
     imports: [
         CoreModule,
+        ChartsModule,
         DiagramsModule
     ],
     declarations: [
-        ...ANALYTICS_DIRECTIVES,
-        ...CHART_DIRECTIVES
+        ...ANALYTICS_DIRECTIVES
     ],
     providers: [
         ...ANALYTICS_PROVIDERS
diff --git a/ng2-components/ng2-activiti-analytics/karma-test-shim.js b/ng2-components/ng2-activiti-analytics/karma-test-shim.js
index 50673b05cb..44dbb46254 100644
--- a/ng2-components/ng2-activiti-analytics/karma-test-shim.js
+++ b/ng2-components/ng2-activiti-analytics/karma-test-shim.js
@@ -61,7 +61,7 @@ var map = {
     // other libraries
     'rxjs': 'npm:rxjs',
     'ng2-translate': 'npm:ng2-translate',
-    'ng2-charts' : 'npm:ng2-charts',
+    'ng2-charts': 'npm:ng2-charts/bundles/ng2-charts.umd.js',
     'md-date-time-picker' : 'npm:md-date-time-picker',
     'moment' : 'npm:moment/min/moment.min.js',
 
@@ -74,7 +74,6 @@ var packages = {
     'app': { main: 'main.js',  defaultExtension: 'js' },
     'rxjs': {  defaultExtension: 'js' },
     'ng2-translate': { defaultExtension: 'js' },
-    'ng2-charts': { defaultExtension: 'js' },
     'md-date-time-picker': { defaultExtension: 'js' },
     'moment': { defaultExtension: 'js' },
 
diff --git a/ng2-components/ng2-activiti-analytics/package.json b/ng2-components/ng2-activiti-analytics/package.json
index f54e8fbd4a..16d907e842 100644
--- a/ng2-components/ng2-activiti-analytics/package.json
+++ b/ng2-components/ng2-activiti-analytics/package.json
@@ -57,11 +57,11 @@
     "rxjs": "5.0.0-beta.12",
     "systemjs": "0.19.27",
     "zone.js": "^0.6.23",
-    "chart.js": "2.3.0",
+    "chart.js": "2.5.0",
     "md-date-time-picker": "^2.2.0",
-    "ng2-charts": "1.1.0",
+    "ng2-charts": "1.5.0",
     "moment": "2.15.1",
-    "raphael": "^2.2.6",
+    "raphael": "2.2.7",
     "alfresco-js-api": "~1.2.0",
     "ng2-translate": "2.5.0",
     "ng2-alfresco-core": "1.2.0",
diff --git a/ng2-components/ng2-activiti-analytics/src/components/analytics-generator.component.html b/ng2-components/ng2-activiti-analytics/src/components/analytics-generator.component.html
index cf15b30497..f9b420d372 100644
--- a/ng2-components/ng2-activiti-analytics/src/components/analytics-generator.component.html
+++ b/ng2-components/ng2-activiti-analytics/src/components/analytics-generator.component.html
@@ -16,10 +16,11 @@
                     <div *ngIf="!report.hasData()">{{'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate}}</div>
                     <div *ngIf="report.hasData()">
                         <div *ngIf="report.hasZeroValues()">{{'ANALYTICS.MESSAGES.ZERO-DATA-FOUND' | translate}}</div>
-                        <base-chart *ngIf="!report.hasZeroValues()" class="chart"
-                                    [data]="report.data"
-                                    [labels]="report.labels"
-                                    [chartType]="report.type"></base-chart>
+                        <canvas baseChart *ngIf="!report.hasZeroValues()" class="chart"
+                                [data]="report.data"
+                                [labels]="report.labels"
+                                [chartType]="report.type">
+                        </canvas>
                     </div>
                 </div>
             </div>
@@ -69,11 +70,12 @@
                 <div class="col-md-6" *ngIf="isCurrent(idx)">
                     <h4>{{report.title}}</h4>
                     <div *ngIf="!report.hasDatasets()">{{'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate}}</div>
-                    <base-chart *ngIf="report.hasDatasets()" class="chart"
-                                [datasets]="report.datasets"
-                                [labels]="report.labels"
-                                [options]="report.options"
-                                [chartType]="report.type"></base-chart>
+                    <canvas baseChart *ngIf="report.hasDatasets()" class="chart"
+                            [datasets]="report.datasets"
+                            [labels]="report.labels"
+                            [options]="report.options"
+                            [chartType]="report.type">
+                    </canvas>
                 </div>
             </div>
             <div *ngSwitchCase="'multiBar'">
@@ -88,11 +90,12 @@
                                    (change)="refresh(report)">
                             <span class="mdl-checkbox__label">Stacked</span>
                         </label>
-                        <base-chart class="chart"
-                                    [datasets]="report.datasets"
-                                    [labels]="report.labels"
-                                    [options]="report.options"
-                                    [chartType]="'bar'"></base-chart>
+                        <canvas baseChart class="chart"
+                                [datasets]="report.datasets"
+                                [labels]="report.labels"
+                                [options]="report.options"
+                                [chartType]="'bar'">
+                        </canvas>
                     </div>
                 </div>
             </div>
diff --git a/ng2-components/ng2-activiti-analytics/src/components/analytics-generator.component.spec.ts b/ng2-components/ng2-activiti-analytics/src/components/analytics-generator.component.spec.ts
index e94809f961..27052caaef 100644
--- a/ng2-components/ng2-activiti-analytics/src/components/analytics-generator.component.spec.ts
+++ b/ng2-components/ng2-activiti-analytics/src/components/analytics-generator.component.spec.ts
@@ -18,7 +18,7 @@
 import { ComponentFixture, TestBed, async } from '@angular/core/testing';
 import { DebugElement } from '@angular/core';
 import { Observable } from 'rxjs/Rx';
-import { CHART_DIRECTIVES } from 'ng2-charts/ng2-charts';
+import { ChartsModule } from 'ng2-charts';
 import { CoreModule, AlfrescoTranslationService } from 'ng2-alfresco-core';
 import { DiagramsModule } from 'ng2-activiti-diagrams';
 
@@ -59,11 +59,11 @@ describe('AnalyticsGeneratorComponent', () => {
         TestBed.configureTestingModule({
             imports: [
                 CoreModule.forRoot(),
+                ChartsModule,
                 DiagramsModule.forRoot()
             ],
             declarations: [
-                ...ANALYTICS_DIRECTIVES,
-                ...CHART_DIRECTIVES
+                ...ANALYTICS_DIRECTIVES
             ],
             providers: [
                 ...ANALYTICS_PROVIDERS
diff --git a/ng2-components/ng2-activiti-analytics/src/components/analytics.component.spec.ts b/ng2-components/ng2-activiti-analytics/src/components/analytics.component.spec.ts
index a61ec1074a..660cd8eac2 100644
--- a/ng2-components/ng2-activiti-analytics/src/components/analytics.component.spec.ts
+++ b/ng2-components/ng2-activiti-analytics/src/components/analytics.component.spec.ts
@@ -18,7 +18,7 @@
 import { ComponentFixture, TestBed, async } from '@angular/core/testing';
 import { DebugElement } from '@angular/core';
 import { Observable } from 'rxjs/Rx';
-import { CHART_DIRECTIVES } from 'ng2-charts/ng2-charts';
+import { ChartsModule } from 'ng2-charts';
 import { CoreModule, AlfrescoTranslationService } from 'ng2-alfresco-core';
 import { DiagramsModule } from 'ng2-activiti-diagrams';
 
@@ -58,11 +58,11 @@ describe('AnalyticsComponent', () => {
         TestBed.configureTestingModule({
             imports: [
                 CoreModule.forRoot(),
+                ChartsModule,
                 DiagramsModule.forRoot()
             ],
             declarations: [
-                ...ANALYTICS_DIRECTIVES,
-                ...CHART_DIRECTIVES
+                ...ANALYTICS_DIRECTIVES
             ],
             providers: [
                 ...ANALYTICS_PROVIDERS