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

[BACK_INCOMPAT] Remove "memo" from event objects. e.memo.xxx is now e.xxx.

Browse source
This commit is contained in:
kangax 2012-05-12 13:44:26 +04:00
parent cba1d4ca21
commit 8a84affd6c
8 changed files with 98 additions and 98 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
HEADER.js
View file

@ -1,6 +1,6 @@
/*! Fabric.js Copyright 2008-2012, Bitsonnet (Juriy Zaytsev, Maxim Chernyak) */
var fabric = fabric || { version: "0.8.2" };
var fabric = fabric || { version: "0.8.3" };
if (typeof exports != 'undefined') {
exports.fabric = fabric;

16
dist/all.js vendored
View file

@ -1,6 +1,6 @@
/*! Fabric.js Copyright 2008-2012, Bitsonnet (Juriy Zaytsev, Maxim Chernyak) */
var fabric = fabric || { version: "0.8.2" };
var fabric = fabric || { version: "0.8.3" };
if (typeof exports != 'undefined') {
exports.fabric = fabric;
@ -1734,7 +1734,7 @@ if (typeof console !== 'undefined') {
* @namespace
*/
fabric.Observable = {
/**
* Observes specified event
* @method observe
@ -1758,7 +1758,7 @@ fabric.Observable = {
this.__eventListeners[eventName].push(handler);
}
},
/**
* Stops event observing for a particular event handler
* @method stopObserving
@ -1773,14 +1773,14 @@ fabric.Observable = {
fabric.util.removeFromArray(this.__eventListeners[eventName], handler);
}
},
/**
* Fires event with an optional memo object
* Fires event with an optional options object
* @method fire
* @param {String} eventName
* @param {Object} [memo]
* @param {Object} [options]
*/
fire: function(eventName, memo) {
fire: function(eventName, options) {
if (!this.__eventListeners) {
this.__eventListeners = { }
}
@ -1788,7 +1788,7 @@ fabric.Observable = {
if (!listenersForEvent) return;
for (var i = 0, len = listenersForEvent.length; i < len; i++) {
// avoiding try/catch for perf. reasons
listenersForEvent[i]({ memo: memo });
listenersForEvent[i](options || { });
}
}
};

4
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.

130
lib/aligning_guidelines.js
View file

@ -4,30 +4,30 @@
*
*/
function initAligningGuidelines(canvas) {
var ctx = canvas.getContext(),
canvasHeight = canvas.getHeight(),
aligningLineOffset = 5,
aligningLineMargin = 4,
aligningLineWidth = 1,
aligningLineColor = 'rgb(0,255,0)';
function drawVerticalLine(coords) {
drawLine(
coords.x + 0.5,
coords.y1 > coords.y2 ? coords.y2 : coords.y1,
coords.x + 0.5,
coords.x + 0.5,
coords.y1 > coords.y2 ? coords.y2 : coords.y1,
coords.x + 0.5,
coords.y2 > coords.y1 ? coords.y2 : coords.y1);
}
function drawHorizontalLine(coords) {
drawLine(
coords.x1 > coords.x2 ? coords.x2 : coords.x1,
coords.y + 0.5,
coords.x2 > coords.x1 ? coords.x2 : coords.x1,
coords.x1 > coords.x2 ? coords.x2 : coords.x1,
coords.y + 0.5,
coords.x2 > coords.x1 ? coords.x2 : coords.x1,
coords.y + 0.5);
}
function drawLine(x1, y1, x2, y2) {
ctx.save();
ctx.lineWidth = aligningLineWidth;
@ -38,7 +38,7 @@ function initAligningGuidelines(canvas) {
ctx.stroke();
ctx.restore();
}
function isInRange(value1, value2) {
value1 = Math.round(value1);
value2 = Math.round(value2);
@ -49,128 +49,128 @@ function initAligningGuidelines(canvas) {
}
return false;
}
var verticalLines = [ ],
horizontalLines = [ ];
canvas.observe('object:moving', function(e) {
var activeObject = e.memo.target,
var activeObject = e.target,
canvasObjects = canvas.getObjects(),
activeObjectLeft = activeObject.get('left'),
activeObjectTop = activeObject.get('top'),
activeObjectHeight = activeObject.getHeight(),
activeObjectWidth = activeObject.getWidth(),
noneInTheRange = true;
// It should be trivial to DRY this up by encapsulating (repeating) creation of x1, x2, y1, and y2 into functions,
// but we're not doing it here for perf. reasons -- as this a function that's invoked on every mouse move
for (var i = canvasObjects.length; i--; ) {
if (canvasObjects[i] === activeObject) continue;
var objectLeft = canvasObjects[i].get('left'),
objectTop = canvasObjects[i].get('top'),
objectHeight = canvasObjects[i].getHeight(),
objectWidth = canvasObjects[i].getWidth();
// snap by the horizontal center line
if (isInRange(objectLeft, activeObjectLeft)) {
noneInTheRange = false;
verticalLines.push({
x: objectLeft,
y1: (objectTop < activeObjectTop)
? (objectTop - objectHeight / 2 - aligningLineOffset)
: (objectTop + objectHeight / 2 + aligningLineOffset),
y2: (activeObjectTop > objectTop)
? (activeObjectTop + activeObjectHeight / 2 + aligningLineOffset)
: (activeObjectTop - activeObjectHeight / 2 - aligningLineOffset)
x: objectLeft,
y1: (objectTop < activeObjectTop)
? (objectTop - objectHeight / 2 - aligningLineOffset)
: (objectTop + objectHeight / 2 + aligningLineOffset),
y2: (activeObjectTop > objectTop)
? (activeObjectTop + activeObjectHeight / 2 + aligningLineOffset)
: (activeObjectTop - activeObjectHeight / 2 - aligningLineOffset)
});
activeObject.set('left', objectLeft);
}
// snap by the left edge
if (isInRange(objectLeft - objectWidth / 2, activeObjectLeft - activeObjectWidth / 2)) {
noneInTheRange = false;
verticalLines.push({
x: objectLeft - objectWidth / 2,
y1: (objectTop < activeObjectTop)
? (objectTop - objectHeight / 2 - aligningLineOffset)
: (objectTop + objectHeight / 2 + aligningLineOffset),
y2: (activeObjectTop > objectTop)
? (activeObjectTop + activeObjectHeight / 2 + aligningLineOffset)
: (activeObjectTop - activeObjectHeight / 2 - aligningLineOffset)
x: objectLeft - objectWidth / 2,
y1: (objectTop < activeObjectTop)
? (objectTop - objectHeight / 2 - aligningLineOffset)
: (objectTop + objectHeight / 2 + aligningLineOffset),
y2: (activeObjectTop > objectTop)
? (activeObjectTop + activeObjectHeight / 2 + aligningLineOffset)
: (activeObjectTop - activeObjectHeight / 2 - aligningLineOffset)
});
activeObject.set('left', objectLeft - objectWidth / 2 + activeObjectWidth / 2);
}
// snap by the right edge
if (isInRange(objectLeft + objectWidth / 2, activeObjectLeft + activeObjectWidth / 2)) {
noneInTheRange = false;
verticalLines.push({
x: objectLeft + objectWidth / 2,
y1: (objectTop < activeObjectTop)
? (objectTop - objectHeight / 2 - aligningLineOffset)
: (objectTop + objectHeight / 2 + aligningLineOffset),
y2: (activeObjectTop > objectTop)
? (activeObjectTop + activeObjectHeight / 2 + aligningLineOffset)
: (activeObjectTop - activeObjectHeight / 2 - aligningLineOffset)
y1: (objectTop < activeObjectTop)
? (objectTop - objectHeight / 2 - aligningLineOffset)
: (objectTop + objectHeight / 2 + aligningLineOffset),
y2: (activeObjectTop > objectTop)
? (activeObjectTop + activeObjectHeight / 2 + aligningLineOffset)
: (activeObjectTop - activeObjectHeight / 2 - aligningLineOffset)
});
activeObject.set('left', objectLeft + objectWidth / 2 - activeObjectWidth / 2);
}
// snap by the vertical center line
if (isInRange(objectTop, activeObjectTop)) {
noneInTheRange = false;
horizontalLines.push({
y: objectTop,
x1: (objectLeft < activeObjectLeft)
? (objectLeft - objectWidth / 2 - aligningLineOffset)
: (objectLeft + objectWidth / 2 + aligningLineOffset),
x2: (activeObjectLeft > objectLeft)
? (activeObjectLeft + activeObjectWidth / 2 + aligningLineOffset)
y: objectTop,
x1: (objectLeft < activeObjectLeft)
? (objectLeft - objectWidth / 2 - aligningLineOffset)
: (objectLeft + objectWidth / 2 + aligningLineOffset),
x2: (activeObjectLeft > objectLeft)
? (activeObjectLeft + activeObjectWidth / 2 + aligningLineOffset)
: (activeObjectLeft - activeObjectWidth / 2 - aligningLineOffset)
});
activeObject.set('top', objectTop);
}
// snap by the top edge
if (isInRange(objectTop - objectHeight / 2, activeObjectTop - activeObjectHeight / 2)) {
noneInTheRange = false;
horizontalLines.push({
y: objectTop - objectHeight / 2,
x1: (objectLeft < activeObjectLeft)
? (objectLeft - objectWidth / 2 - aligningLineOffset)
: (objectLeft + objectWidth / 2 + aligningLineOffset),
x2: (activeObjectLeft > objectLeft)
? (activeObjectLeft + activeObjectWidth / 2 + aligningLineOffset)
y: objectTop - objectHeight / 2,
x1: (objectLeft < activeObjectLeft)
? (objectLeft - objectWidth / 2 - aligningLineOffset)
: (objectLeft + objectWidth / 2 + aligningLineOffset),
x2: (activeObjectLeft > objectLeft)
? (activeObjectLeft + activeObjectWidth / 2 + aligningLineOffset)
: (activeObjectLeft - activeObjectWidth / 2 - aligningLineOffset)
});
activeObject.set('top', objectTop - objectHeight / 2 + activeObjectHeight / 2);
}
// snap by the bottom edge
if (isInRange(objectTop + objectHeight / 2, activeObjectTop + activeObjectHeight / 2)) {
noneInTheRange = false;
horizontalLines.push({
y: objectTop + objectHeight / 2,
x1: (objectLeft < activeObjectLeft)
? (objectLeft - objectWidth / 2 - aligningLineOffset)
: (objectLeft + objectWidth / 2 + aligningLineOffset),
x2: (activeObjectLeft > objectLeft)
? (activeObjectLeft + activeObjectWidth / 2 + aligningLineOffset)
x1: (objectLeft < activeObjectLeft)
? (objectLeft - objectWidth / 2 - aligningLineOffset)
: (objectLeft + objectWidth / 2 + aligningLineOffset),
x2: (activeObjectLeft > objectLeft)
? (activeObjectLeft + activeObjectWidth / 2 + aligningLineOffset)
: (activeObjectLeft - activeObjectWidth / 2 - aligningLineOffset)
});
activeObject.set('top', objectTop + objectHeight / 2 - activeObjectHeight / 2);
}
}
if (noneInTheRange) {
verticalLines.length = horizontalLines.length = 0;
}
});
canvas.observe('after:render', function() {
for (var i = verticalLines.length; i--; ) {
drawVerticalLine(verticalLines[i]);
@ -179,7 +179,7 @@ function initAligningGuidelines(canvas) {
drawHorizontalLine(horizontalLines[i]);
}
});
canvas.observe('mouse:up', function() {
verticalLines.length = horizontalLines.length = 0;
canvas.renderAll();

28
lib/centering_guidelines.js
View file

@ -1,11 +1,11 @@
/**
* Augments canvas by assigning to `onObjectMove` and `onAfterRender`.
* This kind of sucks because other code using those methods will stop functioning.
* Augments canvas by assigning to `onObjectMove` and `onAfterRender`.
* This kind of sucks because other code using those methods will stop functioning.
* Need to fix it by replacing callbacks with pub/sub kind of subscription model.
* (or maybe use existing fabric.util.fire/observe (if it won't be too slow))
*/
function initCenteringGuidelines(canvas) {
var canvasWidth = canvas.getWidth(),
canvasHeight = canvas.getHeight(),
canvasWidthCenter = canvasWidth / 2,
@ -16,22 +16,22 @@ function initCenteringGuidelines(canvas) {
centerLineColor = 'rgba(255,0,241,0.5)',
centerLineWidth = 1,
ctx = canvas.getContext();
for (var i = canvasWidthCenter - centerLineMargin, len = canvasWidthCenter + centerLineMargin; i <= len; i++) {
canvasWidthCenterMap[i] = true;
}
for (var i = canvasHeightCenter - centerLineMargin, len = canvasHeightCenter + centerLineMargin; i <= len; i++) {
canvasHeightCenterMap[i] = true;
}
function showVerticalCenterLine() {
showCenterLine(canvasWidthCenter + 0.5, 0, canvasWidthCenter + 0.5, canvasHeight);
}
function showHorizontalCenterLine() {
showCenterLine(0, canvasHeightCenter + 0.5, canvasWidth, canvasHeightCenter + 0.5);
}
function showCenterLine(x1, y1, x2, y2) {
ctx.save();
ctx.strokeStyle = centerLineColor;
@ -42,17 +42,17 @@ function initCenteringGuidelines(canvas) {
ctx.stroke();
ctx.restore();
}
var afterRenderActions = [ ],
isInVerticalCenter,
isInHorizontalCenter;
canvas.observe('object:moving', function(e) {
object = e.memo.target;
object = e.target;
isInVerticalCenter = object.get('left') in canvasWidthCenterMap,
isInHorizontalCenter = object.get('top') in canvasHeightCenterMap;
if (isInHorizontalCenter) {
object.set('top', canvasHeightCenter);
}
@ -60,7 +60,7 @@ function initCenteringGuidelines(canvas) {
object.set('left', canvasWidthCenter);
}
});
canvas.observe('after:render', function() {
if (isInVerticalCenter) {
showVerticalCenterLine();
@ -69,7 +69,7 @@ function initCenteringGuidelines(canvas) {
showHorizontalCenterLine();
}
});
canvas.observe('mouse:up', function() {
// clear these values, to stop drawing guidelines once mouse is up
isInVerticalCenter = isInHorizontalCenter = null;

2
package.json
View file

@ -1,7 +1,7 @@
{
"name": "fabric",
"description": "Object model for HTML5 canvas, and SVG-to-canvas parser. Backed by jsdom and node-canvas.",
"version": "0.8.2",
"version": "0.8.3",
"author": "Juriy Zaytsev <kangax@gmail.com>",
"keywords": ["canvas", "graphic", "graphics", "SVG", "node-canvas", "parser", "HTML5", "object model"],
"repository": "git://github.com/kangax/fabric.js",

14
src/observable.js
View file

@ -2,7 +2,7 @@
* @namespace
*/
fabric.Observable = {
/**
* Observes specified event
* @method observe
@ -26,7 +26,7 @@ fabric.Observable = {
this.__eventListeners[eventName].push(handler);
}
},
/**
* Stops event observing for a particular event handler
* @method stopObserving
@ -41,14 +41,14 @@ fabric.Observable = {
fabric.util.removeFromArray(this.__eventListeners[eventName], handler);
}
},
/**
* Fires event with an optional memo object
* Fires event with an optional options object
* @method fire
* @param {String} eventName
* @param {Object} [memo]
* @param {Object} [options]
*/
fire: function(eventName, memo) {
fire: function(eventName, options) {
if (!this.__eventListeners) {
this.__eventListeners = { }
}
@ -56,7 +56,7 @@ fabric.Observable = {
if (!listenersForEvent) return;
for (var i = 0, len = listenersForEvent.length; i < len; i++) {
// avoiding try/catch for perf. reasons
listenersForEvent[i]({ memo: memo });
listenersForEvent[i](options || { });
}
}
};