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