Refactor padding parsing under helpers.options (#4544)

New Chart.helpers.options.toPadding helpers that converts a number or object into a padding {top, right, bottom, left, height, width} object.

diff --git a/src/core/core.layoutService.js b/src/core/core.layoutService.js
index 65adac88f2f0dd18bbaeb1117413b227e9fb1d97..98907de27d3bb08e58c38349bebc1f4460d71e51 100644 (file)
--- a/src/core/core.layoutService.js
+++ b/src/core/core.layoutService.js
@@ -113,26 +113,12 @@ module.exports = function(Chart) {
                                return;
                        }
 
-                       var layoutOptions = chart.options.layout;
-                       var padding = layoutOptions ? layoutOptions.padding : null;
-
-                       var leftPadding = 0;
-                       var rightPadding = 0;
-                       var topPadding = 0;
-                       var bottomPadding = 0;
-
-                       if (!isNaN(padding)) {
-                               // options.layout.padding is a number. assign to all
-                               leftPadding = padding;
-                               rightPadding = padding;
-                               topPadding = padding;
-                               bottomPadding = padding;
-                       } else {
-                               leftPadding = padding.left || 0;
-                               rightPadding = padding.right || 0;
-                               topPadding = padding.top || 0;
-                               bottomPadding = padding.bottom || 0;
-                       }
+                       var layoutOptions = chart.options.layout || {};
+                       var padding = helpers.options.toPadding(layoutOptions.padding);
+                       var leftPadding = padding.left;
+                       var rightPadding = padding.right;
+                       var topPadding = padding.top;
+                       var bottomPadding = padding.bottom;
 
                        var leftBoxes = filterByPosition(chart.boxes, 'left');
                        var rightBoxes = filterByPosition(chart.boxes, 'right');

diff --git a/src/helpers/helpers.options.js b/src/helpers/helpers.options.js
index 1aab9bb9660b6c49df311d40184333992036f472..15e14c16a5fcc1ac1f46516227fe1621d05a18f1 100644 (file)
--- a/src/helpers/helpers.options.js
+++ b/src/helpers/helpers.options.js
@@ -1,5 +1,7 @@
 'use strict';
 
+var helpers = require('./helpers.core');
+
 /**
  * @namespace Chart.helpers.options
  */
@@ -18,7 +20,7 @@ module.exports = {
                        return size * 1.2;
                }
 
-               value = parseFloat(matches[2]);
+               value = +matches[2];
 
                switch (matches[3]) {
                case 'px':
@@ -31,5 +33,34 @@ module.exports = {
                }
 
                return size * value;
+       },
+
+       /**
+        * Converts the given value into a padding object with pre-computed width/height.
+        * @param {Number|Object} value - If a number, set the value to all TRBL component,
+        *  else, if and object, use defined properties and sets undefined ones to 0.
+        * @returns {Object} The padding values (top, right, bottom, left, width, height)
+        * @since 2.7.0
+        */
+       toPadding: function(value) {
+               var t, r, b, l;
+
+               if (helpers.isObject(value)) {
+                       t = +value.top || 0;
+                       r = +value.right || 0;
+                       b = +value.bottom || 0;
+                       l = +value.left || 0;
+               } else {
+                       t = r = b = l = +value || 0;
+               }
+
+               return {
+                       top: t,
+                       right: r,
+                       bottom: b,
+                       left: l,
+                       height: t + b,
+                       width: l + r
+               };
        }
 };

diff --git a/test/specs/helpers.options.tests.js b/test/specs/helpers.options.tests.js
index 1b01159dce1d180cff31b87c66333469f91962db..46e5222868f10a25003767902bc83b1860a36986 100644 (file)
--- a/test/specs/helpers.options.tests.js
+++ b/test/specs/helpers.options.tests.js
@@ -24,4 +24,41 @@ describe('Chart.helpers.options', function() {
                        expect(options.toLineHeight('foobar', 16)).toBe(16 * 1.2);
                });
        });
+
+       describe('toPadding', function() {
+               it ('should support number values', function() {
+                       expect(options.toPadding(4)).toEqual(
+                               {top: 4, right: 4, bottom: 4, left: 4, height: 8, width: 8});
+                       expect(options.toPadding(4.5)).toEqual(
+                               {top: 4.5, right: 4.5, bottom: 4.5, left: 4.5, height: 9, width: 9});
+               });
+               it ('should support string values', function() {
+                       expect(options.toPadding('4')).toEqual(
+                               {top: 4, right: 4, bottom: 4, left: 4, height: 8, width: 8});
+                       expect(options.toPadding('4.5')).toEqual(
+                               {top: 4.5, right: 4.5, bottom: 4.5, left: 4.5, height: 9, width: 9});
+               });
+               it ('should support object values', function() {
+                       expect(options.toPadding({top: 1, right: 2, bottom: 3, left: 4})).toEqual(
+                               {top: 1, right: 2, bottom: 3, left: 4, height: 4, width: 6});
+                       expect(options.toPadding({top: 1.5, right: 2.5, bottom: 3.5, left: 4.5})).toEqual(
+                               {top: 1.5, right: 2.5, bottom: 3.5, left: 4.5, height: 5, width: 7});
+                       expect(options.toPadding({top: '1', right: '2', bottom: '3', left: '4'})).toEqual(
+                               {top: 1, right: 2, bottom: 3, left: 4, height: 4, width: 6});
+               });
+               it ('should fallback to 0 for invalid values', function() {
+                       expect(options.toPadding({top: 'foo', right: 'foo', bottom: 'foo', left: 'foo'})).toEqual(
+                               {top: 0, right: 0, bottom: 0, left: 0, height: 0, width: 0});
+                       expect(options.toPadding({top: null, right: null, bottom: null, left: null})).toEqual(
+                               {top: 0, right: 0, bottom: 0, left: 0, height: 0, width: 0});
+                       expect(options.toPadding({})).toEqual(
+                               {top: 0, right: 0, bottom: 0, left: 0, height: 0, width: 0});
+                       expect(options.toPadding('foo')).toEqual(
+                               {top: 0, right: 0, bottom: 0, left: 0, height: 0, width: 0});
+                       expect(options.toPadding(null)).toEqual(
+                               {top: 0, right: 0, bottom: 0, left: 0, height: 0, width: 0});
+                       expect(options.toPadding(undefined)).toEqual(
+                               {top: 0, right: 0, bottom: 0, left: 0, height: 0, width: 0});
+               });
+       });
 });