Hopiu/fabric.js
1
0
Fork 0
mirror of https://github.com/Hopiu/fabric.js.git synced 2026-05-17 02:01:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Remove delegated properties from groups (#4062)

Browse source 
* changed code
* added small test
* first step to group simplification
* first step to group simplification
* removed test
This commit is contained in:
Andrea Bogazzi 2017-07-03 13:44:48 +02:00 committed by GitHub
parent 4c2e83d089
commit b841be66de
2 changed files with 49 additions and 72 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
src/shapes/group.class.js
View file

@ -11,18 +11,6 @@
return;
}
// lock-related properties, for use in fabric.Group#get
// to enable locking behavior on group
// when one of its objects has lock-related properties set
var _lockProperties = {
lockMovementX: true,
lockMovementY: true,
lockRotation: true,
lockScalingX: true,
lockScalingY: true,
lockUniScaling: true
};
/**
* Group class
* @class fabric.Group
@ -56,11 +44,20 @@
/**
* Groups are container, do not render anything on theyr own, ence no cache properties
* @type Boolean
* @type Array
* @default
*/
cacheProperties: [],
/**
* setOnGroup is a method used for TextBox that is no more used since 2.0.0 The behavior is still
* available setting this boolean to true.
* @type Boolean
* @since 2.0.0
* @default
*/
useSetOnGroup: false,
/**
* Constructor
* @param {Object} objects Group objects
@ -75,7 +72,6 @@
// if objects enclosed in a group have been grouped already,
// we cannot change properties of objects.
// Thus we need to set options to group without objects,
// because delegatedProperties propagate to objects.
isAlreadyGrouped && this.callSuper('initialize', options);
this._objects = objects || [];
@ -222,36 +218,18 @@
object.set('active', false);
},
/**
* Properties that are delegated to group objects when reading/writing
* @param {Object} delegatedProperties
*/
delegatedProperties: {
fill: true,
stroke: true,
strokeWidth: true,
fontFamily: true,
fontWeight: true,
fontSize: true,
fontStyle: true,
lineHeight: true,
textDecoration: true,
textAlign: true,
backgroundColor: true
},
/**
* @private
*/
_set: function(key, value) {
var i = this._objects.length;
if (this.delegatedProperties[key] || key === 'canvas') {
if (key === 'canvas') {
while (i--) {
this._objects[i].set(key, value);
}
}
else {
if (this.useSetOnGroup) {
while (i--) {
this._objects[i].setOnGroup(key, value);
}
@ -574,33 +552,6 @@
return reviver ? reviver(markup.join('')) : markup.join('');
},
/* _TO_SVG_END_ */
/**
* Returns requested property
* @param {String} prop Property to get
* @return {*}
*/
get: function(prop) {
if (prop in _lockProperties) {
if (this[prop]) {
return this[prop];
}
else {
for (var i = 0, len = this._objects.length; i < len; i++) {
if (this._objects[i][prop]) {
return true;
}
}
return false;
}
}
else {
if (prop in this.delegatedProperties) {
return this._objects[0] && this._objects[0].get(prop);
}
return this[prop];
}
}
});
/**

48
test/unit/group.js
View file

@ -411,21 +411,22 @@
equal(group.get('lockMovementX'), false);
group.getObjects()[0].lockMovementX = true;
equal(group.get('lockMovementX'), true);
group.getObjects()[0].lockMovementX = false;
equal(group.get('lockMovementX'), false);
// TODO acitveGroup
// group.getObjects()[0].lockMovementX = true;
// equal(group.get('lockMovementX'), true);
//
// group.getObjects()[0].lockMovementX = false;
// equal(group.get('lockMovementX'), false);
group.set('lockMovementX', true);
equal(group.get('lockMovementX'), true);
group.set('lockMovementX', false);
group.getObjects()[0].lockMovementY = true;
group.getObjects()[1].lockRotation = true;
equal(group.get('lockMovementY'), true);
equal(group.get('lockRotation'), true);
// group.set('lockMovementX', false);
// group.getObjects()[0].lockMovementY = true;
// group.getObjects()[1].lockRotation = true;
//
// equal(group.get('lockMovementY'), true);
// equal(group.get('lockRotation'), true);
});
test('z-index methods with group objects', function() {
@ -670,6 +671,31 @@
equal(rect3.shouldCache(), false, 'rect3 will not cache because group2 is caching');
});
test('useSetOnGroup', function() {
var rect1 = new fabric.Rect({ top: 1, left: 1, width: 2, height: 2, strokeWidth: 0, fill: 'red', opacity: 1, objectCaching: true}),
rect2 = new fabric.Rect({ top: 5, left: 5, width: 2, height: 2, strokeWidth: 0, fill: 'red', opacity: 1, objectCaching: true}),
group = new fabric.Group([rect1, rect2]);
var count = 0;
var inspectKey = '';
var inspectValue = '';
rect1.setOnGroup = function(key, value) {
count++;
inspectKey = key;
inspectValue = value;
};
group.set('fill', 'red');
equal(count, 0, 'setOnGroup has not been called');
equal(inspectKey, '', 'setOnGroup has not been called');
equal(inspectValue, '', 'setOnGroup has not been called');
group.useSetOnGroup = true;
group.set('fill', 'red');
equal(count, 1, 'setOnGroup has been called');
equal(inspectKey, 'fill', 'setOnGroup has been called');
equal(inspectValue, 'red', 'setOnGroup has been called');
});
// asyncTest('cloning group with image', function() {
// var rect = new fabric.Rect({ top: 100, left: 100, width: 30, height: 10 }),
// img = new fabric.Image(_createImageElement()),