| 
									
										
										
										
											2020-01-18 09:38:21 +01:00
										 |  |  | /*
 | 
					
						
							|  |  |  |  * Copyright (c) 2018-2020, Andreas Kling <kling@serenityos.org> | 
					
						
							| 
									
										
										
										
											2023-02-14 15:07:50 +00:00
										 |  |  |  * Copyright (c) 2021-2023, Sam Atkins <atkinssj@serenityos.org> | 
					
						
							| 
									
										
										
										
											2020-01-18 09:38:21 +01:00
										 |  |  |  * | 
					
						
							| 
									
										
										
										
											2021-04-22 01:24:48 -07:00
										 |  |  |  * SPDX-License-Identifier: BSD-2-Clause | 
					
						
							| 
									
										
										
										
											2020-01-18 09:38:21 +01:00
										 |  |  |  */ | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  | #pragma once
 | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-01-06 19:02:26 +01:00
										 |  |  | #include <AK/String.h>
 | 
					
						
							| 
									
										
										
										
											2021-09-23 13:13:51 +02:00
										 |  |  | #include <LibGfx/Forward.h>
 | 
					
						
							| 
									
										
										
										
											2023-06-02 12:39:39 +02:00
										 |  |  | #include <LibGfx/Rect.h>
 | 
					
						
							| 
									
										
										
										
											2020-06-07 17:55:46 +02:00
										 |  |  | #include <LibWeb/Forward.h>
 | 
					
						
							| 
									
										
										
										
											2022-10-24 17:16:08 +01:00
										 |  |  | #include <LibWeb/PixelUnits.h>
 | 
					
						
							| 
									
										
										
										
											2019-07-03 07:55:22 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-07-26 20:01:35 +02:00
										 |  |  | namespace Web::CSS { | 
					
						
							| 
									
										
										
										
											2020-03-07 10:27:02 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  | class Length { | 
					
						
							|  |  |  | public: | 
					
						
							|  |  |  |     enum class Type { | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  |         // Font-relative
 | 
					
						
							|  |  |  |         Em, | 
					
						
							|  |  |  |         Rem, | 
					
						
							|  |  |  |         Ex, | 
					
						
							| 
									
										
										
										
											2023-04-28 16:58:12 +01:00
										 |  |  |         Rex, | 
					
						
							| 
									
										
										
										
											2023-04-28 17:10:30 +01:00
										 |  |  |         Cap, | 
					
						
							|  |  |  |         Rcap, | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  |         Ch, | 
					
						
							| 
									
										
										
										
											2023-04-28 16:58:12 +01:00
										 |  |  |         Rch, | 
					
						
							| 
									
										
										
										
											2023-04-28 17:18:18 +01:00
										 |  |  |         Ic, | 
					
						
							|  |  |  |         Ric, | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  |         Lh, | 
					
						
							|  |  |  |         Rlh, | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         // Viewport-relative
 | 
					
						
							|  |  |  |         Vw, | 
					
						
							| 
									
										
										
										
											2023-04-28 17:46:49 +01:00
										 |  |  |         Svw, | 
					
						
							|  |  |  |         Lvw, | 
					
						
							|  |  |  |         Dvw, | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  |         Vh, | 
					
						
							| 
									
										
										
										
											2023-04-28 17:46:49 +01:00
										 |  |  |         Svh, | 
					
						
							|  |  |  |         Lvh, | 
					
						
							|  |  |  |         Dvh, | 
					
						
							| 
									
										
										
										
											2023-04-28 19:50:09 +01:00
										 |  |  |         Vi, | 
					
						
							|  |  |  |         Svi, | 
					
						
							|  |  |  |         Lvi, | 
					
						
							|  |  |  |         Dvi, | 
					
						
							|  |  |  |         Vb, | 
					
						
							|  |  |  |         Svb, | 
					
						
							|  |  |  |         Lvb, | 
					
						
							|  |  |  |         Dvb, | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  |         Vmin, | 
					
						
							| 
									
										
										
										
											2023-04-28 17:46:49 +01:00
										 |  |  |         Svmin, | 
					
						
							|  |  |  |         Lvmin, | 
					
						
							|  |  |  |         Dvmin, | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  |         Vmax, | 
					
						
							| 
									
										
										
										
											2023-04-28 17:46:49 +01:00
										 |  |  |         Svmax, | 
					
						
							|  |  |  |         Lvmax, | 
					
						
							|  |  |  |         Dvmax, | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  |         // Absolute
 | 
					
						
							| 
									
										
										
										
											2020-09-29 19:06:58 +01:00
										 |  |  |         Cm, | 
					
						
							|  |  |  |         Mm, | 
					
						
							|  |  |  |         Q, | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  |         In, | 
					
						
							| 
									
										
										
										
											2020-06-28 15:25:32 +02:00
										 |  |  |         Pt, | 
					
						
							| 
									
										
										
										
											2020-10-05 16:18:07 +01:00
										 |  |  |         Pc, | 
					
						
							| 
									
										
										
										
											2023-04-24 14:34:44 +01:00
										 |  |  |         Px, | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         // FIXME: Remove auto somehow
 | 
					
						
							|  |  |  |         Auto, | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  |     }; | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-04-28 16:29:12 +01:00
										 |  |  |     struct FontMetrics { | 
					
						
							|  |  |  |         FontMetrics(CSSPixels font_size, Gfx::FontPixelMetrics const&, CSSPixels line_height); | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         CSSPixels font_size; | 
					
						
							|  |  |  |         CSSPixels x_height; | 
					
						
							| 
									
										
										
										
											2023-04-28 17:10:30 +01:00
										 |  |  |         CSSPixels cap_height; | 
					
						
							| 
									
										
										
										
											2023-04-28 16:29:12 +01:00
										 |  |  |         CSSPixels zero_advance; | 
					
						
							|  |  |  |         CSSPixels line_height; | 
					
						
							|  |  |  |     }; | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2022-02-22 12:10:48 +00:00
										 |  |  |     static Optional<Type> unit_from_name(StringView); | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-05-24 10:50:57 +02:00
										 |  |  |     Length(double value, Type type); | 
					
						
							| 
									
										
										
										
											2022-09-13 17:42:39 +02:00
										 |  |  |     ~Length(); | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2021-09-30 22:57:35 +02:00
										 |  |  |     static Length make_auto(); | 
					
						
							| 
									
										
										
										
											2022-10-24 17:16:08 +01:00
										 |  |  |     static Length make_px(CSSPixels value); | 
					
						
							| 
									
										
										
										
											2022-01-14 12:23:54 +00:00
										 |  |  |     Length percentage_of(Percentage const&) const; | 
					
						
							| 
									
										
										
										
											2020-06-24 11:08:46 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  |     bool is_auto() const { return m_type == Type::Auto; } | 
					
						
							| 
									
										
										
										
											2022-02-18 20:26:09 +01:00
										 |  |  |     bool is_px() const { return m_type == Type::Px; } | 
					
						
							| 
									
										
										
										
											2020-09-29 19:06:58 +01:00
										 |  |  | 
 | 
					
						
							|  |  |  |     bool is_absolute() const | 
					
						
							|  |  |  |     { | 
					
						
							|  |  |  |         return m_type == Type::Cm | 
					
						
							|  |  |  |             || m_type == Type::Mm | 
					
						
							| 
									
										
										
										
											2023-04-24 14:56:14 +01:00
										 |  |  |             || m_type == Type::Q | 
					
						
							|  |  |  |             || m_type == Type::In | 
					
						
							| 
									
										
										
										
											2020-09-29 19:06:58 +01:00
										 |  |  |             || m_type == Type::Pt | 
					
						
							| 
									
										
										
										
											2020-10-05 16:18:07 +01:00
										 |  |  |             || m_type == Type::Pc | 
					
						
							| 
									
										
										
										
											2023-04-24 14:56:14 +01:00
										 |  |  |             || m_type == Type::Px; | 
					
						
							| 
									
										
										
										
											2020-09-29 19:06:58 +01:00
										 |  |  |     } | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-04-26 17:37:57 +01:00
										 |  |  |     bool is_font_relative() const | 
					
						
							| 
									
										
										
										
											2020-09-08 20:39:09 +02:00
										 |  |  |     { | 
					
						
							| 
									
										
										
										
											2023-04-24 14:56:14 +01:00
										 |  |  |         return m_type == Type::Em | 
					
						
							| 
									
										
										
										
											2020-09-08 20:39:09 +02:00
										 |  |  |             || m_type == Type::Rem | 
					
						
							| 
									
										
										
										
											2023-04-24 14:56:14 +01:00
										 |  |  |             || m_type == Type::Ex | 
					
						
							| 
									
										
										
										
											2023-04-28 16:58:12 +01:00
										 |  |  |             || m_type == Type::Rex | 
					
						
							| 
									
										
										
										
											2023-04-28 17:10:30 +01:00
										 |  |  |             || m_type == Type::Cap | 
					
						
							|  |  |  |             || m_type == Type::Rcap | 
					
						
							| 
									
										
										
										
											2023-04-24 14:56:14 +01:00
										 |  |  |             || m_type == Type::Ch | 
					
						
							| 
									
										
										
										
											2023-04-28 16:58:12 +01:00
										 |  |  |             || m_type == Type::Rch | 
					
						
							| 
									
										
										
										
											2023-04-28 17:18:18 +01:00
										 |  |  |             || m_type == Type::Ic | 
					
						
							|  |  |  |             || m_type == Type::Ric | 
					
						
							| 
									
										
										
										
											2023-04-24 14:56:14 +01:00
										 |  |  |             || m_type == Type::Lh | 
					
						
							| 
									
										
										
										
											2023-04-26 17:37:57 +01:00
										 |  |  |             || m_type == Type::Rlh; | 
					
						
							|  |  |  |     } | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     bool is_viewport_relative() const | 
					
						
							|  |  |  |     { | 
					
						
							|  |  |  |         return m_type == Type::Vw | 
					
						
							| 
									
										
										
										
											2023-04-28 17:46:49 +01:00
										 |  |  |             || m_type == Type::Svw | 
					
						
							|  |  |  |             || m_type == Type::Lvw | 
					
						
							|  |  |  |             || m_type == Type::Dvw | 
					
						
							| 
									
										
										
										
											2023-04-24 14:56:14 +01:00
										 |  |  |             || m_type == Type::Vh | 
					
						
							| 
									
										
										
										
											2023-04-28 17:46:49 +01:00
										 |  |  |             || m_type == Type::Svh | 
					
						
							|  |  |  |             || m_type == Type::Lvh | 
					
						
							|  |  |  |             || m_type == Type::Dvh | 
					
						
							| 
									
										
										
										
											2023-04-28 19:50:09 +01:00
										 |  |  |             || m_type == Type::Vi | 
					
						
							|  |  |  |             || m_type == Type::Svi | 
					
						
							|  |  |  |             || m_type == Type::Lvi | 
					
						
							|  |  |  |             || m_type == Type::Dvi | 
					
						
							|  |  |  |             || m_type == Type::Vb | 
					
						
							|  |  |  |             || m_type == Type::Svb | 
					
						
							|  |  |  |             || m_type == Type::Lvb | 
					
						
							|  |  |  |             || m_type == Type::Dvb | 
					
						
							| 
									
										
										
										
											2023-03-17 23:08:45 +01:00
										 |  |  |             || m_type == Type::Vmin | 
					
						
							| 
									
										
										
										
											2023-04-28 17:46:49 +01:00
										 |  |  |             || m_type == Type::Svmin | 
					
						
							|  |  |  |             || m_type == Type::Lvmin | 
					
						
							|  |  |  |             || m_type == Type::Dvmin | 
					
						
							|  |  |  |             || m_type == Type::Vmax | 
					
						
							|  |  |  |             || m_type == Type::Svmax | 
					
						
							|  |  |  |             || m_type == Type::Lvmax | 
					
						
							|  |  |  |             || m_type == Type::Dvmax; | 
					
						
							| 
									
										
										
										
											2020-09-08 20:39:09 +02:00
										 |  |  |     } | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-04-26 17:37:57 +01:00
										 |  |  |     bool is_relative() const | 
					
						
							|  |  |  |     { | 
					
						
							|  |  |  |         return is_font_relative() || is_viewport_relative(); | 
					
						
							|  |  |  |     } | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-04-11 12:57:32 +01:00
										 |  |  |     Type type() const { return m_type; } | 
					
						
							| 
									
										
										
										
											2023-05-24 10:50:57 +02:00
										 |  |  |     double raw_value() const { return m_value; } | 
					
						
							| 
									
										
										
										
											2021-09-23 13:13:51 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-06-02 12:39:39 +02:00
										 |  |  |     struct ResolutionContext { | 
					
						
							|  |  |  |         [[nodiscard]] static Length::ResolutionContext for_layout_node(Layout::Node const&); | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         CSSPixelRect viewport_rect; | 
					
						
							|  |  |  |         FontMetrics font_metrics; | 
					
						
							|  |  |  |         FontMetrics root_font_metrics; | 
					
						
							|  |  |  |     }; | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |     [[nodiscard]] CSSPixels to_px(ResolutionContext const&) const; | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2022-11-08 17:29:52 +00:00
										 |  |  |     CSSPixels to_px(Layout::Node const&) const; | 
					
						
							| 
									
										
										
										
											2021-09-23 13:13:51 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-04-28 16:29:12 +01:00
										 |  |  |     ALWAYS_INLINE CSSPixels to_px(CSSPixelRect const& viewport_rect, FontMetrics const& font_metrics, FontMetrics const& root_font_metrics) const | 
					
						
							| 
									
										
										
										
											2020-06-23 23:21:58 +02:00
										 |  |  |     { | 
					
						
							| 
									
										
										
										
											2021-10-05 15:39:40 +01:00
										 |  |  |         if (is_auto()) | 
					
						
							|  |  |  |             return 0; | 
					
						
							| 
									
										
										
										
											2023-04-28 20:07:41 +01:00
										 |  |  |         if (is_font_relative()) | 
					
						
							|  |  |  |             return font_relative_length_to_px(font_metrics, root_font_metrics); | 
					
						
							|  |  |  |         if (is_viewport_relative()) | 
					
						
							|  |  |  |             return viewport_relative_length_to_px(viewport_rect); | 
					
						
							| 
									
										
										
										
											2021-10-05 15:39:40 +01:00
										 |  |  |         return absolute_length_to_px(); | 
					
						
							|  |  |  |     } | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2022-11-08 17:29:52 +00:00
										 |  |  |     ALWAYS_INLINE CSSPixels absolute_length_to_px() const | 
					
						
							| 
									
										
										
										
											2021-10-05 15:39:40 +01:00
										 |  |  |     { | 
					
						
							| 
									
										
										
										
											2023-05-24 10:50:57 +02:00
										 |  |  |         constexpr double inch_pixels = 96.0; | 
					
						
							|  |  |  |         constexpr double centimeter_pixels = (inch_pixels / 2.54); | 
					
						
							| 
									
										
										
										
											2020-06-23 23:21:58 +02:00
										 |  |  |         switch (m_type) { | 
					
						
							| 
									
										
										
										
											2020-09-29 19:06:58 +01:00
										 |  |  |         case Type::Cm: | 
					
						
							| 
									
										
										
										
											2023-08-26 15:03:04 +01:00
										 |  |  |             return CSSPixels(m_value * centimeter_pixels); // 1cm = 96px/2.54
 | 
					
						
							| 
									
										
										
										
											2020-09-29 19:06:58 +01:00
										 |  |  |         case Type::In: | 
					
						
							| 
									
										
										
										
											2023-08-26 15:03:04 +01:00
										 |  |  |             return CSSPixels(m_value * inch_pixels); // 1in = 2.54 cm = 96px
 | 
					
						
							| 
									
										
										
										
											2020-06-23 23:21:58 +02:00
										 |  |  |         case Type::Px: | 
					
						
							| 
									
										
										
										
											2023-08-26 15:03:04 +01:00
										 |  |  |             return CSSPixels(m_value); // 1px = 1/96th of 1in
 | 
					
						
							| 
									
										
										
										
											2020-06-28 15:25:32 +02:00
										 |  |  |         case Type::Pt: | 
					
						
							| 
									
										
										
										
											2023-08-26 15:03:04 +01:00
										 |  |  |             return CSSPixels(m_value * ((1.0 / 72.0) * inch_pixels)); // 1pt = 1/72th of 1in
 | 
					
						
							| 
									
										
										
										
											2020-10-05 16:18:07 +01:00
										 |  |  |         case Type::Pc: | 
					
						
							| 
									
										
										
										
											2023-08-26 15:03:04 +01:00
										 |  |  |             return CSSPixels(m_value * ((1.0 / 6.0) * inch_pixels)); // 1pc = 1/6th of 1in
 | 
					
						
							| 
									
										
										
										
											2020-09-29 19:06:58 +01:00
										 |  |  |         case Type::Mm: | 
					
						
							| 
									
										
										
										
											2023-08-26 15:03:04 +01:00
										 |  |  |             return CSSPixels(m_value * ((1.0 / 10.0) * centimeter_pixels)); // 1mm = 1/10th of 1cm
 | 
					
						
							| 
									
										
										
										
											2020-09-29 19:06:58 +01:00
										 |  |  |         case Type::Q: | 
					
						
							| 
									
										
										
										
											2023-08-26 15:03:04 +01:00
										 |  |  |             return CSSPixels(m_value * ((1.0 / 40.0) * centimeter_pixels)); // 1Q = 1/40th of 1cm
 | 
					
						
							| 
									
										
										
										
											2020-06-23 23:21:58 +02:00
										 |  |  |         default: | 
					
						
							| 
									
										
										
										
											2021-02-23 20:42:32 +01:00
										 |  |  |             VERIFY_NOT_REACHED(); | 
					
						
							| 
									
										
										
										
											2020-06-23 23:21:58 +02:00
										 |  |  |         } | 
					
						
							|  |  |  |     } | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-08-22 12:25:30 +01:00
										 |  |  |     String to_string() const; | 
					
						
							| 
									
										
										
										
											2019-07-24 07:34:07 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-03-30 15:46:05 +01:00
										 |  |  |     bool operator==(Length const& other) const | 
					
						
							|  |  |  |     { | 
					
						
							|  |  |  |         return m_type == other.m_type && m_value == other.m_value; | 
					
						
							|  |  |  |     } | 
					
						
							| 
									
										
										
										
											2020-12-15 19:39:33 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-04-28 20:07:41 +01:00
										 |  |  |     CSSPixels font_relative_length_to_px(FontMetrics const& font_metrics, FontMetrics const& root_font_metrics) const; | 
					
						
							|  |  |  |     CSSPixels viewport_relative_length_to_px(CSSPixelRect const& viewport_rect) const; | 
					
						
							| 
									
										
										
										
											2021-09-23 13:13:51 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2023-03-30 15:01:23 +01:00
										 |  |  |     // Returns empty optional if it's already absolute.
 | 
					
						
							| 
									
										
										
										
											2023-04-28 16:29:12 +01:00
										 |  |  |     Optional<Length> absolutize(CSSPixelRect const& viewport_rect, FontMetrics const& font_metrics, FontMetrics const& root_font_metrics) const; | 
					
						
							|  |  |  |     Length absolutized(CSSPixelRect const& viewport_rect, FontMetrics const& font_metrics, FontMetrics const& root_font_metrics) const; | 
					
						
							| 
									
										
										
										
											2023-03-30 15:01:23 +01:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  | private: | 
					
						
							| 
									
										
										
										
											2022-04-01 20:58:27 +03:00
										 |  |  |     char const* unit_name() const; | 
					
						
							| 
									
										
										
										
											2020-06-07 17:55:46 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2022-02-18 16:50:17 +00:00
										 |  |  |     Type m_type; | 
					
						
							| 
									
										
										
										
											2023-05-24 10:50:57 +02:00
										 |  |  |     double m_value { 0 }; | 
					
						
							| 
									
										
										
										
											2019-07-01 17:17:32 +02:00
										 |  |  | }; | 
					
						
							| 
									
										
										
										
											2019-08-18 08:09:56 +02:00
										 |  |  | 
 | 
					
						
							| 
									
										
										
										
											2020-03-07 10:27:02 +01:00
										 |  |  | } | 
					
						
							| 
									
										
										
										
											2022-01-19 17:30:29 +00:00
										 |  |  | 
 | 
					
						
							|  |  |  | template<> | 
					
						
							|  |  |  | struct AK::Formatter<Web::CSS::Length> : Formatter<StringView> { | 
					
						
							|  |  |  |     ErrorOr<void> format(FormatBuilder& builder, Web::CSS::Length const& length) | 
					
						
							|  |  |  |     { | 
					
						
							| 
									
										
										
										
											2023-08-22 12:25:30 +01:00
										 |  |  |         return Formatter<StringView>::format(builder, length.to_string()); | 
					
						
							| 
									
										
										
										
											2022-01-19 17:30:29 +00:00
										 |  |  |     } | 
					
						
							|  |  |  | }; |