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

Dynamically generate accessors based on state properties — width, height, fill, opacity, scaleX, scaleY, etc. For example, rect.set('fill', 'red') can now be replaced with rect.setFill('red'), and rect.get('opacity') with rect.getOpacity().

Browse source
This commit is contained in:
kangax 2011-05-31 00:56:01 -04:00
parent d7fd8f0af3
commit 0a9d835b12
6 changed files with 87 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
dist/all.js vendored
View file

@ -1,6 +1,6 @@
/*! Fabric.js Copyright 2008-2011, Bitsonnet (Juriy Zaytsev, Maxim Chernyak) */
var fabric = fabric || { version: "0.2.7" };
var fabric = fabric || { version: "0.2.8" };
/**
* Wrapper around `console.log` (when available)
@ -5026,6 +5026,7 @@ fabric.util.animate = animate;
startTime = new Date();
if (this.clipTo) {
containerCanvas.save();
containerCanvas.beginPath();
this.clipTo(containerCanvas);
containerCanvas.clip();
@ -5041,6 +5042,10 @@ fabric.util.animate = animate;
}
}
if (this.clipTo) {
containerCanvas.restore();
}
if (activeGroup) {
this._draw(this.contextTop, activeGroup);
}
@ -7386,6 +7391,26 @@ fabric.util.animate = animate;
* @alias rotate -> setAngle
*/
fabric.Object.prototype.rotate = fabric.Object.prototype.setAngle;
var proto = fabric.Object.prototype;
for (var i = proto.stateProperties.length; i--; ) {
var propName = proto.stateProperties[i],
capitalizedPropName = propName.charAt(0).toUpperCase() + propName.slice(1),
setterName = 'set' + capitalizedPropName,
getterName = 'get' + capitalizedPropName;
if (!proto[getterName]) {
proto[getterName] = (function(property) {
return new Function('return this.get("' + property + '")');
})(propName);
}
if (!proto[setterName]) {
proto[setterName] = (function(property) {
return new Function('value', 'return this.set("' + property + '", value)');
})(propName);
}
}
})(this);
(function(global) {

4
dist/all.min.js vendored
View file

File diff suppressed because one or more lines are too long

2
fabric.js
View file

@ -1,6 +1,6 @@
/*! Fabric.js Copyright 2008-2011, Bitsonnet (Juriy Zaytsev, Maxim Chernyak) */
var fabric = fabric || { version: "0.2.7" };
var fabric = fabric || { version: "0.2.8" };
/**
* Wrapper around `console.log` (when available)

21
src/object.class.js
View file

@ -1239,4 +1239,25 @@
* @alias rotate -> setAngle
*/
fabric.Object.prototype.rotate = fabric.Object.prototype.setAngle;
var proto = fabric.Object.prototype;
for (var i = proto.stateProperties.length; i--; ) {
var propName = proto.stateProperties[i],
capitalizedPropName = propName.charAt(0).toUpperCase() + propName.slice(1),
setterName = 'set' + capitalizedPropName,
getterName = 'get' + capitalizedPropName;
// using `new Function` for better introspection
if (!proto[getterName]) {
proto[getterName] = (function(property) {
return new Function('return this.get("' + property + '")');
})(propName);
}
if (!proto[setterName]) {
proto[setterName] = (function(property) {
return new Function('value', 'return this.set("' + property + '", value)');
})(propName);
}
}
})(this);

27
test/demo/demo.js
View file

@ -94,14 +94,24 @@
case 'image1':
fabric.Image.fromURL('assets/pug.jpg', function(image) {
image.set('left', left).set('top', top).set('angle', angle).scale(getRandomNum(0.1, 0.25)).setCoords();
image.set({
left: left,
top: top,
angle: angle
});
image.scale(getRandomNum(0.1, 0.25)).setCoords();
canvas.add(image);
});
break;
case 'image2':
fabric.Image.fromURL('assets/logo.png', function(image) {
image.set('left', left).set('top', top).set('angle', angle).scale(getRandomNum(0.1, 1)).setCoords();
image.set({
left: left,
top: top,
angle: angle
});
image.scale(getRandomNum(0.1, 1)).setCoords();
canvas.add(image);
updateComplexity();
});
@ -120,13 +130,12 @@
loadedObject = objects[0];
}
loadedObject
.set('left', left)
.set('top', top)
.set('angle', angle)
//.set('fill', '#' + getRandomColor())
.scaleToWidth(300)
.setCoords();
loadedObject.set({
left: left,
top: top,
angle: angle
});
loadedObject.scaleToWidth(300).setCoords();
canvas.add(loadedObject);
updateComplexity();

19
test/unit/object.js
View file

@ -70,6 +70,25 @@
equals(88, cObj.get('height'));
});
test('Dinamically generated accessors', function() {
var cObj = new fabric.Object({ });
equals('function', typeof cObj.getWidth);
equals('function', typeof cObj.setWidth);
equals('function', typeof cObj.getFill);
equals('function', typeof cObj.setFill);
equals(cObj, cObj.setFill('red'), 'chainable');
equals('red', cObj.getFill());
cObj.setScaleX(2.3);
equals(2.3, cObj.getScaleX());
cObj.setOpacity(0.123)
equals(0.123, cObj.getOpacity());
});
test('setSourcePath', function() {
var cObj = new fabric.Object();
var SRC_PATH = 'http://example.com/';