Hopiu/fabric.js
1
0
Fork 0
mirror of https://github.com/Hopiu/fabric.js.git synced 2026-04-09 00:40:59 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add enableRetinaScaling to cloneAsImage (#3147)

Browse source 
* Add enableRetinaScaling to cloneAsImage
* added test
This commit is contained in:
Andrea Bogazzi 2016-08-08 07:17:39 +02:00 committed by GitHub
parent c36225015a
commit a2b4ef564b
2 changed files with 33 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/shapes/object.class.js
View file

@ -1306,10 +1306,12 @@
/**
* Creates an instance of fabric.Image out of an object
* @param {Function} callback callback, invoked with an instance as a first argument
* @param {Object} [options] for clone as image, passed to toDataURL
* @param {Boolean} [options.enableRetinaScaling] enable retina scaling for the cloned image
* @return {fabric.Object} thisArg
*/
cloneAsImage: function(callback) {
var dataUrl = this.toDataURL();
cloneAsImage: function(callback, options) {
var dataUrl = this.toDataURL(options);
fabric.util.loadImage(dataUrl, function(img) {
if (callback) {
callback(new fabric.Image(img));
@ -1328,6 +1330,7 @@
* @param {Number} [options.top] Cropping top offset. Introduced in v1.2.14
* @param {Number} [options.width] Cropping width. Introduced in v1.2.14
* @param {Number} [options.height] Cropping height. Introduced in v1.2.14
* @param {Boolean} [options.enableRetina] Enable retina scaling for clone image. Introduce in 1.6.4
* @return {String} Returns a data: URL containing a representation of the object in the format specified by options.format
*/
toDataURL: function(options) {
@ -1340,7 +1343,7 @@
el.height = boundingRect.height;
fabric.util.wrapElement(el, 'div');
var canvas = new fabric.StaticCanvas(el);
var canvas = new fabric.StaticCanvas(el, { enableRetinaScaling: options.enableRetinaScaling });
// to avoid common confusion https://github.com/kangax/fabric.js/issues/806
if (options.format === 'jpg') {

29
test/unit/object.js
View file

@ -566,7 +566,7 @@ test('getBoundingRectWithStroke', function() {
});
asyncTest('cloneAsImage', function() {
var cObj = new fabric.Rect({ width: 100, height: 100, fill: 'red' });
var cObj = new fabric.Rect({ width: 100, height: 100, fill: 'red', strokeWidth: 0 });
ok(typeof cObj.cloneAsImage == 'function');
@ -580,6 +580,7 @@ test('getBoundingRectWithStroke', function() {
setTimeout(function() {
ok(image);
ok(image instanceof fabric.Image);
equal(image.width, 100, 'the image has same dimension of object');
start();
}, 500);
@ -589,6 +590,30 @@ test('getBoundingRectWithStroke', function() {
}
});
asyncTest('cloneAsImage with retina scaling enabled', function() {
var cObj = new fabric.Rect({ width: 100, height: 100, fill: 'red', strokeWidth: 0 });
fabric.devicePixelRatio = 2;
if (!fabric.Canvas.supports('toDataURL')) {
fabric.log('`toDataURL` is not supported by this environment; skipping `cloneAsImage` test (as it relies on `toDataURL`)');
start();
}
else {
var image;
setTimeout(function() {
ok(image);
ok(image instanceof fabric.Image);
equal(image.width, 200, 'the image has been scaled by retina');
fabric.devicePixelRatio = 1;
start();
}, 500);
cObj.cloneAsImage(function(i) {
image = i;
}, { enableRetinaScaling: true });
}
});
test('toDataURL', function() {
// var data =
// 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQA'+
@ -601,7 +626,7 @@ test('getBoundingRectWithStroke', function() {
// 'JC0eQCGpM0DMCRtHsDjB5K06yueJFXJAAAAAElFTkSuQmCC';
var cObj = new fabric.Rect({
width: 100, height: 100, fill: 'red'
width: 100, height: 100, fill: 'red', strokeWidth: 0
});
ok(typeof cObj.toDataURL == 'function');