mirror of
https://github.com/SerenityOS/serenity
synced 2024-09-06 17:06:31 +00:00
LibWeb: Add DOMMatrix skewX and skewY
This commit is contained in:
parent
b21ca0d04e
commit
fc380bf516
|
@ -6,3 +6,7 @@
|
|||
6. {"a":10,"b":20,"c":30,"d":40,"e":1050,"f":1560,"m11":10,"m12":20,"m13":0,"m14":0,"m21":30,"m22":40,"m23":0,"m24":0,"m31":0,"m32":0,"m33":1,"m34":0,"m41":1050,"m42":1560,"m43":0,"m44":1,"is2D":true,"isIdentity":false}
|
||||
7. {"a":10,"b":20,"c":30,"d":40,"e":1050,"f":1560,"m11":10,"m12":20,"m13":0,"m14":0,"m21":30,"m22":40,"m23":0,"m24":0,"m31":0,"m32":0,"m33":1,"m34":0,"m41":1050,"m42":1560,"m43":0,"m44":1,"is2D":true,"isIdentity":false}
|
||||
8. {"a":10,"b":20,"c":30,"d":40,"e":75,"f":85,"m11":10,"m12":20,"m13":0,"m14":0,"m21":30,"m22":40,"m23":0,"m24":0,"m31":0,"m32":0,"m33":1,"m34":0,"m41":75,"m42":85,"m43":0,"m44":1,"is2D":true,"isIdentity":false}
|
||||
9. {"a":10,"b":20,"c":31.76326980708465,"d":43.5265396141693,"e":50,"f":60,"m11":10,"m12":20,"m13":0,"m14":0,"m21":31.76326980708465,"m22":43.5265396141693,"m23":0,"m24":0,"m31":0,"m32":0,"m33":1,"m34":0,"m41":50,"m42":60,"m43":0,"m44":1,"is2D":true,"isIdentity":false}
|
||||
10. {"a":10,"b":20,"c":31.76326980708465,"d":43.5265396141693,"e":50,"f":60,"m11":10,"m12":20,"m13":0,"m14":0,"m21":31.76326980708465,"m22":43.5265396141693,"m23":0,"m24":0,"m31":0,"m32":0,"m33":1,"m34":0,"m41":50,"m42":60,"m43":0,"m44":1,"is2D":true,"isIdentity":false}
|
||||
11. {"a":15.289809421253949,"b":27.0530792283386,"c":30,"d":40,"e":50,"f":60,"m11":15.289809421253949,"m12":27.0530792283386,"m13":0,"m14":0,"m21":30,"m22":40,"m23":0,"m24":0,"m31":0,"m32":0,"m33":1,"m34":0,"m41":50,"m42":60,"m43":0,"m44":1,"is2D":true,"isIdentity":false}
|
||||
12. {"a":15.289809421253949,"b":27.0530792283386,"c":30,"d":40,"e":50,"f":60,"m11":15.289809421253949,"m12":27.0530792283386,"m13":0,"m14":0,"m21":30,"m22":40,"m23":0,"m24":0,"m31":0,"m32":0,"m33":1,"m34":0,"m41":50,"m42":60,"m43":0,"m44":1,"is2D":true,"isIdentity":false}
|
||||
|
|
|
@ -29,5 +29,17 @@
|
|||
|
||||
// 8. Translate DOMMatrix with preMultiplySelf
|
||||
testPart(() => new DOMMatrix([10, 20, 30, 40, 50, 60]).preMultiplySelf(new DOMMatrix().translate(25, 25)));
|
||||
|
||||
// 9. Skew X DOMMatrix
|
||||
testPart(() => new DOMMatrix([10, 20, 30, 40, 50, 60]).skewXSelf(10));
|
||||
|
||||
// 10. Skew X DOMMatrix with multiply
|
||||
testPart(() => new DOMMatrix([10, 20, 30, 40, 50, 60]).multiply(new DOMMatrix().skewX(10)));
|
||||
|
||||
// 11. Skew Y DOMMatrix
|
||||
testPart(() => new DOMMatrix([10, 20, 30, 40, 50, 60]).skewYSelf(10));
|
||||
|
||||
// 12. Skew Y DOMMatrix with multiply
|
||||
testPart(() => new DOMMatrix([10, 20, 30, 40, 50, 60]).multiply(new DOMMatrix().skewY(10)));
|
||||
});
|
||||
</script>
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
/*
|
||||
* Copyright (c) 2023, Luke Wilde <lukew@serenityos.org>
|
||||
* Copyright (c) 2023, Bastiaan van der Plaat <bastiaan.v.d.plaat@gmail.com>
|
||||
*
|
||||
* SPDX-License-Identifier: BSD-2-Clause
|
||||
*/
|
||||
|
@ -307,6 +308,38 @@ JS::NonnullGCPtr<DOMMatrix> DOMMatrix::translate_self(Optional<double> tx, Optio
|
|||
return *this;
|
||||
}
|
||||
|
||||
// https://drafts.fxtf.org/geometry/#dom-dommatrix-skewxself
|
||||
JS::NonnullGCPtr<DOMMatrix> DOMMatrix::skew_x_self(double sx)
|
||||
{
|
||||
// 1. Post-multiply a skewX transformation on the current matrix by the specified angle sx in degrees. The 2D skewX matrix is described in CSS Transforms with alpha = sx in degrees. [CSS3-TRANSFORMS]
|
||||
// clang-format off
|
||||
Gfx::DoubleMatrix4x4 skew_matrix = { 1, tan(sx * M_PI / 180.0), 0, 0,
|
||||
0, 1, 0, 0,
|
||||
0, 0, 1, 0,
|
||||
0, 0, 0, 1 };
|
||||
// clang-format on
|
||||
m_matrix = m_matrix * skew_matrix;
|
||||
|
||||
// 3. Return the current matrix.
|
||||
return *this;
|
||||
}
|
||||
|
||||
// https://drafts.fxtf.org/geometry/#dom-dommatrix-skewyself
|
||||
JS::NonnullGCPtr<DOMMatrix> DOMMatrix::skew_y_self(double sy)
|
||||
{
|
||||
// 1. Post-multiply a skewX transformation on the current matrix by the specified angle sy in degrees. The 2D skewY matrix is described in CSS Transforms with beta = sy in degrees. [CSS3-TRANSFORMS]
|
||||
// clang-format off
|
||||
Gfx::DoubleMatrix4x4 skew_matrix = { 1, 0, 0, 0,
|
||||
tan(sy * M_PI / 180.0), 1, 0, 0,
|
||||
0, 0, 1, 0,
|
||||
0, 0, 0, 1 };
|
||||
// clang-format on
|
||||
m_matrix = m_matrix * skew_matrix;
|
||||
|
||||
// 3. Return the current matrix.
|
||||
return *this;
|
||||
}
|
||||
|
||||
// https://drafts.fxtf.org/geometry/#dom-dommatrix-invertself
|
||||
JS::NonnullGCPtr<DOMMatrix> DOMMatrix::invert_self()
|
||||
{
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
/*
|
||||
* Copyright (c) 2023, Luke Wilde <lukew@serenityos.org>
|
||||
* Copyright (c) 2023, Bastiaan van der Plaat <bastiaan.v.d.plaat@gmail.com>
|
||||
*
|
||||
* SPDX-License-Identifier: BSD-2-Clause
|
||||
*/
|
||||
|
@ -50,6 +51,8 @@ public:
|
|||
WebIDL::ExceptionOr<JS::NonnullGCPtr<DOMMatrix>> multiply_self(DOMMatrixInit other = {});
|
||||
WebIDL::ExceptionOr<JS::NonnullGCPtr<DOMMatrix>> pre_multiply_self(DOMMatrixInit other = {});
|
||||
JS::NonnullGCPtr<DOMMatrix> translate_self(Optional<double> tx, Optional<double> ty, Optional<double> tz);
|
||||
JS::NonnullGCPtr<DOMMatrix> skew_x_self(double sx = 0);
|
||||
JS::NonnullGCPtr<DOMMatrix> skew_y_self(double sy = 0);
|
||||
JS::NonnullGCPtr<DOMMatrix> invert_self();
|
||||
|
||||
private:
|
||||
|
|
|
@ -44,8 +44,8 @@ interface DOMMatrix : DOMMatrixReadOnly {
|
|||
// FIXME: DOMMatrix rotateSelf(optional unrestricted double rotX = 0, optional unrestricted double rotY, optional unrestricted double rotZ);
|
||||
// FIXME: DOMMatrix rotateFromVectorSelf(optional unrestricted double x = 0, optional unrestricted double y = 0);
|
||||
// FIXME: DOMMatrix rotateAxisAngleSelf(optional unrestricted double x = 0, optional unrestricted double y = 0, optional unrestricted double z = 0, optional unrestricted double angle = 0);
|
||||
// FIXME: DOMMatrix skewXSelf(optional unrestricted double sx = 0);
|
||||
// FIXME: DOMMatrix skewYSelf(optional unrestricted double sy = 0);
|
||||
DOMMatrix skewXSelf(optional unrestricted double sx = 0);
|
||||
DOMMatrix skewYSelf(optional unrestricted double sy = 0);
|
||||
DOMMatrix invertSelf();
|
||||
|
||||
// FIXME: [Exposed=Window] DOMMatrix setMatrixValue(DOMString transformList);
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
/*
|
||||
* Copyright (c) 2023, Luke Wilde <lukew@serenityos.org>
|
||||
* Copyright (c) 2023, Bastiaan van der Plaat <bastiaan.v.d.plaat@gmail.com>
|
||||
*
|
||||
* SPDX-License-Identifier: BSD-2-Clause
|
||||
*/
|
||||
|
@ -250,6 +251,28 @@ JS::NonnullGCPtr<DOMMatrix> DOMMatrixReadOnly::translate(Optional<double> const&
|
|||
return result->translate_self(tx, ty, tz);
|
||||
}
|
||||
|
||||
// https://drafts.fxtf.org/geometry/#dom-dommatrixreadonly-skewx
|
||||
JS::NonnullGCPtr<DOMMatrix> DOMMatrixReadOnly::skew_x(double sx) const
|
||||
{
|
||||
// 1. Let result be the resulting matrix initialized to the values of the current matrix.
|
||||
auto result = DOMMatrix::create_from_dom_matrix_read_only(realm(), *this);
|
||||
|
||||
// 2. Perform a skewXSelf() transformation on result with the argument sx.
|
||||
// 3. Return result.
|
||||
return result->skew_x_self(sx);
|
||||
}
|
||||
|
||||
// https://drafts.fxtf.org/geometry/#dom-dommatrixreadonly-skewy
|
||||
JS::NonnullGCPtr<DOMMatrix> DOMMatrixReadOnly::skew_y(double sy) const
|
||||
{
|
||||
// 1. Let result be the resulting matrix initialized to the values of the current matrix.
|
||||
auto result = DOMMatrix::create_from_dom_matrix_read_only(realm(), *this);
|
||||
|
||||
// 2. Perform a skewYSelf() transformation on result with the argument sy.
|
||||
// 3. Return result.
|
||||
return result->skew_y_self(sy);
|
||||
}
|
||||
|
||||
// https://drafts.fxtf.org/geometry/#dom-dommatrixreadonly-multiply
|
||||
WebIDL::ExceptionOr<JS::NonnullGCPtr<DOMMatrix>> DOMMatrixReadOnly::multiply(DOMMatrixInit other)
|
||||
{
|
||||
|
|
|
@ -1,5 +1,6 @@
|
|||
/*
|
||||
* Copyright (c) 2023, Luke Wilde <lukew@serenityos.org>
|
||||
* Copyright (c) 2023, Bastiaan van der Plaat <bastiaan.v.d.plaat@gmail.com>
|
||||
*
|
||||
* SPDX-License-Identifier: BSD-2-Clause
|
||||
*/
|
||||
|
@ -84,6 +85,8 @@ public:
|
|||
bool is_identity() const;
|
||||
|
||||
JS::NonnullGCPtr<DOMMatrix> translate(Optional<double> const& tx, Optional<double> const& ty, Optional<double> const& tz) const;
|
||||
JS::NonnullGCPtr<DOMMatrix> skew_x(double sx = 0) const;
|
||||
JS::NonnullGCPtr<DOMMatrix> skew_y(double sy = 0) const;
|
||||
WebIDL::ExceptionOr<JS::NonnullGCPtr<DOMMatrix>> multiply(DOMMatrixInit other = {});
|
||||
JS::NonnullGCPtr<DOMMatrix> inverse() const;
|
||||
|
||||
|
|
|
@ -46,8 +46,8 @@ interface DOMMatrixReadOnly {
|
|||
// FIXME: [NewObject] DOMMatrix rotate(optional unrestricted double rotX = 0, optional unrestricted double rotY, optional unrestricted double rotZ);
|
||||
// FIXME: [NewObject] DOMMatrix rotateFromVector(optional unrestricted double x = 0, optional unrestricted double y = 0);
|
||||
// FIXME: [NewObject] DOMMatrix rotateAxisAngle(optional unrestricted double x = 0, optional unrestricted double y = 0, optional unrestricted double z = 0, optional unrestricted double angle = 0);
|
||||
// FIXME: [NewObject] DOMMatrix skewX(optional unrestricted double sx = 0);
|
||||
// FIXME: [NewObject] DOMMatrix skewY(optional unrestricted double sy = 0);
|
||||
[NewObject] DOMMatrix skewX(optional unrestricted double sx = 0);
|
||||
[NewObject] DOMMatrix skewY(optional unrestricted double sy = 0);
|
||||
[NewObject] DOMMatrix multiply(optional DOMMatrixInit other = {});
|
||||
// FIXME: [NewObject] DOMMatrix flipX();
|
||||
// FIXME: [NewObject] DOMMatrix flipY();
|
||||
|
|
Loading…
Reference in a new issue