mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2025-01-06 04:42:15 -05:00
Merge remote-tracking branch 'origin/master'
This commit is contained in:
commit
9f1172f24a
8 changed files with 253 additions and 11 deletions
|
@ -33,8 +33,9 @@ var Item = this.Item = Base.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
_clone: function(copy) {
|
_clone: function(copy) {
|
||||||
// Copy over style
|
// If this item has a pathStyle, copy it:
|
||||||
copy.setStyle(this._style);
|
if (this._style)
|
||||||
|
copy.setStyle(this._style);
|
||||||
// If this item has children, clone and append each of them:
|
// If this item has children, clone and append each of them:
|
||||||
if (this._children) {
|
if (this._children) {
|
||||||
for (var i = 0, l = this._children.length; i < l; i++)
|
for (var i = 0, l = this._children.length; i < l; i++)
|
||||||
|
|
|
@ -28,7 +28,7 @@ var PlacedSymbol = this.PlacedSymbol = Item.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
clone: function() {
|
clone: function() {
|
||||||
return this._clone(new PlacedSymbol(symbol, this.matrix.clone()));
|
return this._clone(new PlacedSymbol(this.symbol, this.matrix.clone()));
|
||||||
},
|
},
|
||||||
|
|
||||||
_transform: function(matrix, flags) {
|
_transform: function(matrix, flags) {
|
||||||
|
|
|
@ -97,6 +97,7 @@ if (window.tests) {
|
||||||
'test/tests/Color.js',
|
'test/tests/Color.js',
|
||||||
'test/tests/Project.js',
|
'test/tests/Project.js',
|
||||||
'test/tests/Item.js',
|
'test/tests/Item.js',
|
||||||
|
'test/tests/Item_Cloning.js',
|
||||||
'test/tests/Layer.js',
|
'test/tests/Layer.js',
|
||||||
'test/tests/Group.js',
|
'test/tests/Group.js',
|
||||||
'test/tests/Segment.js',
|
'test/tests/Segment.js',
|
||||||
|
|
|
@ -23,7 +23,7 @@ var ParagraphStyle = this.ParagraphStyle = Base.extend({
|
||||||
|
|
||||||
statics: {
|
statics: {
|
||||||
create: function(item) {
|
create: function(item) {
|
||||||
var style = new CharacterStyle(CharacterStyle.dont);
|
var style = new ParagraphStyle(ParagraphStyle.dont);
|
||||||
style._item = item;
|
style._item = item;
|
||||||
return style;
|
return style;
|
||||||
}
|
}
|
||||||
|
|
|
@ -21,18 +21,15 @@ var PointText = this.PointText = TextItem.extend({
|
||||||
this.base();
|
this.base();
|
||||||
var point = Point.read(arguments);
|
var point = Point.read(arguments);
|
||||||
this.content = '';
|
this.content = '';
|
||||||
// TODO: Since we're exposing matrix, we actually need to extract _point
|
|
||||||
// from it each time getPoint is called, as it could be modified other
|
|
||||||
// than through PointText#transform().
|
|
||||||
this._point = LinkedPoint.create(this, 'setPoint', point.x, point.y);
|
this._point = LinkedPoint.create(this, 'setPoint', point.x, point.y);
|
||||||
this.matrix = new Matrix().translate(point);
|
this._matrix = new Matrix().translate(point);
|
||||||
},
|
},
|
||||||
|
|
||||||
clone: function() {
|
clone: function() {
|
||||||
var copy = this._clone(new PointText(this._point));
|
var copy = this._clone(new PointText(this._point));
|
||||||
copy.content = this.content;
|
copy.content = this.content;
|
||||||
// Use Matrix#initialize to easily copy over values.
|
// Use Matrix#initialize to easily copy over values.
|
||||||
copy.matrix.initialize(this.matrix);
|
copy._matrix.initialize(this._matrix);
|
||||||
return copy;
|
return copy;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -56,7 +53,7 @@ var PointText = this.PointText = TextItem.extend({
|
||||||
},
|
},
|
||||||
|
|
||||||
_transform: function(matrix, flags) {
|
_transform: function(matrix, flags) {
|
||||||
this.matrix.preConcatenate(matrix);
|
this._matrix.preConcatenate(matrix);
|
||||||
// We need to transform the LinkedPoint, passing true for dontNotify so
|
// We need to transform the LinkedPoint, passing true for dontNotify so
|
||||||
// chaning it won't trigger calls of setPoint(), leading to an endless
|
// chaning it won't trigger calls of setPoint(), leading to an endless
|
||||||
// recursion.
|
// recursion.
|
||||||
|
@ -70,7 +67,7 @@ var PointText = this.PointText = TextItem.extend({
|
||||||
ctx.font = this._characterStyle.fontSize + 'pt ' +
|
ctx.font = this._characterStyle.fontSize + 'pt ' +
|
||||||
this._characterStyle.font;
|
this._characterStyle.font;
|
||||||
ctx.textAlign = this._paragraphStyle.justification;
|
ctx.textAlign = this._paragraphStyle.justification;
|
||||||
this.matrix.applyToContext(ctx);
|
this._matrix.applyToContext(ctx);
|
||||||
|
|
||||||
var fillColor = this.getFillColor();
|
var fillColor = this.getFillColor();
|
||||||
var strokeColor = this.getStrokeColor();
|
var strokeColor = this.getStrokeColor();
|
||||||
|
|
|
@ -26,6 +26,12 @@ var TextItem = this.TextItem = Item.extend({
|
||||||
this.setParagraphStyle();
|
this.setParagraphStyle();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
_clone: function(copy) {
|
||||||
|
copy.setCharacterStyle(this._characterStyle);
|
||||||
|
copy.setParagraphStyle(this._paragraphStyle);
|
||||||
|
return this.base(copy);
|
||||||
|
},
|
||||||
|
|
||||||
getCharacterStyle: function() {
|
getCharacterStyle: function() {
|
||||||
return this._characterStyle;
|
return this._characterStyle;
|
||||||
},
|
},
|
||||||
|
|
|
@ -87,3 +87,145 @@ function compareGrayColors(color1, color2, message) {
|
||||||
compareNumbers(color1.gray, color2.gray,
|
compareNumbers(color1.gray, color2.gray,
|
||||||
(message || '') + ' gray');
|
(message || '') + ' gray');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function cloneAndCompare(item) {
|
||||||
|
var copy = item.clone();
|
||||||
|
compareItems(item, copy);
|
||||||
|
// Remove the cloned item to restore the document:
|
||||||
|
copy.remove();
|
||||||
|
}
|
||||||
|
|
||||||
|
function compareItems(item, item2) {
|
||||||
|
equals(function() {
|
||||||
|
return item != item2;
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
var itemProperties = ['opacity', 'locked', 'visible', 'blendMode', 'name',
|
||||||
|
'closed', 'selected'];
|
||||||
|
Base.each(itemProperties, function(key) {
|
||||||
|
equals(function() {
|
||||||
|
return item[key] == item2[key];
|
||||||
|
}, true, 'item[\'' + key + '\'] == item2[\'' + key + '\']');
|
||||||
|
});
|
||||||
|
|
||||||
|
equals(function() {
|
||||||
|
return item.id != item2.id;
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
if (item._matrix) {
|
||||||
|
equals(function() {
|
||||||
|
return item._matrix != item2._matrix;
|
||||||
|
}, true);
|
||||||
|
equals(item._matrix.toString(), item2._matrix.toString(),
|
||||||
|
'item._matrix.toString() == item2._matrix.toString()');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (item2.segments) {
|
||||||
|
equals(item.segments.toString(), item2.segments.toString(),
|
||||||
|
'item.segments.toString() == item2.segments.toString()');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Path specific
|
||||||
|
if (item instanceof PathItem) {
|
||||||
|
equals(function() {
|
||||||
|
return item._clockwise == item2._clockwise;
|
||||||
|
}, true);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Group specific
|
||||||
|
if (item instanceof Group) {
|
||||||
|
equals(function() {
|
||||||
|
return item._clipped == item2._clipped;
|
||||||
|
}, true);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Layer specific
|
||||||
|
if (item instanceof Layer) {
|
||||||
|
equals(function() {
|
||||||
|
return item.project == item2.project;
|
||||||
|
}, true);
|
||||||
|
}
|
||||||
|
|
||||||
|
// PlacedSymbol specific
|
||||||
|
if (item instanceof PlacedSymbol) {
|
||||||
|
equals(function() {
|
||||||
|
return item.symbol == item2.symbol;
|
||||||
|
}, true);
|
||||||
|
}
|
||||||
|
|
||||||
|
// TODO: Raster specific
|
||||||
|
|
||||||
|
// TextItem specific:
|
||||||
|
if (item instanceof TextItem) {
|
||||||
|
equals(item.content, item2.content, 'item.content == item2.content');
|
||||||
|
var characterStyleKeys = ['fontSize', 'font'];
|
||||||
|
Base.each(characterStyleKeys, function(key) {
|
||||||
|
equals(function() {
|
||||||
|
return item2.characterStyle[key];
|
||||||
|
}, item.characterStyle[key], 'item.characterStyle[\'' + key
|
||||||
|
+ '\'] == item2.characterStyle[\'' + key + '\']');
|
||||||
|
});
|
||||||
|
var paragraphStyleKeys = ['justification'];
|
||||||
|
Base.each(paragraphStyleKeys, function(key) {
|
||||||
|
equals(function() {
|
||||||
|
return item2.paragraphStyle[key];
|
||||||
|
}, item.paragraphStyle[key], 'item.paragraphStyle[\'' + key
|
||||||
|
+ '\'] == item2.paragraphStyle[\'' + key + '\']');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// PointText specific:
|
||||||
|
if (item instanceof PointText) {
|
||||||
|
equals(item.point.toString(), item2.point.toString());
|
||||||
|
}
|
||||||
|
|
||||||
|
if (item._style) {
|
||||||
|
// Path Style
|
||||||
|
if (item.fillColor) {
|
||||||
|
// The fillColor should not point to the same color object:
|
||||||
|
equals(function() {
|
||||||
|
return item.fillColor != item2.fillColor;
|
||||||
|
}, true, 'The fillColor should not point to the same color object:');
|
||||||
|
if (item.fillColor instanceof GradientColor) {
|
||||||
|
// TODO!
|
||||||
|
} else {
|
||||||
|
equals(item.fillColor.toString(), item2.fillColor.toString());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (item.strokeColor) {
|
||||||
|
equals(function() {
|
||||||
|
return item.strokeColor != item2.strokeColor;
|
||||||
|
}, true, 'The strokeColor should not point to the same color object:');
|
||||||
|
if (item.strokeColor instanceof GradientColor) {
|
||||||
|
// TODO
|
||||||
|
} else {
|
||||||
|
equals(item.strokeColor.toString(), item2.strokeColor.toString());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Base.each(['strokeCap', 'strokeJoin', 'dashOffset', 'miterLimit',
|
||||||
|
'strokeOverprint', 'fillOverprint'], function(key) {
|
||||||
|
if (item[key]) {
|
||||||
|
equals(function() {
|
||||||
|
return item[key] == item2[key];
|
||||||
|
}, true, 'item[\'' + key + '\'] == item2[\'' + key + '\']');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (item.dashArray) {
|
||||||
|
equals(item.dashArray.toString(), item2.dashArray.toString(),
|
||||||
|
'item.dashArray.toString(), item2.dashArray.toString()');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check length of children and recursively compare them:
|
||||||
|
if (item.children) {
|
||||||
|
equals(function() {
|
||||||
|
return item.children.length == item2.children.length;
|
||||||
|
}, true);
|
||||||
|
for (var i = 0, l = item.children.length; i < l; i++) {
|
||||||
|
compareItems(item.children[i], item2.children[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
95
test/tests/Item_Cloning.js
Normal file
95
test/tests/Item_Cloning.js
Normal file
|
@ -0,0 +1,95 @@
|
||||||
|
test('Path#clone()', function() {
|
||||||
|
var proj = paper.project;
|
||||||
|
var path = new Path([10, 20], [30, 40]);
|
||||||
|
path.closed = true;
|
||||||
|
path.name = 'test';
|
||||||
|
path.style = {
|
||||||
|
strokeCap: 'round',
|
||||||
|
strokeJoin: 'round',
|
||||||
|
dashOffset: 10,
|
||||||
|
dashArray: [10, 2, 10],
|
||||||
|
fillColor: new RGBColor(0, 0, 1),
|
||||||
|
strokeColor: new RGBColor(0, 0, 1),
|
||||||
|
miterLimit: 5
|
||||||
|
};
|
||||||
|
path.clockwise = false;
|
||||||
|
path.opacity = 0.5;
|
||||||
|
path.locked = true;
|
||||||
|
path.visible = false;
|
||||||
|
path.blendMode = 'blend';
|
||||||
|
path._clipMask = true;
|
||||||
|
path.selected = true;
|
||||||
|
cloneAndCompare(path);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('CompoundPath#clone()', function() {
|
||||||
|
var path1 = new Path.Rectangle([200, 200], [100, 100]);
|
||||||
|
var path2 = new Path.Rectangle([50, 50], [200, 200]);
|
||||||
|
var compound = new CompoundPath(path1, path2);
|
||||||
|
cloneAndCompare(compound);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('Layer#clone()', function() {
|
||||||
|
var path = new Path.Rectangle([200, 200], [100, 100]);
|
||||||
|
cloneAndCompare(paper.project.activeLayer);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('Group#clone()', function() {
|
||||||
|
var path = new Path.Circle([150, 150], 60);
|
||||||
|
path.style = {
|
||||||
|
strokeCap: 'round',
|
||||||
|
strokeJoin: 'round',
|
||||||
|
dashOffset: 10,
|
||||||
|
dashArray: [10, 2, 10],
|
||||||
|
fillColor: new RGBColor(0, 0, 1),
|
||||||
|
strokeColor: new RGBColor(0, 0, 1),
|
||||||
|
miterLimit: 5
|
||||||
|
};
|
||||||
|
var secondPath = new Path.Circle([175, 175], 85);
|
||||||
|
var group = new Group([path, secondPath]);
|
||||||
|
cloneAndCompare(group);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('PointText#clone()', function() {
|
||||||
|
var pointText = new PointText(new Point(50, 50));
|
||||||
|
pointText.content = 'test';
|
||||||
|
pointText.position += 100;
|
||||||
|
pointText.characterStyle = {
|
||||||
|
font: 'serif',
|
||||||
|
fontSize: 20
|
||||||
|
};
|
||||||
|
pointText.paragraphStyle.justification = 'center';
|
||||||
|
cloneAndCompare(pointText);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('PlacedSymbol#clone()', function() {
|
||||||
|
var path = new Path.Circle([150, 150], 60);
|
||||||
|
var symbol = new Symbol(path);
|
||||||
|
var placedSymbol = new PlacedSymbol(symbol);
|
||||||
|
placedSymbol.position = [100, 100];
|
||||||
|
placedSymbol.rotate(90);
|
||||||
|
cloneAndCompare(placedSymbol);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('Symbol#clone()', function() {
|
||||||
|
var path = new Path.Circle([150, 150], 60);
|
||||||
|
path.style = {
|
||||||
|
strokeCap: 'round',
|
||||||
|
strokeJoin: 'round',
|
||||||
|
dashOffset: 10,
|
||||||
|
dashArray: [10, 2, 10],
|
||||||
|
fillColor: new RGBColor(0, 0, 1),
|
||||||
|
strokeColor: new RGBColor(0, 0, 1),
|
||||||
|
miterLimit: 5
|
||||||
|
};
|
||||||
|
path.selected = true;
|
||||||
|
var symbol = new Symbol(path);
|
||||||
|
var copy = symbol.clone();
|
||||||
|
compareItems(symbol.definition, copy.definition);
|
||||||
|
equals(function() {
|
||||||
|
return symbol.project == copy.project;
|
||||||
|
}, true);
|
||||||
|
equals(function() {
|
||||||
|
return paper.project.symbols.length == 2;
|
||||||
|
}, true);
|
||||||
|
});
|
Loading…
Reference in a new issue