Transformation.cpp 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214
  1. /*
  2. * Copyright (c) 2020-2022, Andreas Kling <kling@serenityos.org>
  3. * Copyright (c) 2022-2023, Sam Atkins <atkinssj@serenityos.org>
  4. *
  5. * SPDX-License-Identifier: BSD-2-Clause
  6. */
  7. #include "Transformation.h"
  8. #include <LibWeb/Painting/PaintableBox.h>
  9. namespace Web::CSS {
  10. Transformation::Transformation(TransformFunction function, Vector<TransformValue>&& values)
  11. : m_function(function)
  12. , m_values(move(values))
  13. {
  14. }
  15. ErrorOr<Gfx::FloatMatrix4x4> Transformation::to_matrix(Optional<Painting::PaintableBox const&> paintable_box) const
  16. {
  17. auto count = m_values.size();
  18. auto value = [&](size_t index, CSSPixels const& reference_length = 0) -> ErrorOr<float> {
  19. return m_values[index].visit(
  20. [&](CSS::LengthPercentage const& value) -> ErrorOr<float> {
  21. if (paintable_box.has_value())
  22. return value.resolved(paintable_box->layout_node(), reference_length).to_px(paintable_box->layout_node()).to_float();
  23. if (value.is_length()) {
  24. if (auto const& length = value.length(); length.is_absolute())
  25. return length.absolute_length_to_px().to_float();
  26. }
  27. return Error::from_string_literal("Transform contains non absolute units");
  28. },
  29. [&](CSS::AngleOrCalculated const& value) -> ErrorOr<float> {
  30. if (paintable_box.has_value())
  31. return value.resolved(paintable_box->layout_node()).to_radians();
  32. if (!value.is_calculated())
  33. return value.value().to_radians();
  34. return Error::from_string_literal("Transform contains non absolute units");
  35. },
  36. [&](CSS::NumberPercentage const& value) -> ErrorOr<float> {
  37. if (value.is_percentage())
  38. return value.percentage().as_fraction();
  39. return value.number().value();
  40. });
  41. };
  42. CSSPixels width = 1;
  43. CSSPixels height = 1;
  44. if (paintable_box.has_value()) {
  45. auto reference_box = paintable_box->absolute_padding_box_rect();
  46. width = reference_box.width();
  47. height = reference_box.height();
  48. }
  49. switch (m_function) {
  50. case CSS::TransformFunction::Perspective:
  51. // https://drafts.csswg.org/css-transforms-2/#perspective
  52. // Count is zero when null parameter
  53. if (count == 1) {
  54. // FIXME: Add support for the 'perspective-origin' CSS property.
  55. auto distance = TRY(value(0));
  56. return Gfx::FloatMatrix4x4(1, 0, 0, 0,
  57. 0, 1, 0, 0,
  58. 0, 0, 1, 0,
  59. 0, 0, -1 / (distance <= 0 ? 1 : distance), 1);
  60. } else {
  61. return Gfx::FloatMatrix4x4(1, 0, 0, 0,
  62. 0, 1, 0, 0,
  63. 0, 0, 1, 0,
  64. 0, 0, 0, 1);
  65. }
  66. break;
  67. case CSS::TransformFunction::Matrix:
  68. if (count == 6)
  69. return Gfx::FloatMatrix4x4(TRY(value(0)), TRY(value(2)), 0, TRY(value(4)),
  70. TRY(value(1)), TRY(value(3)), 0, TRY(value(5)),
  71. 0, 0, 1, 0,
  72. 0, 0, 0, 1);
  73. break;
  74. case CSS::TransformFunction::Matrix3d:
  75. if (count == 16)
  76. return Gfx::FloatMatrix4x4(TRY(value(0)), TRY(value(4)), TRY(value(8)), TRY(value(12)),
  77. TRY(value(1)), TRY(value(5)), TRY(value(9)), TRY(value(13)),
  78. TRY(value(2)), TRY(value(6)), TRY(value(10)), TRY(value(14)),
  79. TRY(value(3)), TRY(value(7)), TRY(value(11)), TRY(value(15)));
  80. break;
  81. case CSS::TransformFunction::Translate:
  82. if (count == 1)
  83. return Gfx::FloatMatrix4x4(1, 0, 0, TRY(value(0, width)),
  84. 0, 1, 0, 0,
  85. 0, 0, 1, 0,
  86. 0, 0, 0, 1);
  87. if (count == 2)
  88. return Gfx::FloatMatrix4x4(1, 0, 0, TRY(value(0, width)),
  89. 0, 1, 0, TRY(value(1, height)),
  90. 0, 0, 1, 0,
  91. 0, 0, 0, 1);
  92. break;
  93. case CSS::TransformFunction::Translate3d:
  94. return Gfx::FloatMatrix4x4(1, 0, 0, TRY(value(0, width)),
  95. 0, 1, 0, TRY(value(1, height)),
  96. 0, 0, 1, TRY(value(2)),
  97. 0, 0, 0, 1);
  98. break;
  99. case CSS::TransformFunction::TranslateX:
  100. if (count == 1)
  101. return Gfx::FloatMatrix4x4(1, 0, 0, TRY(value(0, width)),
  102. 0, 1, 0, 0,
  103. 0, 0, 1, 0,
  104. 0, 0, 0, 1);
  105. break;
  106. case CSS::TransformFunction::TranslateY:
  107. if (count == 1)
  108. return Gfx::FloatMatrix4x4(1, 0, 0, 0,
  109. 0, 1, 0, TRY(value(0, height)),
  110. 0, 0, 1, 0,
  111. 0, 0, 0, 1);
  112. break;
  113. case CSS::TransformFunction::TranslateZ:
  114. if (count == 1)
  115. return Gfx::FloatMatrix4x4(1, 0, 0, 0,
  116. 0, 1, 0, 0,
  117. 0, 0, 1, TRY(value(0)),
  118. 0, 0, 0, 1);
  119. break;
  120. case CSS::TransformFunction::Scale:
  121. if (count == 1)
  122. return Gfx::FloatMatrix4x4(TRY(value(0)), 0, 0, 0,
  123. 0, TRY(value(0)), 0, 0,
  124. 0, 0, 1, 0,
  125. 0, 0, 0, 1);
  126. if (count == 2)
  127. return Gfx::FloatMatrix4x4(TRY(value(0)), 0, 0, 0,
  128. 0, TRY(value(1)), 0, 0,
  129. 0, 0, 1, 0,
  130. 0, 0, 0, 1);
  131. break;
  132. case CSS::TransformFunction::Scale3d:
  133. if (count == 3)
  134. return Gfx::FloatMatrix4x4(TRY(value(0)), 0, 0, 0,
  135. 0, TRY(value(1)), 0, 0,
  136. 0, 0, TRY(value(2)), 0,
  137. 0, 0, 0, 1);
  138. break;
  139. case CSS::TransformFunction::ScaleX:
  140. if (count == 1)
  141. return Gfx::FloatMatrix4x4(TRY(value(0)), 0, 0, 0,
  142. 0, 1, 0, 0,
  143. 0, 0, 1, 0,
  144. 0, 0, 0, 1);
  145. break;
  146. case CSS::TransformFunction::ScaleY:
  147. if (count == 1)
  148. return Gfx::FloatMatrix4x4(1, 0, 0, 0,
  149. 0, TRY(value(0)), 0, 0,
  150. 0, 0, 1, 0,
  151. 0, 0, 0, 1);
  152. break;
  153. case CSS::TransformFunction::ScaleZ:
  154. if (count == 1)
  155. return Gfx::FloatMatrix4x4(1, 0, 0, 0,
  156. 0, 1, 0, 0,
  157. 0, 0, TRY(value(0)), 0,
  158. 0, 0, 0, 1);
  159. break;
  160. case CSS::TransformFunction::Rotate3d:
  161. if (count == 4)
  162. return Gfx::rotation_matrix({ TRY(value(0)), TRY(value(1)), TRY(value(2)) }, TRY(value(3)));
  163. break;
  164. case CSS::TransformFunction::RotateX:
  165. if (count == 1)
  166. return Gfx::rotation_matrix({ 1.0f, 0.0f, 0.0f }, TRY(value(0)));
  167. break;
  168. case CSS::TransformFunction::RotateY:
  169. if (count == 1)
  170. return Gfx::rotation_matrix({ 0.0f, 1.0f, 0.0f }, TRY(value(0)));
  171. break;
  172. case CSS::TransformFunction::Rotate:
  173. case CSS::TransformFunction::RotateZ:
  174. if (count == 1)
  175. return Gfx::rotation_matrix({ 0.0f, 0.0f, 1.0f }, TRY(value(0)));
  176. break;
  177. case CSS::TransformFunction::Skew:
  178. if (count == 1)
  179. return Gfx::FloatMatrix4x4(1, tanf(TRY(value(0))), 0, 0,
  180. 0, 1, 0, 0,
  181. 0, 0, 1, 0,
  182. 0, 0, 0, 1);
  183. if (count == 2)
  184. return Gfx::FloatMatrix4x4(1, tanf(TRY(value(0))), 0, 0,
  185. tanf(TRY(value(1))), 1, 0, 0,
  186. 0, 0, 1, 0,
  187. 0, 0, 0, 1);
  188. break;
  189. case CSS::TransformFunction::SkewX:
  190. if (count == 1)
  191. return Gfx::FloatMatrix4x4(1, tanf(TRY(value(0))), 0, 0,
  192. 0, 1, 0, 0,
  193. 0, 0, 1, 0,
  194. 0, 0, 0, 1);
  195. break;
  196. case CSS::TransformFunction::SkewY:
  197. if (count == 1)
  198. return Gfx::FloatMatrix4x4(1, 0, 0, 0,
  199. tanf(TRY(value(0))), 1, 0, 0,
  200. 0, 0, 1, 0,
  201. 0, 0, 0, 1);
  202. break;
  203. }
  204. dbgln_if(LIBWEB_CSS_DEBUG, "FIXME: Unhandled transformation function {} with {} arguments", to_string(m_function), m_values.size());
  205. return Gfx::FloatMatrix4x4::identity();
  206. }
  207. }