Set line dash in external function (#2928)

* move dashed code in function for later reuse in controls * Added functionTest
fabricjs · May 2, 2016 · e032cae · e032cae
1 parent 17775fa
commit e032cae
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 12 deletions.
diff --git a/src/shapes/object.class.js b/src/shapes/object.class.js
@@ -1078,6 +1078,29 @@
       }
     },
 
+    /**
+     * @private
+     * Sets line dash
+     * @param {CanvasRenderingContext2D} ctx Context to set the dash line on
+     * @param {Array} dashArray array representing dashes
+     * @param {Function} alternative function to call if browaser does not support lineDash
+     */
+    _setLineDash: function(ctx, dashArray, alternative) {
+      if (!dashArray) {
+        return;
+      }
+      // Spec requires the concatenation of two copies the dash list when the number of elements is odd
+      if (1 & dashArray.length) {
+        dashArray.push.apply(dashArray, dashArray);
+      }
+      if (supportsLineDash) {
+        ctx.setLineDash(dashArray);
+      }
+      else {
+        alternative && alternative(ctx);
+      }
+    },
+
     /**
      * Renders controls and borders for the object
      * @param {CanvasRenderingContext2D} ctx Context to render on
@@ -1185,18 +1208,7 @@
 
       ctx.save();
 
-      if (this.strokeDashArray) {
-        // Spec requires the concatenation of two copies the dash list when the number of elements is odd
-        if (1 & this.strokeDashArray.length) {
-          this.strokeDashArray.push.apply(this.strokeDashArray, this.strokeDashArray);
-        }
-        if (supportsLineDash) {
-          ctx.setLineDash(this.strokeDashArray);
-        }
-        else {
-          this._renderDashedStroke && this._renderDashedStroke(ctx);
-        }
-      }
+      this._setLineDash(ctx, this.strokeDashArray, this._renderDashedStroke);
       if (this.stroke.gradientTransform) {
         var g = this.stroke.gradientTransform;
         ctx.transform.apply(ctx, g);

diff --git a/test/unit/object.js b/test/unit/object.js
@@ -755,6 +755,17 @@ test('toDataURL & reference to canvas', function() {
     equal(object.get('left'), 112.45, 'non boolean properties should not be affected');
   });
 
+  test('_setLineDash', function() {
+    var object = new fabric.Rect({ left: 100, top: 124, width: 210, height: 66, stroke: 'black', strokeWidth: 2});
+    ok(typeof object._setLineDash === 'function');
+
+    canvas.add(object);
+    object.strokeDashArray = [3, 2, 1];
+    equal(object.strokeDashArray.length, 3, 'strokeDash array is odd');
+    canvas.renderAll();
+    equal(object.strokeDashArray.length, 6, 'strokeDash array now is even');
+  });
+
   test('straighten', function() {
     var object = new fabric.Object({ left: 100, top: 124, width: 210, height: 66 });
     ok(typeof object.straighten == 'function');