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

Various fixes (#3057)

Browse source 
Fixes hidden textarea positioning, rendering fixes during canvas zoom.
This commit is contained in:
Andrea Bogazzi 2016-06-19 23:33:54 +02:00 committed by GitHub
parent 40db6b3f21
commit be8dfae17e
12 changed files with 25730 additions and 110 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

101
dist/fabric.js vendored
View file

@ -1,4 +1,4 @@
/* build: `node build.js modules=ALL exclude=json,gestures minifier=uglifyjs` */
/* build: `node build.js modules=ALL exclude=gestures,json minifier=uglifyjs` */
/*! Fabric.js Copyright 2008-2015, Printio (Juriy Zaytsev, Maxim Chernyak) */
var fabric = fabric || { version: "1.6.2" };
@ -6949,7 +6949,7 @@ fabric.Pattern = fabric.util.createClass(/** @lends fabric.Pattern.prototype */
getVpCenter: function() {
var center = this.getCenter(),
iVpt = fabric.util.invertTransform(this.viewportTransform);
return fabric.util.transformPoint({x: center.left, y: center.top}, iVpt);
return fabric.util.transformPoint({ x: center.left, y: center.top }, iVpt);
},
/**
@ -8412,6 +8412,15 @@ fabric.PatternBrush = fabric.util.createClass(fabric.PencilBrush, /** @lends fab
*/
altActionKey: 'shiftKey',
/**
* Indicates which key enable last rendered selection independently of stack position
* values: altKey, shiftKey, ctrlKey
* @since 1.6.3
* @type String
* @default
*/
lastRenderedKey: 'altKey',
/**
* Indicates that canvas is interactive. This property should not be changed.
* @type Boolean
@ -9238,9 +9247,10 @@ fabric.PatternBrush = fabric.util.createClass(fabric.PencilBrush, /** @lends fab
/**
* @private
*/
_isLastRenderedObject: function(pointer) {
_isLastRenderedObject: function(pointer, e) {
var lastRendered = this.lastRenderedWithControls;
return (
(this.preserveObjectStacking || e[this.lastRenderedKey]) &&
lastRendered &&
lastRendered.visible &&
(this.containsPoint(null, lastRendered, pointer) ||
@ -9269,7 +9279,7 @@ fabric.PatternBrush = fabric.util.createClass(fabric.PencilBrush, /** @lends fab
objects = this._objects;
this.targets = [ ];
if (this._isLastRenderedObject(pointer)) {
if (this._isLastRenderedObject(pointer, e)) {
objects = [this.lastRenderedWithControls];
}
@ -13388,12 +13398,19 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
return [1, 0, 0, 1, 0, 0];
},
/*
* calculate trasform Matrix that represent current transformation from
* object properties.
* @param {Boolean} ignoreTranslation Ignores center translation.
* @return {Array} matrix Transform Matrix for the object
*/
calcTransformMatrix: function() {
var center = this.getCenterPoint(),
translateMatrix = [1, 0, 0, 1, center.x, center.y],
translateMatrix = [1, 0, 0, 1, center.x, center.y];
rotateMatrix = this._calcRotateMatrix(),
dimensionMatrix = this._calcDimensionsTransformMatrix(this.skewX, this.skewY, true),
matrix = this.group ? this.group.calcTransformMatrix() : [1, 0, 0, 1, 0, 0];
matrix = multiplyMatrices(matrix, translateMatrix);
matrix = multiplyMatrices(matrix, rotateMatrix);
matrix = multiplyMatrices(matrix, dimensionMatrix);
@ -13877,12 +13894,10 @@ fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prot
_calculateCurrentDimensions: function() {
var vpt = this.getViewportTransform(),
dim = this._getTransformedDimensions(),
w = dim.x, h = dim.y;
w = dim.x, h = dim.y,
p = fabric.util.transformPoint(new fabric.Point(w, h), vpt, true);
w += 2 * this.padding;
h += 2 * this.padding;
return fabric.util.transformPoint(new fabric.Point(w, h), vpt, true);
return p.scalarAdd(2 * this.padding);
},
/**
@ -13898,8 +13913,11 @@ fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prot
return this;
}
ctx.save();
var center = this.getCenterPoint(), wh = this._calculateCurrentDimensions();
var center = this.getCenterPoint(), wh = this._calculateCurrentDimensions(),
vpt = this.canvas.viewportTransform,
iVpt = fabric.util.invertTransform(vpt);
ctx.translate(center.x, center.y);
ctx.transform.apply(ctx, iVpt);
ctx.rotate(degreesToRadians(this.angle));
ctx.fillStyle = this.selectionBackgroundColor;
ctx.fillRect(-wh.x/2, -wh.y/2, wh.x, wh.y);
@ -21918,14 +21936,17 @@ fabric.Image.filters.BaseFilter = fabric.util.createClass(/** @lends fabric.Imag
charHeight = this.getCurrentCharFontSize(lineIndex, charIndex),
leftOffset = (lineIndex === 0 && charIndex === 0)
? this._getLineLeftOffset(this._getLineWidth(ctx, lineIndex))
: boundaries.leftOffset;
: boundaries.leftOffset,
multiplier = this.scaleX * this.canvas.getZoom(),
cursorWidth = this.cursorWidth / multiplier;
ctx.fillStyle = this.getCurrentCharColor(lineIndex, charIndex);
ctx.globalAlpha = this.__isMousedown ? 1 : this._currentCursorOpacity;
ctx.fillRect(
boundaries.left + leftOffset,
boundaries.left + leftOffset - cursorWidth/2,
boundaries.top + boundaries.topOffset,
this.cursorWidth / this.scaleX,
cursorWidth,
charHeight);
},
@ -22960,21 +22981,25 @@ fabric.Image.filters.BaseFilter = fabric.util.createClass(/** @lends fabric.Imag
if (!this.hiddenTextarea || this.inCompositionMode) {
return;
}
this.hiddenTextarea.value = this.text;
this.hiddenTextarea.selectionStart = this.selectionStart;
this.hiddenTextarea.selectionEnd = this.selectionEnd;
if (this.selectionStart === this.selectionEnd) {
var p = this._calcTextareaPosition();
this.hiddenTextarea.style.left = p.x + 'px';
this.hiddenTextarea.style.top = p.y + 'px';
var style = this._calcTextareaPosition();
this.hiddenTextarea.style.left = style.left;
this.hiddenTextarea.style.top = style.top;
this.hiddenTextarea.style.fontSize = style.fontSize;
}
},
/**
* @private
* @return {Object} style contains style for hiddenTextarea
*/
_calcTextareaPosition: function() {
if (!this.canvas) {
return { x: 1, y: 1 };
}
var chars = this.text.split(''),
boundaries = this._getCursorBoundaries(chars, 'cursor'),
cursorLocation = this.get2DCursorLocation(),
@ -22985,9 +23010,31 @@ fabric.Image.filters.BaseFilter = fabric.util.createClass(/** @lends fabric.Imag
? this._getLineLeftOffset(this._getLineWidth(this.ctx, lineIndex))
: boundaries.leftOffset,
m = this.calcTransformMatrix(),
p = { x: boundaries.left + leftOffset, y: boundaries.top + boundaries.topOffset + charHeight };
this.hiddenTextarea.style.fontSize = charHeight + 'px';
return fabric.util.transformPoint(p, m);
p = {
x: boundaries.left + leftOffset,
y: boundaries.top + boundaries.topOffset + charHeight
},
upperCanvas = this.canvas.upperCanvasEl,
maxWidth = upperCanvas.width - charHeight,
maxHeight = upperCanvas.height - charHeight;
p = fabric.util.transformPoint(p, m);
p = fabric.util.transformPoint(p, this.canvas.viewportTransform);
if (p.x < 0) {
p.x = 0;
}
if (p.x > maxWidth) {
p.x = maxWidth;
}
if (p.y < 0) {
p.y = 0;
}
if (p.y > maxHeight) {
p.y = maxHeight;
}
return { left: p.x + 'px', top: p.y + 'px', fontSize: charHeight};
},
/**
@ -23561,18 +23608,12 @@ fabric.util.object.extend(fabric.IText.prototype, /** @lends fabric.IText.protot
* Initializes hidden textarea (needed to bring up keyboard in iOS)
*/
initHiddenTextarea: function(e) {
var p;
if (e && this.canvas) {
p = this.canvas.getPointer(e);
}
else {
this.oCoords || this.setCoords();
p = this.oCoords.tl;
}
this.hiddenTextarea = fabric.document.createElement('textarea');
this.hiddenTextarea.setAttribute('autocapitalize', 'off');
this.hiddenTextarea.style.cssText = 'position: absolute; top: ' + p.y + 'px; left: ' + p.x + 'px; opacity: 0;'
var style = this._calcTextareaPosition();
this.hiddenTextarea.style.cssText = 'position: absolute; top: ' + style.top + '; left: ' + style.left + '; opacity: 0;'
+ ' width: 0px; height: 0px; z-index: -999;';
if (this.canvas) {
this.canvas.lowerCanvasEl.parentNode.appendChild(this.hiddenTextarea);

25322
dist/fabric.require.js vendored
View file

File diff suppressed because one or more lines are too long

14
src/canvas.class.js
View file

@ -101,6 +101,15 @@
*/
altActionKey: 'shiftKey',
/**
* Indicates which key enable last rendered selection independently of stack position
* values: altKey, shiftKey, ctrlKey
* @since 1.6.3
* @type String
* @default
*/
lastRenderedKey: 'altKey',
/**
* Indicates that canvas is interactive. This property should not be changed.
* @type Boolean
@ -927,9 +936,10 @@
/**
* @private
*/
_isLastRenderedObject: function(pointer) {
_isLastRenderedObject: function(pointer, e) {
var lastRendered = this.lastRenderedWithControls;
return (
(this.preserveObjectStacking || e[this.lastRenderedKey]) &&
lastRendered &&
lastRendered.visible &&
(this.containsPoint(null, lastRendered, pointer) ||
@ -958,7 +968,7 @@
objects = this._objects;
this.targets = [ ];
if (this._isLastRenderedObject(pointer)) {
if (this._isLastRenderedObject(pointer, e)) {
objects = [this.lastRenderedWithControls];
}

40
src/mixins/itext_behavior.mixin.js
View file

@ -425,21 +425,25 @@
if (!this.hiddenTextarea || this.inCompositionMode) {
return;
}
this.hiddenTextarea.value = this.text;
this.hiddenTextarea.selectionStart = this.selectionStart;
this.hiddenTextarea.selectionEnd = this.selectionEnd;
if (this.selectionStart === this.selectionEnd) {
var p = this._calcTextareaPosition();
this.hiddenTextarea.style.left = p.x + 'px';
this.hiddenTextarea.style.top = p.y + 'px';
var style = this._calcTextareaPosition();
this.hiddenTextarea.style.left = style.left;
this.hiddenTextarea.style.top = style.top;
this.hiddenTextarea.style.fontSize = style.fontSize;
}
},
/**
* @private
* @return {Object} style contains style for hiddenTextarea
*/
_calcTextareaPosition: function() {
if (!this.canvas) {
return { x: 1, y: 1 };
}
var chars = this.text.split(''),
boundaries = this._getCursorBoundaries(chars, 'cursor'),
cursorLocation = this.get2DCursorLocation(),
@ -450,9 +454,31 @@
? this._getLineLeftOffset(this._getLineWidth(this.ctx, lineIndex))
: boundaries.leftOffset,
m = this.calcTransformMatrix(),
p = { x: boundaries.left + leftOffset, y: boundaries.top + boundaries.topOffset + charHeight };
this.hiddenTextarea.style.fontSize = charHeight + 'px';
return fabric.util.transformPoint(p, m);
p = {
x: boundaries.left + leftOffset,
y: boundaries.top + boundaries.topOffset + charHeight
},
upperCanvas = this.canvas.upperCanvasEl,
maxWidth = upperCanvas.width - charHeight,
maxHeight = upperCanvas.height - charHeight;
p = fabric.util.transformPoint(p, m);
p = fabric.util.transformPoint(p, this.canvas.viewportTransform);
if (p.x < 0) {
p.x = 0;
}
if (p.x > maxWidth) {
p.x = maxWidth;
}
if (p.y < 0) {
p.y = 0;
}
if (p.y > maxHeight) {
p.y = maxHeight;
}
return { left: p.x + 'px', top: p.y + 'px', fontSize: charHeight };
},
/**

16
src/mixins/itext_key_behavior.mixin.js
View file

@ -3,20 +3,12 @@ fabric.util.object.extend(fabric.IText.prototype, /** @lends fabric.IText.protot
/**
* Initializes hidden textarea (needed to bring up keyboard in iOS)
*/
initHiddenTextarea: function(e) {
var p;
if (e && this.canvas) {
p = this.canvas.getPointer(e);
}
else {
this.oCoords || this.setCoords();
p = this.oCoords.tl;
}
initHiddenTextarea: function() {
this.hiddenTextarea = fabric.document.createElement('textarea');
this.hiddenTextarea.setAttribute('autocapitalize', 'off');
this.hiddenTextarea.style.cssText = 'position: absolute; top: ' + p.y + 'px; left: ' + p.x + 'px; opacity: 0;'
+ ' width: 0px; height: 0px; z-index: -999;';
var style = this._calcTextareaPosition();
this.hiddenTextarea.style.cssText = 'position: absolute; top: ' + style.top + '; left: ' + style.left + ';'
+ ' opacity: 0; width: 0px; height: 0px; z-index: -999;';
if (this.canvas) {
this.canvas.lowerCanvasEl.parentNode.appendChild(this.hiddenTextarea);
}

12
src/mixins/object_geometry.mixin.js
View file

@ -205,20 +205,19 @@
},
/**
* Returns width of an object
* Returns width of an object bounding box counting transformations
* @return {Number} width value
*/
getWidth: function() {
//needs to be changed
return this._getTransformedDimensions().x;
},
/**
* Returns height of an object
* Returns height of an object bounding box counting transformations
* to be renamed in 2.0
* @return {Number} height value
*/
getHeight: function() {
//needs to be changed
return this._getTransformedDimensions().y;
},
@ -358,6 +357,11 @@
return [1, 0, 0, 1, 0, 0];
},
/*
* calculate trasform Matrix that represent current transformation from
* object properties.
* @return {Array} matrix Transform Matrix for the object
*/
calcTransformMatrix: function() {
var center = this.getCenterPoint(),
translateMatrix = [1, 0, 0, 1, center.x, center.y],

13
src/mixins/object_interactivity.mixin.js
View file

@ -179,12 +179,10 @@
_calculateCurrentDimensions: function() {
var vpt = this.getViewportTransform(),
dim = this._getTransformedDimensions(),
w = dim.x, h = dim.y;
w = dim.x, h = dim.y,
p = fabric.util.transformPoint(new fabric.Point(w, h), vpt, true);
w += 2 * this.padding;
h += 2 * this.padding;
return fabric.util.transformPoint(new fabric.Point(w, h), vpt, true);
return p.scalarAdd(2 * this.padding);
},
/**
@ -200,8 +198,11 @@
return this;
}
ctx.save();
var center = this.getCenterPoint(), wh = this._calculateCurrentDimensions();
var center = this.getCenterPoint(), wh = this._calculateCurrentDimensions(),
vpt = this.canvas.viewportTransform,
iVpt = fabric.util.invertTransform(vpt);
ctx.translate(center.x, center.y);
ctx.transform.apply(ctx, iVpt);
ctx.rotate(degreesToRadians(this.angle));
ctx.fillStyle = this.selectionBackgroundColor;
ctx.fillRect(-wh.x/2, -wh.y/2, wh.x, wh.y);

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

@ -491,14 +491,17 @@
charHeight = this.getCurrentCharFontSize(lineIndex, charIndex),
leftOffset = (lineIndex === 0 && charIndex === 0)
? this._getLineLeftOffset(this._getLineWidth(ctx, lineIndex))
: boundaries.leftOffset;
: boundaries.leftOffset,
multiplier = this.scaleX * this.canvas.getZoom(),
cursorWidth = this.cursorWidth / multiplier;
ctx.fillStyle = this.getCurrentCharColor(lineIndex, charIndex);
ctx.globalAlpha = this.__isMousedown ? 1 : this._currentCursorOpacity;
ctx.fillRect(
boundaries.left + leftOffset,
boundaries.left + leftOffset - cursorWidth/2,
boundaries.top + boundaries.topOffset,
this.cursorWidth / this.scaleX,
cursorWidth,
charHeight);
},

3
test.js
View file

@ -34,7 +34,8 @@ testrunner.run({
'./test/unit/pattern.js',
'./test/unit/shadow.js',
'./test/unit/object_interactivity.js',
'./test/unit/object_origin.js',
'./test/unit/object_geometry.js',
'./test/unit/object_origin.js',
'./test/unit/itext.js'
]
}, function(err, report) {

37
test/unit/object.js
View file

@ -101,7 +101,7 @@
test('set and minScaleLimit', function() {
var cObj = new fabric.Object({ left: 11, top: 22, width: 50, height: 60, opacity: 0.7 });
//the min scale limit is given by height.
equal(cObj.minScaleLimit.toFixed(3), 0.017);
@ -111,7 +111,7 @@
equal(cObj.minScaleLimit, 0.001);
cObj.set('width', 1);
equal(cObj.width, 1);
equal(cObj.width, 1);
//the min scale limit is given by height.
equal(cObj.minScaleLimit.toFixed(3), 0.017);
});
@ -339,7 +339,7 @@
deepEqual(augmentedObjectRepr.transformMatrix, toObjectObj.transformMatrix);
notEqual(augmentedObjectRepr.strokeDashArray, toObjectObj.strokeDashArray);
deepEqual(augmentedObjectRepr.strokeDashArray, toObjectObj.strokeDashArray);
});
test('toDatalessObject', function() {
@ -522,37 +522,6 @@ test('getBoundingRectWithStroke', function() {
equal(cObj.get('angle'), 45);
});
test('setCoords', function() {
var cObj = new fabric.Object({ left: 150, top: 150, width: 100, height: 100, strokeWidth: 0});
ok(typeof cObj.setCoords == 'function');
equal(cObj.setCoords(), cObj, 'chainable');
cObj.set('left', 250).set('top', 250);
// coords should still correspond to initial one, even after invoking `set`
equal(cObj.oCoords.tl.x, 150);
equal(cObj.oCoords.tl.y, 150);
equal(cObj.oCoords.tr.x, 250);
equal(cObj.oCoords.tr.y, 150);
equal(cObj.oCoords.bl.x, 150);
equal(cObj.oCoords.bl.y, 250);
equal(cObj.oCoords.br.x, 250);
equal(cObj.oCoords.br.y, 250);
// recalculate coords
cObj.setCoords();
// check that coords are now updated
equal(cObj.oCoords.tl.x, 250);
equal(cObj.oCoords.tl.y, 250);
equal(cObj.oCoords.tr.x, 350);
equal(cObj.oCoords.tr.y, 250);
equal(cObj.oCoords.bl.x, 250);
equal(cObj.oCoords.bl.y, 350);
equal(cObj.oCoords.br.x, 350);
equal(cObj.oCoords.br.y, 350);
});
test('drawBorders', function() {
var cObj = new fabric.Object(), canvas = fabric.document.createElement('canvas');

75
test/unit/object_geometry.js Normal file
View file

@ -0,0 +1,75 @@
(function() {
QUnit.module('fabric.ObjectGeometry');
test('setCoords', function() {
var cObj = new fabric.Object({ left: 150, top: 150, width: 100, height: 100, strokeWidth: 0});
ok(typeof cObj.setCoords == 'function');
equal(cObj.setCoords(), cObj, 'chainable');
cObj.set('left', 250).set('top', 250);
// coords should still correspond to initial one, even after invoking `set`
equal(cObj.oCoords.tl.x, 150);
equal(cObj.oCoords.tl.y, 150);
equal(cObj.oCoords.tr.x, 250);
equal(cObj.oCoords.tr.y, 150);
equal(cObj.oCoords.bl.x, 150);
equal(cObj.oCoords.bl.y, 250);
equal(cObj.oCoords.br.x, 250);
equal(cObj.oCoords.br.y, 250);
equal(cObj.oCoords.mtr.x, 200);
equal(cObj.oCoords.mtr.y, 110);
// recalculate coords
cObj.setCoords();
// check that coords are now updated
equal(cObj.oCoords.tl.x, 250);
equal(cObj.oCoords.tl.y, 250);
equal(cObj.oCoords.tr.x, 350);
equal(cObj.oCoords.tr.y, 250);
equal(cObj.oCoords.bl.x, 250);
equal(cObj.oCoords.bl.y, 350);
equal(cObj.oCoords.br.x, 350);
equal(cObj.oCoords.br.y, 350);
equal(cObj.oCoords.mtr.x, 300);
equal(cObj.oCoords.mtr.y, 210);
});
test('calcTransformMatrix', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 });
ok(typeof cObj.calcTransformMatrix == 'function', 'calcTransformMatrix should exist');
});
test('_calcDimensionsTransformMatrix', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 });
ok(typeof cObj._calcDimensionsTransformMatrix == 'function', '_calcDimensionsTransformMatrix should exist');
});
test('_calcRotateMatrix', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 });
ok(typeof cObj._calcRotateMatrix == 'function', '_calcRotateMatrix should exist');
});
test('scaleToHeight', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 });
ok(typeof cObj.scaleToHeight == 'function', 'scaleToHeight should exist');
});
test('scaleToWidth', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 });
ok(typeof cObj.scaleToWidth == 'function', 'scaleToWidth should exist');
});
test('scale', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 });
ok(typeof cObj.scale == 'function', 'scale should exist');
});
test('_constrainScale', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 });
ok(typeof cObj._constrainScale == 'function', '_constrainScale should exist');
});
})();

198
test/unit/object_interactivity.js
View file

@ -84,4 +84,202 @@
equal(cObj.isControlVisible('mtr'), true);
});
test('_setCornerCoords', function(){
var cObj = new fabric.Object({ top: 10, left: 10, width: 10, height: 10, strokeWidth: 0 });
ok(typeof cObj._setCornerCoords == 'function', '_setCornerCoords should exist');
cObj.setCoords();
equal(cObj.oCoords.tl.corner.tl.x.toFixed(2), 3.5);
equal(cObj.oCoords.tl.corner.tl.y.toFixed(2), 3.5);
equal(cObj.oCoords.tl.corner.tr.x.toFixed(2), 16.5);
equal(cObj.oCoords.tl.corner.tr.y.toFixed(2), 3.5);
equal(cObj.oCoords.tl.corner.bl.x.toFixed(2), 3.5);
equal(cObj.oCoords.tl.corner.bl.y.toFixed(2), 16.5);
equal(cObj.oCoords.tl.corner.br.x.toFixed(2), 16.5);
equal(cObj.oCoords.tl.corner.br.y.toFixed(2), 16.5);
equal(cObj.oCoords.bl.corner.tl.x.toFixed(2), 3.5);
equal(cObj.oCoords.bl.corner.tl.y.toFixed(2), 13.5);
equal(cObj.oCoords.bl.corner.tr.x.toFixed(2), 16.5);
equal(cObj.oCoords.bl.corner.tr.y.toFixed(2), 13.5);
equal(cObj.oCoords.bl.corner.bl.x.toFixed(2), 3.5);
equal(cObj.oCoords.bl.corner.bl.y.toFixed(2), 26.5);
equal(cObj.oCoords.bl.corner.br.x.toFixed(2), 16.5);
equal(cObj.oCoords.bl.corner.br.y.toFixed(2), 26.5);
equal(cObj.oCoords.tr.corner.tl.x.toFixed(2), 13.5);
equal(cObj.oCoords.tr.corner.tl.y.toFixed(2), 3.5);
equal(cObj.oCoords.tr.corner.tr.x.toFixed(2), 26.5);
equal(cObj.oCoords.tr.corner.tr.y.toFixed(2), 3.5);
equal(cObj.oCoords.tr.corner.bl.x.toFixed(2), 13.5);
equal(cObj.oCoords.tr.corner.bl.y.toFixed(2), 16.5);
equal(cObj.oCoords.tr.corner.br.x.toFixed(2), 26.5);
equal(cObj.oCoords.tr.corner.br.y.toFixed(2), 16.5);
equal(cObj.oCoords.br.corner.tl.x.toFixed(2), 13.5);
equal(cObj.oCoords.br.corner.tl.y.toFixed(2), 13.5);
equal(cObj.oCoords.br.corner.tr.x.toFixed(2), 26.5);
equal(cObj.oCoords.br.corner.tr.y.toFixed(2), 13.5);
equal(cObj.oCoords.br.corner.bl.x.toFixed(2), 13.5);
equal(cObj.oCoords.br.corner.bl.y.toFixed(2), 26.5);
equal(cObj.oCoords.br.corner.br.x.toFixed(2), 26.5);
equal(cObj.oCoords.br.corner.br.y.toFixed(2), 26.5);
equal(cObj.oCoords.mtr.corner.tl.x.toFixed(2), 8.5);
equal(cObj.oCoords.mtr.corner.tl.y.toFixed(2), -36.5);
equal(cObj.oCoords.mtr.corner.tr.x.toFixed(2), 21.5);
equal(cObj.oCoords.mtr.corner.tr.y.toFixed(2), -36.5);
equal(cObj.oCoords.mtr.corner.bl.x.toFixed(2), 8.5);
equal(cObj.oCoords.mtr.corner.bl.y.toFixed(2), -23.5);
equal(cObj.oCoords.mtr.corner.br.x.toFixed(2), 21.5);
equal(cObj.oCoords.mtr.corner.br.y.toFixed(2), -23.5);
});
test('_findTargetCorner', function(){
var cObj = new fabric.Object({ top: 10, left: 10, width: 30, height: 30, strokeWidth: 0 });
ok(typeof cObj._findTargetCorner == 'function', '_findTargetCorner should exist');
cObj.setCoords();
cObj.active = true;
equal(cObj._findTargetCorner(cObj.oCoords.br), 'br');
equal(cObj._findTargetCorner(cObj.oCoords.tl), 'tl');
equal(cObj._findTargetCorner(cObj.oCoords.tr), 'tr');
equal(cObj._findTargetCorner(cObj.oCoords.bl), 'bl');
equal(cObj._findTargetCorner(cObj.oCoords.mr), 'mr');
equal(cObj._findTargetCorner(cObj.oCoords.ml), 'ml');
equal(cObj._findTargetCorner(cObj.oCoords.mt), 'mt');
equal(cObj._findTargetCorner(cObj.oCoords.mb), 'mb');
equal(cObj._findTargetCorner(cObj.oCoords.mtr), 'mtr');
equal(cObj._findTargetCorner({ x: 0, y: 0 }), false);
});
test('_calculateCurrentDimensions', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 }), dim;
ok(typeof cObj._calculateCurrentDimensions == 'function', '_calculateCurrentDimensions should exist');
dim = cObj._calculateCurrentDimensions();
equal(dim.x, 10);
equal(dim.y, 15);
cObj.strokeWidth = 2;
dim = cObj._calculateCurrentDimensions();
equal(dim.x, 12, 'strokeWidth should be added to dimension');
equal(dim.y, 17, 'strokeWidth should be added to dimension');
cObj.scaleX = 2;
dim = cObj._calculateCurrentDimensions();
equal(dim.x, 24, 'width should be doubled');
equal(dim.y, 17, 'height should not change');
cObj.scaleY = 2;
dim = cObj._calculateCurrentDimensions();
equal(dim.x, 24, 'width should not change');
equal(dim.y, 34, 'height should be doubled');
cObj.angle = 45;
dim = cObj._calculateCurrentDimensions();
equal(dim.x, 24, 'width should not change');
equal(dim.y, 34, 'height should not change');
cObj.skewX = 45;
dim = cObj._calculateCurrentDimensions();
equal(dim.x.toFixed(0), 58, 'width should change');
equal(dim.y.toFixed(0), 34, 'height should not change');
cObj.skewY = 45;
dim = cObj._calculateCurrentDimensions();
equal(dim.x.toFixed(0), 82, 'width should not change');
equal(dim.y.toFixed(0), 58, 'height should change');
cObj.padding = 10;
dim = cObj._calculateCurrentDimensions();
equal(dim.x.toFixed(0), 102, 'width should change');
equal(dim.y.toFixed(0), 78, 'height should change');
});
test('_getTransformedDimensions', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 }), dim;
ok(typeof cObj._getTransformedDimensions == 'function', '_getTransformedDimensions should exist');
dim = cObj._getTransformedDimensions();
equal(dim.x, 10);
equal(dim.y, 15);
cObj.strokeWidth = 2;
dim = cObj._getTransformedDimensions();
equal(dim.x, 12, 'strokeWidth should be added to dimension');
equal(dim.y, 17, 'strokeWidth should be added to dimension');
cObj.scaleX = 2;
dim = cObj._getTransformedDimensions();
equal(dim.x, 24, 'width should be doubled');
equal(dim.y, 17, 'height should not change');
cObj.scaleY = 2;
dim = cObj._getTransformedDimensions();
equal(dim.x, 24, 'width should not change');
equal(dim.y, 34, 'height should be doubled');
cObj.angle = 45;
dim = cObj._getTransformedDimensions();
equal(dim.x, 24, 'width should not change');
equal(dim.y, 34, 'height should not change');
cObj.skewX = 45;
dim = cObj._getTransformedDimensions();
equal(dim.x.toFixed(0), 58, 'width should change');
equal(dim.y.toFixed(0), 34, 'height should not change');
cObj.skewY = 45;
dim = cObj._getTransformedDimensions();
equal(dim.x.toFixed(0), 82, 'width should not change');
equal(dim.y.toFixed(0), 58, 'height should change');
cObj.padding = 10;
dim = cObj._getTransformedDimensions();
equal(dim.x.toFixed(0), 82, 'width should not change');
equal(dim.y.toFixed(0), 58, 'height should not change');
});
test('_getNonTransformedDimensions', function(){
var cObj = new fabric.Object({ width: 10, height: 15, strokeWidth: 0 }), dim;
ok(typeof cObj._getNonTransformedDimensions == 'function', '_getNonTransformedDimensions should exist');
dim = cObj._getNonTransformedDimensions();
equal(dim.x, 10);
equal(dim.y, 15);
cObj.strokeWidth = 2;
dim = cObj._getNonTransformedDimensions();
equal(dim.x, 12, 'strokeWidth should be added to dimension');
equal(dim.y, 17, 'strokeWidth should be added to dimension');
cObj.scaleX = 2;
dim = cObj._getNonTransformedDimensions();
equal(dim.x, 12, 'width should not change');
equal(dim.y, 17, 'height should not change');
cObj.scaleY = 2;
dim = cObj._getNonTransformedDimensions();
equal(dim.x, 12, 'width should not change');
equal(dim.y, 17, 'height should not change');
cObj.angle = 45;
dim = cObj._getNonTransformedDimensions();
equal(dim.x, 12, 'width should not change');
equal(dim.y, 17, 'height should not change');
cObj.skewX = 45;
dim = cObj._getNonTransformedDimensions();
equal(dim.x, 12, 'width should not change');
equal(dim.y, 17, 'height should not change');
cObj.skewY = 45;
dim = cObj._getNonTransformedDimensions();
equal(dim.x, 12, 'width should not change');
equal(dim.y, 17, 'height should not change');
cObj.padding = 10;
dim = cObj._getNonTransformedDimensions();
equal(dim.x, 12, 'width should not change');
equal(dim.y, 17, 'height should not change');
});
})();