Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allow subclasses to use _fromObject. #5917

Closed
wants to merge 10 commits into from
15 changes: 14 additions & 1 deletion src/shapes/object.class.js
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,15 @@
*/
type: 'object',

/**
* Namespace the constructor of the object lies within.
* If set to null, the fabric namespace is used.
*
* @type String
* @default
*/
namespace: null,

/**
* Horizontal origin of transformation of an object (one of "left", "right", "center")
* See http://jsfiddle.net/1ow02gea/244/ on how originX/originY affect objects in groups
Expand Down Expand Up @@ -863,6 +872,10 @@
object.clipPath.absolutePositioned = this.clipPath.absolutePositioned;
}

if (this.namespace) {
object.namespace = this.namespace;
}

fabric.util.populateWithProperties(this, object, propertiesToInclude);
if (!this.includeDefaultValues) {
object = this._removeDefaultValues(object);
Expand Down Expand Up @@ -1932,7 +1945,7 @@
fabric.Object.NUM_FRACTION_DIGITS = 2;

fabric.Object._fromObject = function(className, object, callback, extraParam) {
var klass = fabric[className];
var klass = fabric.util.getKlass(className, object.namespace);
object = clone(object, true);
fabric.util.enlivenPatterns([object.fill, object.stroke], function(patterns) {
if (typeof patterns[0] !== 'undefined') {
Expand Down
8 changes: 4 additions & 4 deletions src/util/misc.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
(function(global) {
(function() {

var sqrt = Math.sqrt,
atan2 = Math.atan2,
Expand Down Expand Up @@ -318,7 +318,7 @@

var parts = namespace.split('.'),
len = parts.length, i,
obj = global || fabric.window;
obj = typeof global === 'undefined' ? fabric.window : global;

for (i = 0; i < len; ++i) {
obj = obj[parts[i]];
Expand Down Expand Up @@ -442,7 +442,7 @@
onLoaded();
return;
}
var klass = fabric.util.getKlass(o.type, namespace);
var klass = fabric.util.getKlass(o.type, o.namespace || namespace);
klass.fromObject(o, function (obj, error) {
error || (enlivenedObjects[index] = obj);
reviver && reviver(o, obj, error);
Expand Down Expand Up @@ -1012,4 +1012,4 @@
};
}
};
})(typeof exports !== 'undefined' ? exports : this);
})();
115 changes: 113 additions & 2 deletions test/unit/object.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
(function(){
(function(global){

var canvas = this.canvas = new fabric.StaticCanvas(null, {enableRetinaScaling: false});

Expand Down Expand Up @@ -278,6 +278,98 @@
assert.deepEqual(augmentedObjectRepr.strokeDashArray, toObjectObj.strokeDashArray);
});

QUnit.test('toObject with namespace', function(assert) {
var emptyObjectRepr = {
'version': fabric.version,
'type': 'object',
'namespace': 'Custom',
'originX': 'left',
'originY': 'top',
'left': 0,
'top': 0,
'width': 0,
'height': 0,
'fill': 'rgb(0,0,0)',
'stroke': null,
'strokeWidth': 1,
'strokeDashArray': null,
'strokeLineCap': 'butt',
'strokeDashOffset': 0,
'strokeLineJoin': 'miter',
'strokeMiterLimit': 4,
'scaleX': 1,
'scaleY': 1,
'angle': 0,
'flipX': false,
'flipY': false,
'opacity': 1,
'shadow': null,
'visible': true,
'backgroundColor': '',
'fillRule': 'nonzero',
'paintFirst': 'fill',
'globalCompositeOperation': 'source-over',
'skewX': 0,
'skewY': 0,
};

var augmentedObjectRepr = {
'version': fabric.version,
'type': 'object',
'namespace': 'Custom',
'originX': 'left',
'originY': 'top',
'left': 10,
'top': 20,
'width': 30,
'height': 40,
'fill': 'rgb(0,0,0)',
'stroke': null,
'strokeWidth': 1,
'strokeDashArray': [5, 2],
'strokeLineCap': 'round',
'strokeDashOffset': 0,
'strokeLineJoin': 'bevil',
'strokeMiterLimit': 5,
'scaleX': 1,
'scaleY': 1,
'angle': 0,
'flipX': true,
'flipY': false,
'opacity': 0.13,
'shadow': null,
'visible': true,
'backgroundColor': '',
'fillRule': 'nonzero',
'paintFirst': 'fill',
'globalCompositeOperation': 'source-over',
'skewX': 0,
'skewY': 0
};

var Custom = {
Object: fabric.util.createClass(fabric.Object, {
'namespace': 'Custom',
})
};

var cObj = new Custom.Object();
assert.deepEqual(emptyObjectRepr, cObj.toObject());

cObj.set('left', 10)
.set('top', 20)
.set('width', 30)
.set('height', 40)
.set('flipX', true)
.set('opacity', 0.13)
.set('strokeDashArray', [5, 2])
.set('strokeLineCap', 'round')
.set('strokeLineJoin', 'bevil')
.set('strokeMiterLimit', 5);

assert.deepEqual(augmentedObjectRepr, cObj.toObject());
});

QUnit.test('toDatalessObject', function(assert) {
var cObj = new fabric.Object();
assert.ok(typeof cObj.toDatalessObject === 'function');
Expand Down Expand Up @@ -371,6 +463,25 @@
});
});

QUnit.test('clone with namespace', function(assert) {
var MyClass = fabric.util.createClass(fabric.Object, {
namespace: 'MyNameSpace',
type: 'myClass'
});
MyClass.fromObject = function(object, callback) {
return fabric.Object._fromObject('MyClass', object, callback);
};
global.MyNameSpace = {
MyClass: MyClass
};
var cObj = new MyClass();
assert.ok(typeof cObj.clone === 'function');
cObj.clone(function(clone) {
assert.ok(clone instanceof MyClass);
delete global.MyNameSpace;
});
});

QUnit.test('cloneAsImage', function(assert) {
var done = assert.async();
var cObj = new fabric.Rect({ width: 100, height: 100, fill: 'red', strokeWidth: 0 });
Expand Down Expand Up @@ -1203,4 +1314,4 @@
object.fill = 'transparent';
assert.equal(object.hasFill(), false, 'with a color that is transparent, hasFill is true');
});
})();
})(typeof global !== 'undefined' ? global : this);