1 /* -*- Mode: C++; tab-width: 8; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
2 /* vim: set ts=8 sts=2 et sw=2 tw=80: */
3 /* This Source Code Form is subject to the terms of the Mozilla Public
4 * License, v. 2.0. If a copy of the MPL was not distributed with this
5 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
8 * A class used for intermediate representations of the -moz-transform property.
11 #include "nsStyleTransformMatrix.h"
12 #include "nsLayoutUtils.h"
13 #include "nsPresContext.h"
14 #include "mozilla/MotionPathUtils.h"
15 #include "mozilla/ServoBindings.h"
16 #include "mozilla/StyleAnimationValue.h"
17 #include "mozilla/SVGUtils.h"
18 #include "gfxMatrix.h"
19 #include "gfxQuaternion.h"
21 using namespace mozilla
;
22 using namespace mozilla::gfx
;
24 namespace nsStyleTransformMatrix
{
26 /* Note on floating point precision: The transform matrix is an array
27 * of single precision 'float's, and so are most of the input values
28 * we get from the style system, but intermediate calculations
29 * involving angles need to be done in 'double'.
32 // Define UNIFIED_CONTINUATIONS here and in nsDisplayList.cpp
33 // to have the transform property try
34 // to transform content with continuations as one unified block instead of
35 // several smaller ones. This is currently disabled because it doesn't work
36 // correctly, since when the frames are initially being reflowed, their
37 // continuations all compute their bounding rects independently of each other
38 // and consequently get the wrong value.
39 //#define UNIFIED_CONTINUATIONS
41 void TransformReferenceBox::EnsureDimensionsAreCached() {
50 if (mFrame
->HasAnyStateBits(NS_FRAME_SVG_LAYOUT
)) {
51 if (mFrame
->StyleDisplay()->mTransformBox
== StyleGeometryBox::FillBox
) {
52 // Percentages in transforms resolve against the SVG bbox, and the
53 // transform is relative to the top-left of the SVG bbox.
54 nsRect bboxInAppUnits
= nsLayoutUtils::ComputeGeometryBox(
55 const_cast<nsIFrame
*>(mFrame
), StyleGeometryBox::FillBox
);
56 // The mRect of an SVG nsIFrame is its user space bounds *including*
57 // stroke and markers, whereas bboxInAppUnits is its user space bounds
58 // including fill only. We need to note the offset of the reference box
59 // from the frame's mRect in mX/mY.
60 mX
= bboxInAppUnits
.x
- mFrame
->GetPosition().x
;
61 mY
= bboxInAppUnits
.y
- mFrame
->GetPosition().y
;
62 mWidth
= bboxInAppUnits
.width
;
63 mHeight
= bboxInAppUnits
.height
;
65 // The value 'border-box' is treated as 'view-box' for SVG content.
67 mFrame
->StyleDisplay()->mTransformBox
== StyleGeometryBox::ViewBox
||
68 mFrame
->StyleDisplay()->mTransformBox
==
69 StyleGeometryBox::BorderBox
,
70 "Unexpected value for 'transform-box'");
71 // Percentages in transforms resolve against the width/height of the
72 // nearest viewport (or its viewBox if one is applied), and the
73 // transform is relative to {0,0} in current user space.
74 mX
= -mFrame
->GetPosition().x
;
75 mY
= -mFrame
->GetPosition().y
;
76 Size contextSize
= SVGUtils::GetContextSize(mFrame
);
77 mWidth
= nsPresContext::CSSPixelsToAppUnits(contextSize
.width
);
78 mHeight
= nsPresContext::CSSPixelsToAppUnits(contextSize
.height
);
83 // If UNIFIED_CONTINUATIONS is not defined, this is simply the frame's
84 // bounding rectangle, translated to the origin. Otherwise, it is the
85 // smallest rectangle containing a frame and all of its continuations. For
86 // example, if there is a <span> element with several continuations split
87 // over several lines, this function will return the rectangle containing all
88 // of those continuations.
92 #ifndef UNIFIED_CONTINUATIONS
93 rect
= mFrame
->GetRect();
95 // Iterate the continuation list, unioning together the bounding rects:
96 for (const nsIFrame
* currFrame
= mFrame
->FirstContinuation();
97 currFrame
!= nullptr; currFrame
= currFrame
->GetNextContinuation()) {
98 // Get the frame rect in local coordinates, then translate back to the
99 // original coordinates:
101 result
, nsRect(currFrame
->GetOffsetTo(mFrame
), currFrame
->GetSize()));
107 mWidth
= rect
.Width();
108 mHeight
= rect
.Height();
111 void TransformReferenceBox::Init(const nsRect
& aDimensions
) {
112 MOZ_ASSERT(!mFrame
&& !mIsCached
);
116 mWidth
= aDimensions
.width
;
117 mHeight
= aDimensions
.height
;
121 float ProcessTranslatePart(
122 const LengthPercentage
& aValue
, TransformReferenceBox
* aRefBox
,
123 TransformReferenceBox::DimensionGetter aDimensionGetter
) {
124 return aValue
.ResolveToCSSPixelsWith([&] {
125 return aRefBox
&& !aRefBox
->IsEmpty()
126 ? CSSPixel::FromAppUnits((aRefBox
->*aDimensionGetter
)())
132 * Helper functions to process all the transformation function types.
134 * These take a matrix parameter to accumulate the current matrix.
137 /* Helper function to process a matrix entry. */
138 static void ProcessMatrix(Matrix4x4
& aMatrix
,
139 const StyleTransformOperation
& aOp
) {
140 const auto& matrix
= aOp
.AsMatrix();
143 result
._11
= matrix
.a
;
144 result
._12
= matrix
.b
;
145 result
._21
= matrix
.c
;
146 result
._22
= matrix
.d
;
147 result
._31
= matrix
.e
;
148 result
._32
= matrix
.f
;
150 aMatrix
= result
* aMatrix
;
153 static void ProcessMatrix3D(Matrix4x4
& aMatrix
,
154 const StyleTransformOperation
& aOp
) {
157 const auto& matrix
= aOp
.AsMatrix3D();
159 temp
._11
= matrix
.m11
;
160 temp
._12
= matrix
.m12
;
161 temp
._13
= matrix
.m13
;
162 temp
._14
= matrix
.m14
;
163 temp
._21
= matrix
.m21
;
164 temp
._22
= matrix
.m22
;
165 temp
._23
= matrix
.m23
;
166 temp
._24
= matrix
.m24
;
167 temp
._31
= matrix
.m31
;
168 temp
._32
= matrix
.m32
;
169 temp
._33
= matrix
.m33
;
170 temp
._34
= matrix
.m34
;
172 temp
._41
= matrix
.m41
;
173 temp
._42
= matrix
.m42
;
174 temp
._43
= matrix
.m43
;
175 temp
._44
= matrix
.m44
;
177 aMatrix
= temp
* aMatrix
;
180 // For accumulation for transform functions, |aOne| corresponds to |aB| and
181 // |aTwo| corresponds to |aA| for StyleAnimationValue::Accumulate().
184 template <typename T
>
185 static T
operate(const T
& aOne
, const T
& aTwo
, double aCoeff
) {
186 return aOne
+ aTwo
* aCoeff
;
189 static Point4D
operateForPerspective(const Point4D
& aOne
, const Point4D
& aTwo
,
191 return (aOne
- Point4D(0, 0, 0, 1)) +
192 (aTwo
- Point4D(0, 0, 0, 1)) * aCoeff
+ Point4D(0, 0, 0, 1);
194 static Point3D
operateForScale(const Point3D
& aOne
, const Point3D
& aTwo
,
196 // For scale, the identify element is 1, see AddTransformScale in
197 // StyleAnimationValue.cpp.
198 return (aOne
- Point3D(1, 1, 1)) + (aTwo
- Point3D(1, 1, 1)) * aCoeff
+
202 static Matrix4x4
operateForRotate(const gfxQuaternion
& aOne
,
203 const gfxQuaternion
& aTwo
, double aCoeff
) {
205 return aOne
.ToMatrix();
208 double theta
= acos(mozilla::clamped(aTwo
.w
, -1.0, 1.0));
209 double scale
= (theta
!= 0.0) ? 1.0 / sin(theta
) : 0.0;
213 gfxQuaternion result
= gfxQuaternion(scale
* aTwo
.x
, scale
* aTwo
.y
,
214 scale
* aTwo
.z
, cos(theta
)) *
216 return result
.ToMatrix();
219 static Matrix4x4
operateForFallback(const Matrix4x4
& aMatrix1
,
220 const Matrix4x4
& aMatrix2
,
225 static Matrix4x4
operateByServo(const Matrix4x4
& aMatrix1
,
226 const Matrix4x4
& aMatrix2
, double aCount
) {
228 Servo_MatrixTransform_Operate(MatrixTransformOperator::Accumulate
,
229 &aMatrix1
.components
, &aMatrix2
.components
,
230 aCount
, &result
.components
);
237 template <typename T
>
238 static T
operate(const T
& aOne
, const T
& aTwo
, double aCoeff
) {
239 return aOne
+ (aTwo
- aOne
) * aCoeff
;
242 static Point4D
operateForPerspective(const Point4D
& aOne
, const Point4D
& aTwo
,
244 return aOne
+ (aTwo
- aOne
) * aCoeff
;
247 static Point3D
operateForScale(const Point3D
& aOne
, const Point3D
& aTwo
,
249 return aOne
+ (aTwo
- aOne
) * aCoeff
;
252 static Matrix4x4
operateForRotate(const gfxQuaternion
& aOne
,
253 const gfxQuaternion
& aTwo
, double aCoeff
) {
254 return aOne
.Slerp(aTwo
, aCoeff
).ToMatrix();
257 static Matrix4x4
operateForFallback(const Matrix4x4
& aMatrix1
,
258 const Matrix4x4
& aMatrix2
,
260 return aProgress
< 0.5 ? aMatrix1
: aMatrix2
;
263 static Matrix4x4
operateByServo(const Matrix4x4
& aMatrix1
,
264 const Matrix4x4
& aMatrix2
, double aProgress
) {
266 Servo_MatrixTransform_Operate(MatrixTransformOperator::Interpolate
,
267 &aMatrix1
.components
, &aMatrix2
.components
,
268 aProgress
, &result
.components
);
273 template <typename Operator
>
274 static void ProcessMatrixOperator(Matrix4x4
& aMatrix
,
275 const StyleTransform
& aFrom
,
276 const StyleTransform
& aTo
, float aProgress
,
277 TransformReferenceBox
& aRefBox
) {
278 float appUnitPerCSSPixel
= AppUnitsPerCSSPixel();
279 Matrix4x4 matrix1
= ReadTransforms(aFrom
, aRefBox
, appUnitPerCSSPixel
);
280 Matrix4x4 matrix2
= ReadTransforms(aTo
, aRefBox
, appUnitPerCSSPixel
);
281 aMatrix
= Operator::operateByServo(matrix1
, matrix2
, aProgress
) * aMatrix
;
284 /* Helper function to process two matrices that we need to interpolate between
286 void ProcessInterpolateMatrix(Matrix4x4
& aMatrix
,
287 const StyleTransformOperation
& aOp
,
288 TransformReferenceBox
& aRefBox
) {
289 const auto& args
= aOp
.AsInterpolateMatrix();
290 ProcessMatrixOperator
<Interpolate
>(aMatrix
, args
.from_list
, args
.to_list
,
291 args
.progress
._0
, aRefBox
);
294 void ProcessAccumulateMatrix(Matrix4x4
& aMatrix
,
295 const StyleTransformOperation
& aOp
,
296 TransformReferenceBox
& aRefBox
) {
297 const auto& args
= aOp
.AsAccumulateMatrix();
298 ProcessMatrixOperator
<Accumulate
>(aMatrix
, args
.from_list
, args
.to_list
,
299 args
.count
, aRefBox
);
302 /* Helper function to process a translatex function. */
303 static void ProcessTranslateX(Matrix4x4
& aMatrix
,
304 const LengthPercentage
& aLength
,
305 TransformReferenceBox
& aRefBox
) {
308 ProcessTranslatePart(aLength
, &aRefBox
, &TransformReferenceBox::Width
);
309 aMatrix
.PreTranslate(temp
);
312 /* Helper function to process a translatey function. */
313 static void ProcessTranslateY(Matrix4x4
& aMatrix
,
314 const LengthPercentage
& aLength
,
315 TransformReferenceBox
& aRefBox
) {
318 ProcessTranslatePart(aLength
, &aRefBox
, &TransformReferenceBox::Height
);
319 aMatrix
.PreTranslate(temp
);
322 static void ProcessTranslateZ(Matrix4x4
& aMatrix
, const Length
& aLength
) {
324 temp
.z
= aLength
.ToCSSPixels();
325 aMatrix
.PreTranslate(temp
);
328 /* Helper function to process a translate function. */
329 static void ProcessTranslate(Matrix4x4
& aMatrix
, const LengthPercentage
& aX
,
330 const LengthPercentage
& aY
,
331 TransformReferenceBox
& aRefBox
) {
333 temp
.x
= ProcessTranslatePart(aX
, &aRefBox
, &TransformReferenceBox::Width
);
334 temp
.y
= ProcessTranslatePart(aY
, &aRefBox
, &TransformReferenceBox::Height
);
335 aMatrix
.PreTranslate(temp
);
338 static void ProcessTranslate3D(Matrix4x4
& aMatrix
, const LengthPercentage
& aX
,
339 const LengthPercentage
& aY
, const Length
& aZ
,
340 TransformReferenceBox
& aRefBox
) {
343 temp
.x
= ProcessTranslatePart(aX
, &aRefBox
, &TransformReferenceBox::Width
);
344 temp
.y
= ProcessTranslatePart(aY
, &aRefBox
, &TransformReferenceBox::Height
);
345 temp
.z
= aZ
.ToCSSPixels();
347 aMatrix
.PreTranslate(temp
);
350 /* Helper function to set up a scale matrix. */
351 static void ProcessScaleHelper(Matrix4x4
& aMatrix
, float aXScale
, float aYScale
,
353 aMatrix
.PreScale(aXScale
, aYScale
, aZScale
);
356 static void ProcessScale3D(Matrix4x4
& aMatrix
,
357 const StyleTransformOperation
& aOp
) {
358 const auto& scale
= aOp
.AsScale3D();
359 ProcessScaleHelper(aMatrix
, scale
._0
, scale
._1
, scale
._2
);
362 /* Helper function that, given a set of angles, constructs the appropriate
365 static void ProcessSkewHelper(Matrix4x4
& aMatrix
, const StyleAngle
& aXAngle
,
366 const StyleAngle
& aYAngle
) {
367 aMatrix
.SkewXY(aXAngle
.ToRadians(), aYAngle
.ToRadians());
370 static void ProcessRotate3D(Matrix4x4
& aMatrix
, float aX
, float aY
, float aZ
,
371 const StyleAngle
& aAngle
) {
373 temp
.SetRotateAxisAngle(aX
, aY
, aZ
, aAngle
.ToRadians());
374 aMatrix
= temp
* aMatrix
;
377 static void ProcessPerspective(Matrix4x4
& aMatrix
, const Length
& aLength
) {
378 float depth
= aLength
.ToCSSPixels();
379 ApplyPerspectiveToMatrix(aMatrix
, depth
);
382 static void MatrixForTransformFunction(Matrix4x4
& aMatrix
,
383 const StyleTransformOperation
& aOp
,
384 TransformReferenceBox
& aRefBox
) {
385 /* Get the keyword for the transform. */
387 case StyleTransformOperation::Tag::TranslateX
:
388 ProcessTranslateX(aMatrix
, aOp
.AsTranslateX(), aRefBox
);
390 case StyleTransformOperation::Tag::TranslateY
:
391 ProcessTranslateY(aMatrix
, aOp
.AsTranslateY(), aRefBox
);
393 case StyleTransformOperation::Tag::TranslateZ
:
394 ProcessTranslateZ(aMatrix
, aOp
.AsTranslateZ());
396 case StyleTransformOperation::Tag::Translate
:
397 ProcessTranslate(aMatrix
, aOp
.AsTranslate()._0
, aOp
.AsTranslate()._1
,
400 case StyleTransformOperation::Tag::Translate3D
:
401 return ProcessTranslate3D(aMatrix
, aOp
.AsTranslate3D()._0
,
402 aOp
.AsTranslate3D()._1
, aOp
.AsTranslate3D()._2
,
405 case StyleTransformOperation::Tag::ScaleX
:
406 ProcessScaleHelper(aMatrix
, aOp
.AsScaleX(), 1.0f
, 1.0f
);
408 case StyleTransformOperation::Tag::ScaleY
:
409 ProcessScaleHelper(aMatrix
, 1.0f
, aOp
.AsScaleY(), 1.0f
);
411 case StyleTransformOperation::Tag::ScaleZ
:
412 ProcessScaleHelper(aMatrix
, 1.0f
, 1.0f
, aOp
.AsScaleZ());
414 case StyleTransformOperation::Tag::Scale
:
415 ProcessScaleHelper(aMatrix
, aOp
.AsScale()._0
, aOp
.AsScale()._1
, 1.0f
);
417 case StyleTransformOperation::Tag::Scale3D
:
418 ProcessScale3D(aMatrix
, aOp
);
420 case StyleTransformOperation::Tag::SkewX
:
421 ProcessSkewHelper(aMatrix
, aOp
.AsSkewX(), StyleAngle::Zero());
423 case StyleTransformOperation::Tag::SkewY
:
424 ProcessSkewHelper(aMatrix
, StyleAngle::Zero(), aOp
.AsSkewY());
426 case StyleTransformOperation::Tag::Skew
:
427 ProcessSkewHelper(aMatrix
, aOp
.AsSkew()._0
, aOp
.AsSkew()._1
);
429 case StyleTransformOperation::Tag::RotateX
:
430 aMatrix
.RotateX(aOp
.AsRotateX().ToRadians());
432 case StyleTransformOperation::Tag::RotateY
:
433 aMatrix
.RotateY(aOp
.AsRotateY().ToRadians());
435 case StyleTransformOperation::Tag::RotateZ
:
436 aMatrix
.RotateZ(aOp
.AsRotateZ().ToRadians());
438 case StyleTransformOperation::Tag::Rotate
:
439 aMatrix
.RotateZ(aOp
.AsRotate().ToRadians());
441 case StyleTransformOperation::Tag::Rotate3D
:
442 ProcessRotate3D(aMatrix
, aOp
.AsRotate3D()._0
, aOp
.AsRotate3D()._1
,
443 aOp
.AsRotate3D()._2
, aOp
.AsRotate3D()._3
);
445 case StyleTransformOperation::Tag::Matrix
:
446 ProcessMatrix(aMatrix
, aOp
);
448 case StyleTransformOperation::Tag::Matrix3D
:
449 ProcessMatrix3D(aMatrix
, aOp
);
451 case StyleTransformOperation::Tag::InterpolateMatrix
:
452 ProcessInterpolateMatrix(aMatrix
, aOp
, aRefBox
);
454 case StyleTransformOperation::Tag::AccumulateMatrix
:
455 ProcessAccumulateMatrix(aMatrix
, aOp
, aRefBox
);
457 case StyleTransformOperation::Tag::Perspective
:
458 ProcessPerspective(aMatrix
, aOp
.AsPerspective());
461 MOZ_ASSERT_UNREACHABLE("Unknown transform function!");
465 Matrix4x4
ReadTransforms(const StyleTransform
& aTransform
,
466 TransformReferenceBox
& aRefBox
,
467 float aAppUnitsPerMatrixUnit
) {
470 for (const StyleTransformOperation
& op
: aTransform
.Operations()) {
471 MatrixForTransformFunction(result
, op
, aRefBox
);
474 float scale
= float(AppUnitsPerCSSPixel()) / aAppUnitsPerMatrixUnit
;
475 result
.PreScale(1 / scale
, 1 / scale
, 1 / scale
);
476 result
.PostScale(scale
, scale
, scale
);
481 static void ProcessTranslate(Matrix4x4
& aMatrix
,
482 const StyleTranslate
& aTranslate
,
483 TransformReferenceBox
& aRefBox
) {
484 switch (aTranslate
.tag
) {
485 case StyleTranslate::Tag::None
:
487 case StyleTranslate::Tag::Translate
:
488 return ProcessTranslate3D(aMatrix
, aTranslate
.AsTranslate()._0
,
489 aTranslate
.AsTranslate()._1
,
490 aTranslate
.AsTranslate()._2
, aRefBox
);
492 MOZ_ASSERT_UNREACHABLE("Huh?");
496 static void ProcessRotate(Matrix4x4
& aMatrix
, const StyleRotate
& aRotate
) {
497 switch (aRotate
.tag
) {
498 case StyleRotate::Tag::None
:
500 case StyleRotate::Tag::Rotate
:
501 aMatrix
.RotateZ(aRotate
.AsRotate().ToRadians());
503 case StyleRotate::Tag::Rotate3D
:
504 return ProcessRotate3D(aMatrix
, aRotate
.AsRotate3D()._0
,
505 aRotate
.AsRotate3D()._1
, aRotate
.AsRotate3D()._2
,
506 aRotate
.AsRotate3D()._3
);
508 MOZ_ASSERT_UNREACHABLE("Huh?");
512 static void ProcessScale(Matrix4x4
& aMatrix
, const StyleScale
& aScale
) {
513 switch (aScale
.tag
) {
514 case StyleScale::Tag::None
:
516 case StyleScale::Tag::Scale
:
517 return ProcessScaleHelper(aMatrix
, aScale
.AsScale()._0
,
518 aScale
.AsScale()._1
, aScale
.AsScale()._2
);
520 MOZ_ASSERT_UNREACHABLE("Huh?");
524 Matrix4x4
ReadTransforms(const StyleTranslate
& aTranslate
,
525 const StyleRotate
& aRotate
, const StyleScale
& aScale
,
526 const Maybe
<ResolvedMotionPathData
>& aMotion
,
527 const StyleTransform
& aTransform
,
528 TransformReferenceBox
& aRefBox
,
529 float aAppUnitsPerMatrixUnit
) {
532 ProcessTranslate(result
, aTranslate
, aRefBox
);
533 ProcessRotate(result
, aRotate
);
534 ProcessScale(result
, aScale
);
536 if (aMotion
.isSome()) {
537 // Create the equivalent translate and rotate function, according to the
538 // order in spec. We combine the translate and then the rotate.
539 // https://drafts.fxtf.org/motion-1/#calculating-path-transform
541 // Besides, we have to shift the object by the delta between anchor-point
542 // and transform-origin, to make sure we rotate the object according to
544 result
.PreTranslate(aMotion
->mTranslate
.x
+ aMotion
->mShift
.x
,
545 aMotion
->mTranslate
.y
+ aMotion
->mShift
.y
, 0.0);
546 if (aMotion
->mRotate
!= 0.0) {
547 result
.RotateZ(aMotion
->mRotate
);
549 // Shift the origin back to transform-origin.
550 result
.PreTranslate(-aMotion
->mShift
.x
, -aMotion
->mShift
.y
, 0.0);
553 for (const StyleTransformOperation
& op
: aTransform
.Operations()) {
554 MatrixForTransformFunction(result
, op
, aRefBox
);
557 float scale
= float(AppUnitsPerCSSPixel()) / aAppUnitsPerMatrixUnit
;
558 result
.PreScale(1 / scale
, 1 / scale
, 1 / scale
);
559 result
.PostScale(scale
, scale
, scale
);
564 mozilla::CSSPoint
Convert2DPosition(const mozilla::LengthPercentage
& aX
,
565 const mozilla::LengthPercentage
& aY
,
566 const CSSSize
& aSize
) {
568 aX
.ResolveToCSSPixels(aSize
.width
),
569 aY
.ResolveToCSSPixels(aSize
.height
),
573 CSSPoint
Convert2DPosition(const LengthPercentage
& aX
,
574 const LengthPercentage
& aY
,
575 TransformReferenceBox
& aRefBox
) {
577 aX
.ResolveToCSSPixelsWith(
578 [&] { return CSSPixel::FromAppUnits(aRefBox
.Width()); }),
579 aY
.ResolveToCSSPixelsWith(
580 [&] { return CSSPixel::FromAppUnits(aRefBox
.Height()); }),
584 Point
Convert2DPosition(const LengthPercentage
& aX
, const LengthPercentage
& aY
,
585 TransformReferenceBox
& aRefBox
,
586 int32_t aAppUnitsPerPixel
) {
587 float scale
= mozilla::AppUnitsPerCSSPixel() / float(aAppUnitsPerPixel
);
588 CSSPoint p
= Convert2DPosition(aX
, aY
, aRefBox
);
589 return {p
.x
* scale
, p
.y
* scale
};
593 * The relevant section of the transitions specification:
594 * http://dev.w3.org/csswg/css3-transitions/#animation-of-property-types-
595 * defers all of the details to the 2-D and 3-D transforms specifications.
596 * For the 2-D transforms specification (all that's relevant for us, right
597 * now), the relevant section is:
598 * http://dev.w3.org/csswg/css3-2d-transforms/#animation
599 * This, in turn, refers to the unmatrix program in Graphics Gems,
600 * available from http://tog.acm.org/resources/GraphicsGems/ , and in
601 * particular as the file GraphicsGems/gemsii/unmatrix.c
602 * in http://tog.acm.org/resources/GraphicsGems/AllGems.tar.gz
604 * The unmatrix reference is for general 3-D transform matrices (any of the
605 * 16 components can have any value).
607 * For CSS 2-D transforms, we have a 2-D matrix with the bottom row constant:
613 * For that case, I believe the algorithm in unmatrix reduces to:
615 * (1) If A * D - B * C == 0, the matrix is singular. Fail.
617 * (2) Set translation components (Tx and Ty) to the translation parts of
618 * the matrix (E and F) and then ignore them for the rest of the time.
619 * (For us, E and F each actually consist of three constants: a
620 * length, a multiplier for the width, and a multiplier for the
621 * height. This actually requires its own decomposition, but I'll
622 * keep that separate.)
624 * (3) Let the X scale (Sx) be sqrt(A^2 + B^2). Then divide both A and B
627 * (4) Let the XY shear (K) be A * C + B * D. From C, subtract A times
628 * the XY shear. From D, subtract B times the XY shear.
630 * (5) Let the Y scale (Sy) be sqrt(C^2 + D^2). Divide C, D, and the XY
633 * (6) At this point, A * D - B * C is either 1 or -1. If it is -1,
634 * negate the XY shear (K), the X scale (Sx), and A, B, C, and D.
635 * (Alternatively, we could negate the XY shear (K) and the Y scale
638 * (7) Let the rotation be R = atan2(B, A).
640 * Then the resulting decomposed transformation is:
642 * translate(Tx, Ty) rotate(R) skewX(atan(K)) scale(Sx, Sy)
644 * An interesting result of this is that all of the simple transform
645 * functions (i.e., all functions other than matrix()), in isolation,
646 * decompose back to themselves except for:
647 * 'skewY(φ)', which is 'matrix(1, tan(φ), 0, 1, 0, 0)', which decomposes
648 * to 'rotate(φ) skewX(φ) scale(sec(φ), cos(φ))' since (ignoring the
649 * alternate sign possibilities that would get fixed in step 6):
650 * In step 3, the X scale factor is sqrt(1+tan²(φ)) = sqrt(sec²(φ)) =
651 * sec(φ). Thus, after step 3, A = 1/sec(φ) = cos(φ) and B = tan(φ) / sec(φ) =
652 * sin(φ). In step 4, the XY shear is sin(φ). Thus, after step 4, C =
653 * -cos(φ)sin(φ) and D = 1 - sin²(φ) = cos²(φ). Thus, in step 5, the Y scale is
654 * sqrt(cos²(φ)(sin²(φ) + cos²(φ)) = cos(φ). Thus, after step 5, C = -sin(φ), D
655 * = cos(φ), and the XY shear is tan(φ). Thus, in step 6, A * D - B * C =
656 * cos²(φ) + sin²(φ) = 1. In step 7, the rotation is thus φ.
658 * skew(θ, φ), which is matrix(1, tan(φ), tan(θ), 1, 0, 0), which decomposes
659 * to 'rotate(φ) skewX(θ + φ) scale(sec(φ), cos(φ))' since (ignoring
660 * the alternate sign possibilities that would get fixed in step 6):
661 * In step 3, the X scale factor is sqrt(1+tan²(φ)) = sqrt(sec²(φ)) =
662 * sec(φ). Thus, after step 3, A = 1/sec(φ) = cos(φ) and B = tan(φ) / sec(φ) =
663 * sin(φ). In step 4, the XY shear is cos(φ)tan(θ) + sin(φ). Thus, after step 4,
664 * C = tan(θ) - cos(φ)(cos(φ)tan(θ) + sin(φ)) = tan(θ)sin²(φ) - cos(φ)sin(φ)
665 * D = 1 - sin(φ)(cos(φ)tan(θ) + sin(φ)) = cos²(φ) - sin(φ)cos(φ)tan(θ)
666 * Thus, in step 5, the Y scale is sqrt(C² + D²) =
667 * sqrt(tan²(θ)(sin⁴(φ) + sin²(φ)cos²(φ)) -
668 * 2 tan(θ)(sin³(φ)cos(φ) + sin(φ)cos³(φ)) +
669 * (sin²(φ)cos²(φ) + cos⁴(φ))) =
670 * sqrt(tan²(θ)sin²(φ) - 2 tan(θ)sin(φ)cos(φ) + cos²(φ)) =
671 * cos(φ) - tan(θ)sin(φ) (taking the negative of the obvious solution so
672 * we avoid flipping in step 6).
673 * After step 5, C = -sin(φ) and D = cos(φ), and the XY shear is
674 * (cos(φ)tan(θ) + sin(φ)) / (cos(φ) - tan(θ)sin(φ)) =
675 * (dividing both numerator and denominator by cos(φ))
676 * (tan(θ) + tan(φ)) / (1 - tan(θ)tan(φ)) = tan(θ + φ).
677 * (See http://en.wikipedia.org/wiki/List_of_trigonometric_identities .)
678 * Thus, in step 6, A * D - B * C = cos²(φ) + sin²(φ) = 1.
679 * In step 7, the rotation is thus φ.
681 * To check this result, we can multiply things back together:
683 * [ cos(φ) -sin(φ) ] [ 1 tan(θ + φ) ] [ sec(φ) 0 ]
684 * [ sin(φ) cos(φ) ] [ 0 1 ] [ 0 cos(φ) ]
686 * [ cos(φ) cos(φ)tan(θ + φ) - sin(φ) ] [ sec(φ) 0 ]
687 * [ sin(φ) sin(φ)tan(θ + φ) + cos(φ) ] [ 0 cos(φ) ]
689 * but since tan(θ + φ) = (tan(θ) + tan(φ)) / (1 - tan(θ)tan(φ)),
690 * cos(φ)tan(θ + φ) - sin(φ)
691 * = cos(φ)(tan(θ) + tan(φ)) - sin(φ) + sin(φ)tan(θ)tan(φ)
692 * = cos(φ)tan(θ) + sin(φ) - sin(φ) + sin(φ)tan(θ)tan(φ)
693 * = cos(φ)tan(θ) + sin(φ)tan(θ)tan(φ)
694 * = tan(θ) (cos(φ) + sin(φ)tan(φ))
695 * = tan(θ) sec(φ) (cos²(φ) + sin²(φ))
698 * sin(φ)tan(θ + φ) + cos(φ)
699 * = sin(φ)(tan(θ) + tan(φ)) + cos(φ) - cos(φ)tan(θ)tan(φ)
700 * = tan(θ) (sin(φ) - sin(φ)) + sin(φ)tan(φ) + cos(φ)
701 * = sec(φ) (sin²(φ) + cos²(φ))
704 * [ cos(φ) tan(θ) sec(φ) ] [ sec(φ) 0 ]
705 * [ sin(φ) sec(φ) ] [ 0 cos(φ) ]
712 * Decompose2DMatrix implements the above decomposition algorithm.
715 bool Decompose2DMatrix(const Matrix
& aMatrix
, Point3D
& aScale
,
716 ShearArray
& aShear
, gfxQuaternion
& aRotate
,
717 Point3D
& aTranslate
) {
718 float A
= aMatrix
._11
, B
= aMatrix
._12
, C
= aMatrix
._21
, D
= aMatrix
._22
;
719 if (A
* D
== B
* C
) {
724 float scaleX
= sqrt(A
* A
+ B
* B
);
728 float XYshear
= A
* C
+ B
* D
;
732 float scaleY
= sqrt(C
* C
+ D
* D
);
737 float determinant
= A
* D
- B
* C
;
738 // Determinant should now be 1 or -1.
739 if (0.99 > Abs(determinant
) || Abs(determinant
) > 1.01) {
743 if (determinant
< 0) {
752 float rotate
= atan2f(B
, A
);
753 aRotate
= gfxQuaternion(0, 0, sin(rotate
/ 2), cos(rotate
/ 2));
754 aShear
[ShearType::XY
] = XYshear
;
757 aTranslate
.x
= aMatrix
._31
;
758 aTranslate
.y
= aMatrix
._32
;
763 * Implementation of the unmatrix algorithm, specified by:
765 * http://dev.w3.org/csswg/css3-2d-transforms/#unmatrix
767 * This, in turn, refers to the unmatrix program in Graphics Gems,
768 * available from http://tog.acm.org/resources/GraphicsGems/ , and in
769 * particular as the file GraphicsGems/gemsii/unmatrix.c
770 * in http://tog.acm.org/resources/GraphicsGems/AllGems.tar.gz
772 bool Decompose3DMatrix(const Matrix4x4
& aMatrix
, Point3D
& aScale
,
773 ShearArray
& aShear
, gfxQuaternion
& aRotate
,
774 Point3D
& aTranslate
, Point4D
& aPerspective
) {
775 Matrix4x4 local
= aMatrix
;
777 if (local
[3][3] == 0) {
781 /* Normalize the matrix */
785 * perspective is used to solve for perspective, but it also provides
786 * an easy way to test for singularity of the upper 3x3 component.
788 Matrix4x4 perspective
= local
;
789 Point4D
empty(0, 0, 0, 1);
790 perspective
.SetTransposedVector(3, empty
);
792 if (perspective
.Determinant() == 0.0) {
796 /* First, isolate perspective. */
797 if (local
[0][3] != 0 || local
[1][3] != 0 || local
[2][3] != 0) {
798 /* aPerspective is the right hand side of the equation. */
799 aPerspective
= local
.TransposedVector(3);
802 * Solve the equation by inverting perspective and multiplying
803 * aPerspective by the inverse.
805 perspective
.Invert();
806 aPerspective
= perspective
.TransposeTransform4D(aPerspective
);
808 /* Clear the perspective partition */
809 local
.SetTransposedVector(3, empty
);
811 aPerspective
= Point4D(0, 0, 0, 1);
814 /* Next take care of translation */
815 for (int i
= 0; i
< 3; i
++) {
816 aTranslate
[i
] = local
[3][i
];
820 /* Now get scale and shear. */
822 /* Compute X scale factor and normalize first row. */
823 aScale
.x
= local
[0].Length();
824 local
[0] /= aScale
.x
;
826 /* Compute XY shear factor and make 2nd local orthogonal to 1st. */
827 aShear
[ShearType::XY
] = local
[0].DotProduct(local
[1]);
828 local
[1] -= local
[0] * aShear
[ShearType::XY
];
830 /* Now, compute Y scale and normalize 2nd local. */
831 aScale
.y
= local
[1].Length();
832 local
[1] /= aScale
.y
;
833 aShear
[ShearType::XY
] /= aScale
.y
;
835 /* Compute XZ and YZ shears, make 3rd local orthogonal */
836 aShear
[ShearType::XZ
] = local
[0].DotProduct(local
[2]);
837 local
[2] -= local
[0] * aShear
[ShearType::XZ
];
838 aShear
[ShearType::YZ
] = local
[1].DotProduct(local
[2]);
839 local
[2] -= local
[1] * aShear
[ShearType::YZ
];
841 /* Next, get Z scale and normalize 3rd local. */
842 aScale
.z
= local
[2].Length();
843 local
[2] /= aScale
.z
;
845 aShear
[ShearType::XZ
] /= aScale
.z
;
846 aShear
[ShearType::YZ
] /= aScale
.z
;
849 * At this point, the matrix (in locals) is orthonormal.
850 * Check for a coordinate system flip. If the determinant
851 * is -1, then negate the matrix and the scaling factors.
853 if (local
[0].DotProduct(local
[1].CrossProduct(local
[2])) < 0) {
855 for (int i
= 0; i
< 3; i
++) {
860 /* Now, get the rotations out */
861 aRotate
= gfxQuaternion(local
);
866 } // namespace nsStyleTransformMatrix