mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-07-29 20:29:18 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Implement serialization of lch-like color values

Browse source
This commit is contained in:
Tim Ledbetter 2025-04-19 13:49:45 +01:00 • committed by Andreas Kling
commit e860dd4f65
Notes: github-actions[bot] 2025-04-20 16:45:02 +00:00
4 changed files with 131 additions and 89 deletions
Download patch file Download diff file Expand all files Collapse all files

16
Libraries/LibWeb/CSS/StyleValues/CSSColorValue.cpp
View file

@ -8,6 +8,7 @@
*/
#include "CSSColorValue.h"
#include <LibJS/Runtime/AbstractOperations.h>
#include <LibWeb/CSS/Serialize.h>
#include <LibWeb/CSS/StyleValues/AngleStyleValue.h>
#include <LibWeb/CSS/StyleValues/CSSKeywordValue.h>
@ -33,7 +34,7 @@ Optional<double> CSSColorValue::resolve_hue(CSSStyleValue const& style_value)
{
// <number> | <angle> | none
auto normalized = [](double number) {
return fmod(number, 360.0);
return JS::modulo(number, 360.0);
};
if (style_value.is_number())
@ -146,4 +147,17 @@ void CSSColorValue::serialize_alpha_component(StringBuilder& builder, Serializat
builder.appendff("{}", resolved_value);
}
void CSSColorValue::serialize_hue_component(StringBuilder& builder, SerializationMode mode, CSSStyleValue const& component) const
{
if (component.to_keyword() == Keyword::None) {
builder.append("none"sv);
return;
}
if (component.is_calculated() && mode == SerializationMode::Normal) {
builder.append(component.to_string(mode));
return;
}
builder.appendff("{:.4}", resolve_hue(component).value_or(0));
}
}

1
Libraries/LibWeb/CSS/StyleValues/CSSColorValue.h
View file

@ -63,6 +63,7 @@ protected:
void serialize_color_component(StringBuilder& builder, SerializationMode mode, CSSStyleValue const& component, float one_hundred_percent_value, Optional<double> clamp_min = {}, Optional<double> clamp_max = {}) const;
void serialize_alpha_component(StringBuilder& builder, SerializationMode mode, CSSStyleValue const& component) const;
void serialize_hue_component(StringBuilder& builder, SerializationMode mode, CSSStyleValue const& component) const;
ColorType m_color_type;
ColorSyntax m_color_syntax;

40
Libraries/LibWeb/CSS/StyleValues/CSSLCHLike.cpp
View file

@ -1,5 +1,6 @@
/*
* Copyright (c) 2024, Sam Atkins <sam@ladybird.org>
* Copyright (c) 2025, Tim Ledbetter <tim.ledbetter@ladybird.org>
*
* SPDX-License-Identifier: BSD-2-Clause
*/
@ -8,6 +9,7 @@
#include <AK/Math.h>
#include <AK/TypeCasts.h>
#include <LibWeb/CSS/Serialize.h>
#include <LibWeb/CSS/StyleValues/CSSKeywordValue.h>
#include <LibWeb/CSS/StyleValues/CalculatedStyleValue.h>
#include <LibWeb/CSS/StyleValues/NumberStyleValue.h>
#include <LibWeb/CSS/StyleValues/PercentageStyleValue.h>
@ -36,10 +38,23 @@ Color CSSLCH::to_color(Optional<Layout::NodeWithStyle const&>) const
}
// https://www.w3.org/TR/css-color-4/#serializing-lab-lch
String CSSLCH::to_string(SerializationMode) const
String CSSLCH::to_string(SerializationMode mode) const
{
// FIXME: Do this properly, taking unresolved calculated values into account.
return serialize_a_srgb_value(to_color({}));
StringBuilder builder;
builder.append("lch("sv);
serialize_color_component(builder, mode, m_properties.l, 100, 0, 100);
builder.append(' ');
serialize_color_component(builder, mode, m_properties.c, 150, 0, 230);
builder.append(' ');
serialize_hue_component(builder, mode, m_properties.h);
if ((!m_properties.alpha->is_number() || m_properties.alpha->as_number().number() < 1)
&& (!m_properties.alpha->is_percentage() || m_properties.alpha->as_percentage().percentage().as_fraction() < 1)) {
builder.append(" / "sv);
serialize_alpha_component(builder, mode, m_properties.alpha);
}
builder.append(')');
return MUST(builder.to_string());
}
Color CSSOKLCH::to_color(Optional<Layout::NodeWithStyle const&>) const
@ -53,10 +68,23 @@ Color CSSOKLCH::to_color(Optional<Layout::NodeWithStyle const&>) const
}
// https://www.w3.org/TR/css-color-4/#serializing-oklab-oklch
String CSSOKLCH::to_string(SerializationMode) const
String CSSOKLCH::to_string(SerializationMode mode) const
{
// FIXME: Do this properly, taking unresolved calculated values into account.
return serialize_a_srgb_value(to_color({}));
StringBuilder builder;
builder.append("oklch("sv);
serialize_color_component(builder, mode, m_properties.l, 1.0f, 0, 1);
builder.append(' ');
serialize_color_component(builder, mode, m_properties.c, 0.4f, 0, 2.3);
builder.append(' ');
serialize_hue_component(builder, mode, m_properties.h);
if ((!m_properties.alpha->is_number() || m_properties.alpha->as_number().number() < 1)
&& (!m_properties.alpha->is_percentage() || m_properties.alpha->as_percentage().percentage().as_fraction() < 1)) {
builder.append(" / "sv);
serialize_alpha_component(builder, mode, m_properties.alpha);
}
builder.append(')');
return MUST(builder.to_string());
}
}