Cleanup & fix animation duration (not using globals anymore)

Author: Jelte Lagendijk

src/ChartJS/lib/moment.js

@@ -57,6 +57,11 @@
             <category>Appearance</category>
             <description>Switch animation on and off. Try to switch it off when you have rendering problems with multiple charts on a page</description>
         </property>
+        <property key="animationDuration" type="integer" required="true" defaultValue="1000">
+            <caption>Animation duration</caption>
+            <category>Appearance</category>
+            <description>Animation duration (milliseconds) for rendering (this is different from the Responsive animation duration)</description>
+        </property>
         <!-- Data Source -->
         <property key="sourceentity" type="entity" required="true" allowNonPersistableEntities="true">
             <caption>Chart Entity</caption>

src/ChartJS/widgets/BarChart/BarChart.xml

@@ -89,10 +89,6 @@ define([
             this._chartJS.defaults.global.tooltipEvents = ["mouseover", "mouseup", "mousedown", "mousemove", "touchstart", "touchmove", "mouseout"];
             this._chartJS.defaults.global.tooltipXOffset = 0;
 
-            if (!this.chartAnimation) {
-                this._chartJS.defaults.global.animation.duration = 0;
-            }
-
             // Set object , dataset and datapoint.
             this._dataset = this.datasetentity.split("/")[0];
             this._datapoint = this.datapointentity && this.datapointentity.split("/")[0];
@@ -569,7 +565,10 @@ define([
                     labels : { fontFamily : this._font }
                 },
                 maintainAspectRatio : this.maintainAspectRatio,
-                showTooltips : this.showTooltips
+                showTooltips : this.showTooltips,
+                animation: {
+                    duration: this.chartAnimation ? 1000 : 0
+                }
             };
 
             return lang.mixin(lang.clone(defaultOptions), options);

src/ChartJS/widgets/Core.js

@@ -47,6 +47,11 @@
                 <category>Appearance</category>
                 <description>Switch animation on and off. Try to switch it off when you have rendering problems with multiple charts on a page</description>
             </property>
+            <property key="animationDuration" type="integer" required="true" defaultValue="1000">
+                <caption>Animation duration</caption>
+                <category>Appearance</category>
+                <description>Animation duration (milliseconds) for rendering (this is different from the Responsive animation duration)</description>
+            </property>
             <!-- Data Source -->
             <property key="sourceentity" type="entity" required="true" allowNonPersistableEntities="true">
                 <caption>Chart Entity</caption>

src/ChartJS/widgets/DoughnutChart/DoughnutChart.xml

@@ -64,6 +64,11 @@
             <category>Appearance</category>
             <description>Switch animation on and off. Try to switch it off when you have rendering problems with multiple charts on a page</description>
         </property>
+        <property key="animationDuration" type="integer" required="true" defaultValue="1000">
+            <caption>Animation duration</caption>
+            <category>Appearance</category>
+            <description>Animation duration (milliseconds) for rendering (this is different from the Responsive animation duration)</description>
+        </property>
         <!-- Data Source -->
         <property key="sourceentity" type="entity" required="true" allowNonPersistableEntities="true">
             <caption>Chart Entity</caption>

src/ChartJS/widgets/LineChart/LineChart.xml

@@ -50,6 +50,11 @@
             <category>Appearance</category>
             <description>Switch animation on and off. Try to switch it off when you have rendering problems with multiple charts on a page</description>
         </property>
+        <property key="animationDuration" type="integer" required="true" defaultValue="1000">
+            <caption>Animation duration</caption>
+            <category>Appearance</category>
+            <description>Animation duration (milliseconds) for rendering (this is different from the Responsive animation duration)</description>
+        </property>
         <!-- Data Source -->
         <property key="sourceentity" type="entity" required="true" allowNonPersistableEntities="true">
             <caption>Chart Entity</caption>

src/ChartJS/widgets/PieChart/PieChart.xml

@@ -46,6 +46,11 @@
                 <caption>Animation</caption>
                 <category>Appearance</category>
                 <description>Switch animation on and off. Try to switch it off when you have rendering problems with multiple charts on a page</description>
+            </property>
+            <property key="animationDuration" type="integer" required="true" defaultValue="1000">
+                <caption>Animation duration</caption>
+                <category>Appearance</category>
+                <description>Animation duration (milliseconds) for rendering (this is different from the Responsive animation duration)</description>
             </property>
 			<!-- Data Source -->
 			<property key="sourceentity" type="entity" required="true" allowNonPersistableEntities="true">

src/ChartJS/widgets/PolarChart/PolarChart.xml

@@ -47,6 +47,11 @@
             <category>Appearance</category>
             <description>Switch animation on and off. Try to switch it off when you have rendering problems with multiple charts on a page</description>
         </property>
+        <property key="animationDuration" type="integer" required="true" defaultValue="1000">
+            <caption>Animation duration</caption>
+            <category>Appearance</category>
+            <description>Animation duration (milliseconds) for rendering (this is different from the Responsive animation duration)</description>
+        </property>
         <!-- Data Source -->
         <property key="sourceentity" type="entity" required="true" allowNonPersistableEntities="true">
             <caption>Chart Entity</caption>

src/ChartJS/widgets/RadarChart/RadarChart.xml

@@ -57,6 +57,11 @@
             <category>Appearance</category>
             <description>Switch animation on and off. Try to switch it off when you have rendering problems with multiple charts on a page</description>
         </property>
+        <property key="animationDuration" type="integer" required="true" defaultValue="1000">
+            <caption>Animation duration</caption>
+            <category>Appearance</category>
+            <description>Animation duration (milliseconds) for rendering (this is different from the Responsive animation duration)</description>
+        </property>
         <!-- Data Source -->
 		<property key="sourceentity" type="entity" required="true" allowNonPersistableEntities="true">
 			<caption>Chart Entity</caption>