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

Some free drawing refactoring

Browse source
This commit is contained in:
kangax 2013-02-03 02:13:02 +01:00
parent 6777c50012
commit 5f8bff50a7
1 changed files with 21 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
src/freedrawing.class.js
View file

@ -197,6 +197,20 @@
return path;
},
/**
* Creates fabric.Path object to add on canvas
* @method createPath
* @param {String} pathData Path data
* @return {fabric.Path} path to add on canvas
*/
createPath: function(pathData) {
var path = new fabric.Path(pathData);
path.fill = null;
path.stroke = this.color;
path.strokeWidth = this.width;
return path;
},
/**
* On mouseup after drawing the path on contextTop canvas
* we use the points captured to create an new fabric path object
@ -208,10 +222,9 @@
this.canvas._isCurrentlyDrawing = false;
var ctx = this.canvas.contextTop;
ctx.closePath();
var path = this._getSVGPathData();
path = path.join('');
if (path === "M 0 0 Q 0 0 0 0 L 0 0") {
var pathData = this._getSVGPathData().join('');
if (pathData === "M 0 0 Q 0 0 0 0 L 0 0") {
// do not create 0 width/height paths, as they are
// rendered inconsistently across browsers
// Firefox 4, for example, renders a dot,
@ -220,28 +233,23 @@
return;
}
var p = new fabric.Path(path);
p.fill = null;
p.stroke = this.canvas.freeDrawingColor;
p.strokeWidth = this.canvas.freeDrawingLineWidth;
this.canvas.add(p);
// set path origin coordinates based on our bounding box
var originLeft = this.box.minx + (this.box.maxx - this.box.minx) /2;
var originTop = this.box.miny + (this.box.maxy - this.box.miny) /2;
this.canvas.contextTop.arc(originLeft, originTop, 3, 0, Math.PI * 2, false);
p.set({ left: originLeft, top: originTop });
var path = this.createPath(pathData);
path.set({ left: originLeft, top: originTop });
// does not change position
p.setCoords();
this.canvas.add(path);
path.setCoords();
this.canvas.contextTop && this.canvas.clearContext(this.canvas.contextTop);
this.canvas.renderAll();
// fire event 'path' created
this.canvas.fire('path:created', { path: p });
this.canvas.fire('path:created', { path: path });
}
});