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

[BACK_INCOMPAT] Make fabric.Object#toDataURL synchronous. Fix fabric.Object#cloneAsImage to preserve angle. Closes #596

Browse source
This commit is contained in:
kangax 2013-05-01 14:49:02 -04:00
parent f5b88b4045
commit 35d5cf220f
5 changed files with 55 additions and 87 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

62
dist/all.js vendored
View file

@ -10322,37 +10322,23 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
* Creates an instance of fabric.Image out of an object
* @param callback {Function} callback, invoked with an instance as a first argument
* @return {fabric.Object} thisArg
* @chainable
*/
cloneAsImage: function(callback) {
if (fabric.Image) {
var orig = {
angle: this.getAngle(),
flipX: this.getFlipX(),
flipY: this.getFlipY()
};
// normalize angle
this.set({ angle: 0, flipX: false, flipY: false });
this.toDataURL(function(dataUrl) {
fabric.util.loadImage(dataUrl, function(img) {
if (callback) {
callback(new fabric.Image(img), orig);
}
});
});
}
var dataUrl = this.toDataURL();
fabric.util.loadImage(dataUrl, function(img) {
if (callback) {
callback(new fabric.Image(img));
}
});
return this;
},
/**
* Converts an object into a data-url-like string
* @param callback {Function} callback that recieves resulting data-url string
* @return {String} data url representing an image of this object
*/
toDataURL: function(callback) {
toDataURL: function() {
var el = fabric.util.createCanvasElement();
el.width = this.getBoundingRectWidth();
el.height = this.getBoundingRectHeight();
@ -10362,27 +10348,27 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
canvas.backgroundColor = 'transparent';
canvas.renderAll();
if (this.constructor.async) {
this.clone(proceed);
}
else {
proceed(this.clone());
}
var origParams = {
active: this.get('active'),
left: this.getLeft(),
top: this.getTop()
};
function proceed(clone) {
clone.left = el.width / 2;
clone.top = el.height / 2;
this.set({
'active': false,
left: el.width / 2,
top: el.height / 2
});
clone.set('active', false);
canvas.add(this);
var data = canvas.toDataURL();
canvas.add(clone);
var data = canvas.toDataURL();
this.set(origParams).setCoords();
canvas.dispose();
canvas = clone = null;
canvas.dispose();
canvas = null;
callback && callback(data);
}
return data;
},
/**

6
dist/all.min.js vendored
View file

File diff suppressed because one or more lines are too long

BIN
dist/all.min.js.gz vendored
View file

Binary file not shown.

62
src/object.class.js
View file

@ -690,37 +690,23 @@
* Creates an instance of fabric.Image out of an object
* @param callback {Function} callback, invoked with an instance as a first argument
* @return {fabric.Object} thisArg
* @chainable
*/
cloneAsImage: function(callback) {
if (fabric.Image) {
var orig = {
angle: this.getAngle(),
flipX: this.getFlipX(),
flipY: this.getFlipY()
};
// normalize angle
this.set({ angle: 0, flipX: false, flipY: false });
this.toDataURL(function(dataUrl) {
fabric.util.loadImage(dataUrl, function(img) {
if (callback) {
callback(new fabric.Image(img), orig);
}
});
});
}
var dataUrl = this.toDataURL();
fabric.util.loadImage(dataUrl, function(img) {
if (callback) {
callback(new fabric.Image(img));
}
});
return this;
},
/**
* Converts an object into a data-url-like string
* @param callback {Function} callback that recieves resulting data-url string
* @return {String} data url representing an image of this object
*/
toDataURL: function(callback) {
toDataURL: function() {
var el = fabric.util.createCanvasElement();
el.width = this.getBoundingRectWidth();
el.height = this.getBoundingRectHeight();
@ -730,27 +716,27 @@
canvas.backgroundColor = 'transparent';
canvas.renderAll();
if (this.constructor.async) {
this.clone(proceed);
}
else {
proceed(this.clone());
}
var origParams = {
active: this.get('active'),
left: this.getLeft(),
top: this.getTop()
};
function proceed(clone) {
clone.left = el.width / 2;
clone.top = el.height / 2;
this.set({
'active': false,
left: el.width / 2,
top: el.height / 2
});
clone.set('active', false);
canvas.add(this);
var data = canvas.toDataURL();
canvas.add(clone);
var data = canvas.toDataURL();
this.set(origParams).setCoords();
canvas.dispose();
canvas = clone = null;
canvas.dispose();
canvas = null;
callback && callback(data);
}
return data;
},
/**

12
test/unit/object.js
View file

@ -433,7 +433,7 @@
}
});
asyncTest('toDataURL', function() {
test('toDataURL', function() {
var data =
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQA'+
'AABkCAYAAABw4pVUAAAA+UlEQVR4nO3RoRHAQBDEsOu/6YR+B2s'+
@ -452,15 +452,11 @@
if (!fabric.Canvas.supports('toDataURL')) {
alert('toDataURL is not supported by this environment. Some of the tests can not be run.');
start();
}
else {
cObj.toDataURL(function(dataURL) {
equal(typeof dataURL, 'string');
equal(dataURL.substring(0, 21), 'data:image/png;base64');
start();
});
var dataURL = cObj.toDataURL();
equal(typeof dataURL, 'string');
equal(dataURL.substring(0, 21), 'data:image/png;base64');
}
});