scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-07 13:22:07 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix issue with path clipping.

Browse source
This commit is contained in:
Jürg Lehni 2013-03-01 15:30:57 -08:00
parent 5bbbaef618
commit 1cd4d278fc
1 changed files with 29 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
src/svg/SvgImport.js
View file

@ -69,41 +69,47 @@ new function() {
function importGroup(node, type) { function importGroup(node, type) {
var nodes = node.childNodes, var nodes = node.childNodes,
clip = type === 'clipPath', clip = type === 'clipPath',
group = clip ? new CompoundPath() : new Group(), item = clip ? new CompoundPath() : new Group(),
project = group._project, project = item._project,
currentStyle = project._currentStyle; currentStyle = project._currentStyle;
// Style on groups needs to be handled differently than all other items: // Style on items needs to be handled differently than all other items:
// We first apply the style to the group, then use it as the project's // We first apply the style to the item, then use it as the project's
// currentStyle, so it is used as a default for the creation of all // currentStyle, so it is used as a default for the creation of all
// nested items. importSvg then needs to check for groups and avoid // nested items. importSvg then needs to check for items and avoid
// calling applyAttributes() again. // calling applyAttributes() again.
// Set the default color to black, since that's how SVG handles fills. // Set the default color to black, since that's how SVG handles fills.
group.setFillColor('black'); item.setFillColor('black');
applyAttributes(group, node); if (!clip) {
project._currentStyle = group._style.clone(); item = applyAttributes(item, node);
project._currentStyle = item._style.clone();
}
for (var i = 0, l = nodes.length; i < l; i++) { for (var i = 0, l = nodes.length; i < l; i++) {
var child = nodes[i], var childNode = nodes[i],
item; child;
if (child.nodeType == 1 && (item = importSvg(child))) { if (childNode.nodeType == 1 && (child = importSvg(childNode))) {
// If adding CompoundPaths to other CompoundPaths, // If adding CompoundPaths to other CompoundPaths,
// we need to "unbox" them first: // we need to "unbox" them first:
if (clip && item instanceof CompoundPath) { if (clip && child instanceof CompoundPath) {
group.addChildren(item.removeChildren()); item.addChildren(child.removeChildren());
item.remove(); child.remove();
} else if (!(item instanceof Symbol)) { } else if (!(child instanceof Symbol)) {
group.addChild(item); item.addChild(child);
} }
} }
} }
// clip paths are reduced (unboxed) and their attributes applied at the
// end.
if (clip)
item = applyAttributes(item.reduce(), node);
// Restore currentStyle // Restore currentStyle
project._currentStyle = currentStyle; project._currentStyle = currentStyle;
if (/^(defs|clipPath)$/.test(type)) { if (clip || type === 'defs') {
// I don't think we need to add defs to the DOM. But we might want // We don't want the defs in the DOM. But we might want to use
// to use Symbols for them? // Symbols for them to save memory?
group.remove(); item.remove();
group = null; item = null;
} }
return group; return item;
} }
function importPoly(node, type) { function importPoly(node, type) {
@ -315,9 +321,8 @@ new function() {
// http://www.w3.org/TR/SVG/masking.html#ClipPathProperty // http://www.w3.org/TR/SVG/masking.html#ClipPathProperty
var clip = getDefinition(value); var clip = getDefinition(value);
if (clip) { if (clip) {
clip = clip.clone().reduce(); clip = clip.clone();
clip.setClipMask(true); clip.setClipMask(true);
clip.remove();
return new Group(clip, item); return new Group(clip, item);
} }
}, },