mirror of
https://github.com/Hopiu/fabric.js.git
synced 2026-05-05 12:24:46 +00:00
commit
c461792a39
7 changed files with 50 additions and 37 deletions
|
|
@ -84,7 +84,9 @@ fabric.util.object.extend(fabric.IText.prototype, /** @lends fabric.IText.protot
|
|||
*/
|
||||
initMousedownHandler: function() {
|
||||
this.on('mousedown', function(options) {
|
||||
|
||||
if (!this.editable) {
|
||||
return;
|
||||
}
|
||||
var pointer = this.canvas.getPointer(options.e);
|
||||
|
||||
this.__mousedownX = pointer.x;
|
||||
|
|
@ -122,7 +124,7 @@ fabric.util.object.extend(fabric.IText.prototype, /** @lends fabric.IText.protot
|
|||
initMouseupHandler: function() {
|
||||
this.on('mouseup', function(options) {
|
||||
this.__isMousedown = false;
|
||||
if (this._isObjectMoved(options.e)) {
|
||||
if (!this.editable || this._isObjectMoved(options.e)) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -60,8 +60,7 @@ fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prot
|
|||
angle = this.getAngle(),
|
||||
skewX = (this.getSkewX() % 360),
|
||||
skewY = (this.getSkewY() % 360),
|
||||
vpt = !this.canvas || this.canvas.svgViewportTransformation ? this.getViewportTransform() : [1, 0, 0, 1, 0, 0],
|
||||
center = fabric.util.transformPoint(this.getCenterPoint(), vpt),
|
||||
center = this.getCenterPoint(),
|
||||
|
||||
NUM_FRACTION_DIGITS = fabric.Object.NUM_FRACTION_DIGITS,
|
||||
|
||||
|
|
@ -75,23 +74,23 @@ fabric.util.object.extend(fabric.Object.prototype, /** @lends fabric.Object.prot
|
|||
? (' rotate(' + toFixed(angle, NUM_FRACTION_DIGITS) + ')')
|
||||
: '',
|
||||
|
||||
scalePart = (this.scaleX === 1 && this.scaleY === 1 && vpt[0] === 1 && vpt[3] === 1)
|
||||
scalePart = (this.scaleX === 1 && this.scaleY === 1)
|
||||
? '' :
|
||||
(' scale(' +
|
||||
toFixed(this.scaleX * vpt[0], NUM_FRACTION_DIGITS) +
|
||||
toFixed(this.scaleX, NUM_FRACTION_DIGITS) +
|
||||
' ' +
|
||||
toFixed(this.scaleY * vpt[3], NUM_FRACTION_DIGITS) +
|
||||
toFixed(this.scaleY, NUM_FRACTION_DIGITS) +
|
||||
')'),
|
||||
|
||||
skewXPart = skewX !== 0 ? ' skewX(' + toFixed(skewX, NUM_FRACTION_DIGITS) + ')' : '',
|
||||
|
||||
skewYPart = skewY !== 0 ? ' skewY(' + toFixed(skewY, NUM_FRACTION_DIGITS) + ')' : '',
|
||||
|
||||
addTranslateX = this.type === 'path-group' ? this.width * vpt[0] : 0,
|
||||
addTranslateX = this.type === 'path-group' ? this.width : 0,
|
||||
|
||||
flipXPart = this.flipX ? ' matrix(-1 0 0 1 ' + addTranslateX + ' 0) ' : '',
|
||||
|
||||
addTranslateY = this.type === 'path-group' ? this.height * vpt[3] : 0,
|
||||
addTranslateY = this.type === 'path-group' ? this.height : 0,
|
||||
|
||||
flipYPart = this.flipY ? ' matrix(1 0 0 -1 0 ' + addTranslateY + ')' : '';
|
||||
|
||||
|
|
|
|||
|
|
@ -130,12 +130,16 @@
|
|||
*/
|
||||
fabric.parseTransformAttribute = (function() {
|
||||
function rotateMatrix(matrix, args) {
|
||||
var angle = args[0];
|
||||
var angle = args[0],
|
||||
x = (args.length === 3) ? args[1] : 0,
|
||||
y = (args.length === 3) ? args[2] : 0;
|
||||
|
||||
matrix[0] = Math.cos(angle);
|
||||
matrix[1] = Math.sin(angle);
|
||||
matrix[2] = -Math.sin(angle);
|
||||
matrix[3] = Math.cos(angle);
|
||||
matrix[4] = x - (matrix[0] * x + matrix[2] * y);
|
||||
matrix[5] = y - (matrix[1] * x + matrix[3] * y);
|
||||
}
|
||||
|
||||
function scaleMatrix(matrix, args) {
|
||||
|
|
|
|||
|
|
@ -209,7 +209,8 @@
|
|||
*/
|
||||
delegatedProperties: {
|
||||
fill: true,
|
||||
opacity: true,
|
||||
stroke: true,
|
||||
strokeWidth: true,
|
||||
fontFamily: true,
|
||||
fontWeight: true,
|
||||
fontSize: true,
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@
|
|||
var extend = fabric.util.object.extend,
|
||||
getElementOffset = fabric.util.getElementOffset,
|
||||
removeFromArray = fabric.util.removeFromArray,
|
||||
toFixed = fabric.util.toFixed,
|
||||
|
||||
CANVAS_INIT_ERROR = new Error('Could not initialize `canvas` element');
|
||||
|
||||
|
|
@ -1183,6 +1184,8 @@
|
|||
* @param {Number} [options.viewBox.width] Width of viewbox
|
||||
* @param {Number} [options.viewBox.height] Height of viewbox
|
||||
* @param {String} [options.encoding=UTF-8] Encoding of SVG output
|
||||
* @param {String} [options.width] desired width of svg with or without units
|
||||
* @param {String} [options.height] desired height of svg with or without units
|
||||
* @param {Function} [reviver] Method for further parsing of svg elements, called after each fabric object converted into svg representation.
|
||||
* @return {String} SVG string
|
||||
* @tutorial {@link http://fabricjs.com/fabric-intro-part-3/#serialization}
|
||||
|
|
@ -1232,32 +1235,40 @@
|
|||
* @private
|
||||
*/
|
||||
_setSVGPreamble: function(markup, options) {
|
||||
if (!options.suppressPreamble) {
|
||||
markup.push(
|
||||
'<?xml version="1.0" encoding="', (options.encoding || 'UTF-8'), '" standalone="no" ?>\n',
|
||||
'<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" ',
|
||||
'"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\n'
|
||||
);
|
||||
if (options.suppressPreamble) {
|
||||
return;
|
||||
}
|
||||
markup.push(
|
||||
'<?xml version="1.0" encoding="', (options.encoding || 'UTF-8'), '" standalone="no" ?>\n',
|
||||
'<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" ',
|
||||
'"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\n'
|
||||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
_setSVGHeader: function(markup, options) {
|
||||
var width, height, vpt;
|
||||
var width = options.width || this.width,
|
||||
height = options.height || this.height,
|
||||
vpt, viewBox = 'viewBox="0 0 ' + this.width + ' ' + this.height + '" ',
|
||||
NUM_FRACTION_DIGITS = fabric.Object.NUM_FRACTION_DIGITS;
|
||||
|
||||
if (options.viewBox) {
|
||||
width = options.viewBox.width;
|
||||
height = options.viewBox.height;
|
||||
viewBox = 'viewBox="' +
|
||||
options.viewBox.x + ' ' +
|
||||
options.viewBox.y + ' ' +
|
||||
options.viewBox.width + ' ' +
|
||||
options.viewBox.height + '" ';
|
||||
}
|
||||
else {
|
||||
width = this.width;
|
||||
height = this.height;
|
||||
if (!this.svgViewportTransformation) {
|
||||
if (this.svgViewportTransformation) {
|
||||
vpt = this.viewportTransform;
|
||||
width /= vpt[0];
|
||||
height /= vpt[3];
|
||||
viewBox = 'viewBox="' +
|
||||
toFixed(-vpt[4] / vpt[0], NUM_FRACTION_DIGITS) + ' ' +
|
||||
toFixed(-vpt[5] / vpt[3], NUM_FRACTION_DIGITS) + ' ' +
|
||||
toFixed(this.width / vpt[0], NUM_FRACTION_DIGITS) + ' ' +
|
||||
toFixed(this.height / vpt[3], NUM_FRACTION_DIGITS) + '" ';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1271,13 +1282,7 @@
|
|||
(this.backgroundColor && !this.backgroundColor.toLive
|
||||
? 'style="background-color: ' + this.backgroundColor + '" '
|
||||
: null),
|
||||
(options.viewBox
|
||||
? 'viewBox="' +
|
||||
options.viewBox.x + ' ' +
|
||||
options.viewBox.y + ' ' +
|
||||
options.viewBox.width + ' ' +
|
||||
options.viewBox.height + '" '
|
||||
: null),
|
||||
viewBox,
|
||||
'xml:space="preserve">\n',
|
||||
'<desc>Created with Fabric.js ', fabric.version, '</desc>\n',
|
||||
'<defs>',
|
||||
|
|
|
|||
|
|
@ -3,10 +3,10 @@
|
|||
// var emptyImageCanvasData = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfQAAAH0CAYAAADL1t+KAAAH7ElEQVR4nO3VMQ0AMAzAsPInvYHoMS2yEeTLHADge/M6AADYM3QACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIuMjH4b7osLFBAAAAAElFTkSuQmCC";
|
||||
|
||||
var CANVAS_SVG = '<?xml version="1.0" encoding="UTF-8" standalone="no" ?>\n<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\n'+
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="600" height="600" xml:space="preserve">\n<desc>Created with Fabric.js ' + fabric.version + '</desc>\n<defs></defs>\n</svg>';
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="600" height="600" viewBox="0 0 600 600" xml:space="preserve">\n<desc>Created with Fabric.js ' + fabric.version + '</desc>\n<defs></defs>\n</svg>';
|
||||
|
||||
var CANVAS_SVG_VIEWBOX = '<?xml version="1.0" encoding="UTF-8" standalone="no" ?>\n<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">\n'+
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="300" height="300" viewBox="100 100 300 300" xml:space="preserve">\n<desc>Created with Fabric.js ' + fabric.version + '</desc>\n<defs></defs>\n</svg>';
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="600" height="600" viewBox="100 100 300 300" xml:space="preserve">\n<desc>Created with Fabric.js ' + fabric.version + '</desc>\n<defs></defs>\n</svg>';
|
||||
|
||||
var PATH_JSON = '{"objects": [{"type": "path", "originX": "left", "originY": "top", "left": 268, "top": 266, "width": 51, "height": 49,'+
|
||||
' "fill": "rgb(0,0,0)", "stroke": null, "strokeWidth": 1, "scaleX": 1, "scaleY": 1, '+
|
||||
|
|
|
|||
|
|
@ -132,15 +132,17 @@
|
|||
ok(typeof shadow.toObject == 'function');
|
||||
|
||||
var object = shadow.toObject();
|
||||
equal(JSON.stringify(object), '{"color":"rgb(0,0,0)","blur":0,"offsetX":0,"offsetY":0}');
|
||||
equal(JSON.stringify(object), '{"color":"rgb(0,0,0)","blur":0,"offsetX":0,"offsetY":0,"affectStroke":false}');
|
||||
});
|
||||
|
||||
test('clone with affectStroke', function() {
|
||||
var shadow = new fabric.Shadow({affectStroke: true, blur: 5});
|
||||
ok(typeof shadow.toObject == 'function');
|
||||
var object = shadow.toObject(),
|
||||
shadow2 = new fabric.Shadow(object);
|
||||
deepEqual(shadow, shadow2);
|
||||
shadow2 = new fabric.Shadow(object),
|
||||
object2 = shadow2.toObject();
|
||||
equal(shadow.affectStroke, shadow2.affectStroke)
|
||||
deepEqual(object, object2);
|
||||
});
|
||||
|
||||
test('toObject without default value', function() {
|
||||
|
|
|
|||
Loading…
Reference in a new issue