mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2024-12-28 17:02:24 -05:00
Have SVGImport respect the current PaperScope's applyMatrix setting.
This commit is contained in:
parent
54d959df1f
commit
3c31c0e482
5 changed files with 32 additions and 24 deletions
|
@ -11,7 +11,7 @@
|
|||
svg.visible = true; // Turn off display: none;
|
||||
|
||||
// Resize the tiger to fit within the window:
|
||||
project.activeLayer.fitBounds(view.bounds);
|
||||
svg.fitBounds(view.bounds);
|
||||
|
||||
var items = project.activeLayer.firstChild.children;
|
||||
var mouseIsDown = false;
|
||||
|
|
|
@ -6,22 +6,19 @@
|
|||
<link rel="stylesheet" href="../css/style.css">
|
||||
<script type="text/javascript" src="../../dist/paper-full.js"></script>
|
||||
<script type="text/paperscript" canvas="canvas">
|
||||
// Imported SVG Groups have their applyMatrix flag turned off by
|
||||
// default. This is required for SVG importing to work correctly. Turn
|
||||
// it on now, so we don't have to deal with nested coordinate spaces.
|
||||
var words = project.importSVG(document.getElementById('svg'));
|
||||
words.visible = true; // Turn off the effect of display:none;
|
||||
words.fillColor = null;
|
||||
words.strokeColor = 'black';
|
||||
|
||||
var yesGroup = words.children.yes;
|
||||
var noGroup = words.children.no;
|
||||
// Imported SVG Groups have their applyMatrix flag turned off by
|
||||
// default. This is required for SVG importing to work correctly. Turn
|
||||
// it on now, so we don't have to deal with nested coordinate spaces.
|
||||
yesGroup.applyMatrix = true;
|
||||
noGroup.applyMatrix = true;
|
||||
|
||||
var noGroup = words.children.no;
|
||||
// Resize the words to fit snugly inside the view:
|
||||
project.activeLayer.fitBounds(view.bounds);
|
||||
project.activeLayer.scale(0.8);
|
||||
words.fitBounds(view.bounds);
|
||||
words.scale(0.8);
|
||||
|
||||
yesGroup.position = view.center;
|
||||
noGroup.position = [-900, -900];
|
||||
|
|
|
@ -102,7 +102,7 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
_changed: function() {
|
||||
var owner = this._owner;
|
||||
if (owner) {
|
||||
// If owner has #applyMatrix set, directly bake it in now.
|
||||
// If owner has #applyMatrix set, directly bake the change in now.
|
||||
if (owner._applyMatrix) {
|
||||
owner.transform(null, true);
|
||||
} else {
|
||||
|
@ -156,16 +156,17 @@ var Matrix = Base.extend(/** @lends Matrix# */{
|
|||
},
|
||||
|
||||
/**
|
||||
* Applies the matrix to the content of item that it belongs to, if
|
||||
* possible, meaning it bakes it into the item's content or children.
|
||||
* Attempts to apply the matrix to the content of item that it belongs to,
|
||||
* meaning its transformation is baked into the item's content or children.
|
||||
* @param {Boolean} recursively controls whether to apply transformations
|
||||
* recursively on children
|
||||
* @return {Boolean} {@true if the matrix was applied}
|
||||
*/
|
||||
apply: function(recursively) {
|
||||
apply: function(recursively, _setApplyMatrix) {
|
||||
var owner = this._owner;
|
||||
if (owner) {
|
||||
owner.transform(null, true, Base.pick(recursively, true));
|
||||
owner.transform(null, true, Base.pick(recursively, true),
|
||||
_setApplyMatrix);
|
||||
// If the matrix was successfully applied, it will be reset now.
|
||||
return this.isIdentity();
|
||||
}
|
||||
|
|
|
@ -3021,11 +3021,12 @@ var Item = Base.extend(Emitter, /** @lends Item# */{
|
|||
*
|
||||
* @param {Matrix} matrix the matrix by which the item shall be transformed.
|
||||
*/
|
||||
// Remove this for now:
|
||||
// TODO: Implement flags:
|
||||
// @param {String[]} flags Array of any of the following: 'objects',
|
||||
// 'children', 'fill-gradients', 'fill-patterns', 'stroke-patterns',
|
||||
// 'lines'. Default: ['objects', 'children']
|
||||
transform: function(matrix, _applyMatrix, _applyRecursively) {
|
||||
transform: function(matrix, _applyMatrix, _applyRecursively,
|
||||
_setApplyMatrix) {
|
||||
// If no matrix is provided, or the matrix is the identity, we might
|
||||
// still have some work to do in case _applyMatrix is true
|
||||
if (matrix && matrix.isIdentity())
|
||||
|
@ -3048,8 +3049,8 @@ var Item = Base.extend(Emitter, /** @lends Item# */{
|
|||
// internal _matrix transformations to the item's content.
|
||||
// Application is not possible on Raster, PointText, PlacedSymbol, since
|
||||
// the matrix is where the actual transformation state is stored.
|
||||
if (applyMatrix = applyMatrix
|
||||
&& this._transformContent(_matrix, _applyRecursively)) {
|
||||
if (applyMatrix = applyMatrix && this._transformContent(_matrix,
|
||||
_applyRecursively, _setApplyMatrix)) {
|
||||
// When the _matrix could be applied, we also need to transform
|
||||
// color styles (only gradients so far) and pivot point:
|
||||
var pivot = this._pivot,
|
||||
|
@ -3067,6 +3068,9 @@ var Item = Base.extend(Emitter, /** @lends Item# */{
|
|||
// Reset the internal matrix to the identity transformation if it
|
||||
// was possible to apply it.
|
||||
_matrix.reset(true);
|
||||
// Set the internal _applyMatrix flag to true if we're told to do so
|
||||
if (_setApplyMatrix && this._canApplyMatrix)
|
||||
this._applyMatrix = true;
|
||||
}
|
||||
// Calling _changed will clear _bounds and _position, but depending
|
||||
// on matrix we can calculate and set them again, so preserve them.
|
||||
|
@ -3105,11 +3109,12 @@ var Item = Base.extend(Emitter, /** @lends Item# */{
|
|||
return this;
|
||||
},
|
||||
|
||||
_transformContent: function(matrix, applyRecursively) {
|
||||
_transformContent: function(matrix, applyRecursively, setApplyMatrix) {
|
||||
var children = this._children;
|
||||
if (children) {
|
||||
for (var i = 0, l = children.length; i < l; i++)
|
||||
children[i].transform(matrix, true, applyRecursively);
|
||||
children[i].transform(matrix, true, applyRecursively,
|
||||
setApplyMatrix);
|
||||
return true;
|
||||
}
|
||||
},
|
||||
|
|
|
@ -587,13 +587,13 @@ new function() {
|
|||
item,
|
||||
data = node.getAttribute && node.getAttribute('data-paper-data'),
|
||||
settings = scope.settings,
|
||||
prevApplyMatrix = settings.applyMatrix;
|
||||
applyMatrix = settings.applyMatrix;
|
||||
// Have items imported from SVG not bake in all transformations to their
|
||||
// content and children, as this is how SVG works too, but preserve the
|
||||
// current setting so we can restore it after.
|
||||
settings.applyMatrix = false;
|
||||
item = importer && importer(node, type, options, isRoot) || null;
|
||||
settings.applyMatrix = prevApplyMatrix;
|
||||
settings.applyMatrix = applyMatrix;
|
||||
if (item) {
|
||||
// Do not apply attributes if this is a #document node.
|
||||
// See importGroup() for an explanation of filtering for Group:
|
||||
|
@ -612,8 +612,13 @@ new function() {
|
|||
item._data = JSON.parse(data);
|
||||
}
|
||||
// Clear definitions at the end of import?
|
||||
if (isRoot)
|
||||
if (isRoot) {
|
||||
definitions = {};
|
||||
// Now if settings.applyMatrix was set, apply recursively and set
|
||||
// #applyMatrix = true on the item and all children.
|
||||
if (applyMatrix && item)
|
||||
item.matrix.apply(true, true);
|
||||
}
|
||||
return item;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in a new issue