fix(controls) ISSUE-6201 Restore per object setting of controls visib…

…ility (#6226)

src/control.class.js

@@ -176,9 +176,14 @@
     /**
      * Returns controls visibility
      * @param {fabric.Object} object on which the control is displayed
+     * @param {String} controlKey key where the control is memorized on the
      * @return {Boolean}
      */
-    getVisibility: function(/*fabricObject */) {
+    getVisibility: function(fabricObject, controlKey) {
+      var objectVisibility = fabricObject._controlsVisibility;
+      if (objectVisibility && typeof objectVisibility[controlKey] !== 'undefined') {
+        return objectVisibility[controlKey];
+      }
       return this.visible;
     },
 
@@ -235,9 +240,6 @@
     */
     render: function(ctx, left, top, styleOverride, fabricObject) {
       styleOverride = styleOverride || {};
-      if (!this.getVisibility(fabricObject)) {
-        return;
-      }
       switch (styleOverride.cornerStyle || fabricObject.cornerStyle) {
         case 'circle':
           renderCircleControl.call(this, ctx, left, top, styleOverride, fabricObject);

src/controls.render.js

@@ -8,9 +8,6 @@
 
   function renderCircleControl (ctx, left, top, styleOverride, fabricObject) {
     styleOverride = styleOverride || {};
-    if (!this.getVisibility(fabricObject)) {
-      return;
-    }
     var size = styleOverride.cornerSize || fabricObject.cornerSize,
         transparentCorners = typeof styleOverride.transparentCorners !== 'undefined' ?
           styleOverride.transparentCorners : this.transparentCorners,
@@ -32,9 +29,6 @@
 
   function renderSquareControl(ctx, left, top, styleOverride, fabricObject) {
     styleOverride = styleOverride || {};
-    if (!this.getVisibility(fabricObject)) {
-      return;
-    }
     var size = styleOverride.cornerSize || fabricObject.cornerSize,
         transparentCorners = typeof styleOverride.transparentCorners !== 'undefined' ?
           styleOverride.transparentCorners : fabricObject.transparentCorners,

src/mixins/object_interactivity.mixin.js

@@ -3,7 +3,6 @@
   var degreesToRadians = fabric.util.degreesToRadians;
 
   fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prototype */ {
-
     /**
      * Determines which corner has been clicked
      * @private
@@ -193,7 +192,7 @@
         this.forEachControl(function(control, key, fabricObject) {
           // in this moment, the ctx is centered on the object.
           // width and height of the above function are the size of the bbox.
-          if (control.withConnection && control.getVisibility(fabricObject)) {
+          if (control.withConnection && control.getVisibility(fabricObject, key)) {
             // reset movement for each control
             shouldStroke = true;
             ctx.moveTo(control.x * width, control.y * height);
@@ -270,12 +269,13 @@
       }
       this._setLineDash(ctx, styleOverride.cornerDashArray || this.cornerDashArray, null);
       this.setCoords(false);
-      for (var c in this.controls) {
-        this.controls[c].render(ctx,
-          this.oCoords[c].x,
-          this.oCoords[c].y, styleOverride, this);
-      }
-
+      this.forEachControl(function(control, key, fabricObject) {
+        if (control.getVisibility(fabricObject, key)) {
+          control.render(ctx,
+            fabricObject.oCoords[key].x,
+            fabricObject.oCoords[key].y, styleOverride, fabricObject);
+        }
+      });
       ctx.restore();
 
       return this;
@@ -287,7 +287,7 @@
      * @returns {Boolean} true if the specified control is visible, false otherwise
      */
     isControlVisible: function(controlKey) {
-      return this.controls[controlKey] && this.controls[controlKey].getVisibility(this);
+      return this.controls[controlKey] && this.controls[controlKey].getVisibility(this, controlKey);
     },
 
     /**
@@ -298,7 +298,10 @@
      * @chainable
      */
     setControlVisible: function(controlKey, visible) {
-      this.controls[controlKey].setVisibility(visible, this, controlKey);
+      if (!this._controlsVisibility) {
+        this._controlsVisibility = {};
+      }
+      this._controlsVisibility[controlKey] = visible;
       return this;
     },
 
@@ -326,18 +329,6 @@
       return this;
     },
 
-    /**
-     * Returns the instance of the control visibility set for this object.
-     * @private
-     * @returns {Object}
-     */
-    _getControlsVisibility: function() {
-      var visibility = {};
-      this.forEachControl(function(control, key, fabricObject) {
-        visibility[key] = control.getVisibility(fabricObject);
-      });
-      return visibility;
-    },
 
     /**
      * This callback function is called every time _discardActiveObject or _setActiveObject

test/unit/object_interactivity.js

@@ -32,6 +32,23 @@
     assert.equal(cObj.isControlVisible('tl'), true);
   });
 
+  QUnit.test('setControlVisible is per object', function(assert) {
+    assert.ok(fabric.Object);
+
+    var cObj = new fabric.Object({ });
+    var cObj2 = new fabric.Object({ });
+
+    cObj.setControlVisible('tl', false);
+    assert.equal(cObj.isControlVisible('tl'), false, 'setting to false worked for cObj');
+    assert.equal(cObj2.isControlVisible('tl'), true, 'setting to false did not work for cObj2');
+    cObj.controls.tl.setVisibility(false);
+    assert.equal(cObj2.isControlVisible('tl'), false, 'setting directly on controls works for every object');
+    cObj.setControlVisible('tl', true);
+    assert.equal(cObj.isControlVisible('tl'), true, 'object setting takes precendence');
+    // restore original visibility
+    cObj.controls.tl.setVisibility(true);
+  });
+
   QUnit.test('setControlsVisibility', function(assert) {
     assert.ok(fabric.Object);