mirror of
https://github.com/RGBCube/serenity
synced 2025-07-27 13:27:35 +00:00
LibWeb: Convert width/height and min-/max- versions to LengthPercentage
A lot of this is quite ugly, but it should only be so until I remove Length::Type::Percentage entirely. (Which should happen later in this PR, otherwise, yell at me!) For now, a lot of things have to be resolved twice, first from a LengthPercentage to a Length, and then from a Length to a pixel one.
This commit is contained in:
Sam Atkins
Andreas Kling
parent
cb0cce5cdc
commit
dc681913e8
12 changed files with 276 additions and 194 deletions
|
|
@ -104,12 +104,12 @@ public:
|
|||
CSS::JustifyContent justify_content() const { return m_noninherited.justify_content; }
|
||||
Optional<BoxShadowData> const& box_shadow() const { return m_noninherited.box_shadow; }
|
||||
CSS::BoxSizing box_sizing() const { return m_noninherited.box_sizing; }
|
||||
const CSS::Length& width() const { return m_noninherited.width; }
|
||||
const CSS::Length& min_width() const { return m_noninherited.min_width; }
|
||||
const CSS::Length& max_width() const { return m_noninherited.max_width; }
|
||||
const CSS::Length& height() const { return m_noninherited.height; }
|
||||
const CSS::Length& min_height() const { return m_noninherited.min_height; }
|
||||
const CSS::Length& max_height() const { return m_noninherited.max_height; }
|
||||
CSS::LengthPercentage const& width() const { return m_noninherited.width; }
|
||||
CSS::LengthPercentage const& min_width() const { return m_noninherited.min_width; }
|
||||
CSS::LengthPercentage const& max_width() const { return m_noninherited.max_width; }
|
||||
CSS::LengthPercentage const& height() const { return m_noninherited.height; }
|
||||
CSS::LengthPercentage const& min_height() const { return m_noninherited.min_height; }
|
||||
CSS::LengthPercentage const& max_height() const { return m_noninherited.max_height; }
|
||||
|
||||
const CSS::LengthBox& offset() const { return m_noninherited.offset; }
|
||||
const CSS::LengthBox& margin() const { return m_noninherited.margin; }
|
||||
|
|
@ -169,12 +169,12 @@ protected:
|
|||
Optional<int> z_index;
|
||||
CSS::TextDecorationLine text_decoration_line { InitialValues::text_decoration_line() };
|
||||
CSS::Position position { InitialValues::position() };
|
||||
CSS::Length width;
|
||||
CSS::Length min_width;
|
||||
CSS::Length max_width;
|
||||
CSS::Length height;
|
||||
CSS::Length min_height;
|
||||
CSS::Length max_height;
|
||||
CSS::LengthPercentage width { Length::make_auto() };
|
||||
CSS::LengthPercentage min_width { Length::make_auto() };
|
||||
CSS::LengthPercentage max_width { Length::make_auto() };
|
||||
CSS::LengthPercentage height { Length::make_auto() };
|
||||
CSS::LengthPercentage min_height { Length::make_auto() };
|
||||
CSS::LengthPercentage max_height { Length::make_auto() };
|
||||
CSS::LengthBox offset;
|
||||
CSS::LengthBox margin;
|
||||
CSS::LengthBox padding;
|
||||
|
|
@ -222,12 +222,12 @@ public:
|
|||
void set_text_transform(CSS::TextTransform value) { m_inherited.text_transform = value; }
|
||||
void set_position(CSS::Position position) { m_noninherited.position = position; }
|
||||
void set_white_space(CSS::WhiteSpace value) { m_inherited.white_space = value; }
|
||||
void set_width(const CSS::Length& width) { m_noninherited.width = width; }
|
||||
void set_min_width(const CSS::Length& width) { m_noninherited.min_width = width; }
|
||||
void set_max_width(const CSS::Length& width) { m_noninherited.max_width = width; }
|
||||
void set_height(const CSS::Length& height) { m_noninherited.height = height; }
|
||||
void set_min_height(const CSS::Length& height) { m_noninherited.min_height = height; }
|
||||
void set_max_height(const CSS::Length& height) { m_noninherited.max_height = height; }
|
||||
void set_width(CSS::LengthPercentage const& width) { m_noninherited.width = width; }
|
||||
void set_min_width(CSS::LengthPercentage const& width) { m_noninherited.min_width = width; }
|
||||
void set_max_width(CSS::LengthPercentage const& width) { m_noninherited.max_width = width; }
|
||||
void set_height(CSS::LengthPercentage const& height) { m_noninherited.height = height; }
|
||||
void set_min_height(CSS::LengthPercentage const& height) { m_noninherited.min_height = height; }
|
||||
void set_max_height(CSS::LengthPercentage const& height) { m_noninherited.max_height = height; }
|
||||
void set_offset(const CSS::LengthBox& offset) { m_noninherited.offset = offset; }
|
||||
void set_margin(const CSS::LengthBox& margin) { m_noninherited.margin = margin; }
|
||||
void set_padding(const CSS::LengthBox& padding) { m_noninherited.padding = padding; }
|
||||
|
|
|
|||
|
|
@ -12,10 +12,10 @@
|
|||
namespace Web::CSS {
|
||||
|
||||
struct LengthBox {
|
||||
Length top { Length::make_auto() };
|
||||
Length right { Length::make_auto() };
|
||||
Length bottom { Length::make_auto() };
|
||||
Length left { Length::make_auto() };
|
||||
LengthPercentage top { Length::make_auto() };
|
||||
LengthPercentage right { Length::make_auto() };
|
||||
LengthPercentage bottom { Length::make_auto() };
|
||||
LengthPercentage left { Length::make_auto() };
|
||||
};
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -505,59 +505,59 @@ RefPtr<StyleValue> ResolvedCSSStyleDeclaration::style_value_for_property(Layout:
|
|||
return BoxShadowStyleValue::create(box_shadow_data.offset_x, box_shadow_data.offset_y, box_shadow_data.blur_radius, box_shadow_data.color);
|
||||
}
|
||||
case CSS::PropertyID::Width:
|
||||
return LengthStyleValue::create(layout_node.computed_values().width());
|
||||
return style_value_for_length_percentage(layout_node.computed_values().width());
|
||||
case CSS::PropertyID::MinWidth:
|
||||
if (layout_node.computed_values().min_width().is_undefined_or_auto())
|
||||
if (layout_node.computed_values().min_width().is_length() && layout_node.computed_values().min_width().length().is_undefined_or_auto())
|
||||
return IdentifierStyleValue::create(CSS::ValueID::Auto);
|
||||
return LengthStyleValue::create(layout_node.computed_values().min_width());
|
||||
return style_value_for_length_percentage(layout_node.computed_values().min_width());
|
||||
case CSS::PropertyID::MaxWidth:
|
||||
if (layout_node.computed_values().max_width().is_undefined())
|
||||
if (layout_node.computed_values().max_width().is_length() && layout_node.computed_values().max_width().length().is_undefined())
|
||||
return IdentifierStyleValue::create(CSS::ValueID::None);
|
||||
return LengthStyleValue::create(layout_node.computed_values().max_width());
|
||||
return style_value_for_length_percentage(layout_node.computed_values().max_width());
|
||||
case CSS::PropertyID::Height:
|
||||
return LengthStyleValue::create(layout_node.computed_values().height());
|
||||
return style_value_for_length_percentage(layout_node.computed_values().height());
|
||||
case CSS::PropertyID::MinHeight:
|
||||
if (layout_node.computed_values().min_height().is_undefined_or_auto())
|
||||
if (layout_node.computed_values().min_height().is_length() && layout_node.computed_values().min_height().length().is_undefined_or_auto())
|
||||
return IdentifierStyleValue::create(CSS::ValueID::Auto);
|
||||
return LengthStyleValue::create(layout_node.computed_values().min_height());
|
||||
return style_value_for_length_percentage(layout_node.computed_values().min_height());
|
||||
case CSS::PropertyID::MaxHeight:
|
||||
if (layout_node.computed_values().max_height().is_undefined())
|
||||
if (layout_node.computed_values().max_height().is_length() && layout_node.computed_values().max_height().length().is_undefined())
|
||||
return IdentifierStyleValue::create(CSS::ValueID::None);
|
||||
return LengthStyleValue::create(layout_node.computed_values().max_height());
|
||||
return style_value_for_length_percentage(layout_node.computed_values().max_height());
|
||||
case CSS::PropertyID::Margin: {
|
||||
auto margin = layout_node.computed_values().margin();
|
||||
auto values = NonnullRefPtrVector<StyleValue> {};
|
||||
values.append(LengthStyleValue::create(margin.top));
|
||||
values.append(LengthStyleValue::create(margin.right));
|
||||
values.append(LengthStyleValue::create(margin.bottom));
|
||||
values.append(LengthStyleValue::create(margin.left));
|
||||
values.append(style_value_for_length_percentage(margin.top));
|
||||
values.append(style_value_for_length_percentage(margin.right));
|
||||
values.append(style_value_for_length_percentage(margin.bottom));
|
||||
values.append(style_value_for_length_percentage(margin.left));
|
||||
return StyleValueList::create(move(values));
|
||||
}
|
||||
case CSS::PropertyID::MarginTop:
|
||||
return LengthStyleValue::create(layout_node.computed_values().margin().top);
|
||||
return style_value_for_length_percentage(layout_node.computed_values().margin().top);
|
||||
case CSS::PropertyID::MarginRight:
|
||||
return LengthStyleValue::create(layout_node.computed_values().margin().right);
|
||||
return style_value_for_length_percentage(layout_node.computed_values().margin().right);
|
||||
case CSS::PropertyID::MarginBottom:
|
||||
return LengthStyleValue::create(layout_node.computed_values().margin().bottom);
|
||||
return style_value_for_length_percentage(layout_node.computed_values().margin().bottom);
|
||||
case CSS::PropertyID::MarginLeft:
|
||||
return LengthStyleValue::create(layout_node.computed_values().margin().left);
|
||||
return style_value_for_length_percentage(layout_node.computed_values().margin().left);
|
||||
case CSS::PropertyID::Padding: {
|
||||
auto padding = layout_node.computed_values().padding();
|
||||
auto values = NonnullRefPtrVector<StyleValue> {};
|
||||
values.append(LengthStyleValue::create(padding.top));
|
||||
values.append(LengthStyleValue::create(padding.right));
|
||||
values.append(LengthStyleValue::create(padding.bottom));
|
||||
values.append(LengthStyleValue::create(padding.left));
|
||||
values.append(style_value_for_length_percentage(padding.top));
|
||||
values.append(style_value_for_length_percentage(padding.right));
|
||||
values.append(style_value_for_length_percentage(padding.bottom));
|
||||
values.append(style_value_for_length_percentage(padding.left));
|
||||
return StyleValueList::create(move(values));
|
||||
}
|
||||
case CSS::PropertyID::PaddingTop:
|
||||
return LengthStyleValue::create(layout_node.computed_values().padding().top);
|
||||
return style_value_for_length_percentage(layout_node.computed_values().padding().top);
|
||||
case CSS::PropertyID::PaddingRight:
|
||||
return LengthStyleValue::create(layout_node.computed_values().padding().right);
|
||||
return style_value_for_length_percentage(layout_node.computed_values().padding().right);
|
||||
case CSS::PropertyID::PaddingBottom:
|
||||
return LengthStyleValue::create(layout_node.computed_values().padding().bottom);
|
||||
return style_value_for_length_percentage(layout_node.computed_values().padding().bottom);
|
||||
case CSS::PropertyID::PaddingLeft:
|
||||
return LengthStyleValue::create(layout_node.computed_values().padding().left);
|
||||
return style_value_for_length_percentage(layout_node.computed_values().padding().left);
|
||||
case CSS::PropertyID::BorderRadius: {
|
||||
auto maybe_top_left_radius = property(CSS::PropertyID::BorderTopLeftRadius);
|
||||
auto maybe_top_right_radius = property(CSS::PropertyID::BorderTopRightRadius);
|
||||
|
|
|
|||
|
|
@ -47,28 +47,55 @@ Optional<NonnullRefPtr<StyleValue>> StyleProperties::property(CSS::PropertyID pr
|
|||
return it->value;
|
||||
}
|
||||
|
||||
Length StyleProperties::length_or_fallback(CSS::PropertyID id, const Length& fallback) const
|
||||
Length StyleProperties::length_or_fallback(CSS::PropertyID id, Length const& fallback) const
|
||||
{
|
||||
auto value = property(id);
|
||||
if (!value.has_value())
|
||||
auto maybe_value = property(id);
|
||||
if (!maybe_value.has_value())
|
||||
return fallback;
|
||||
auto& value = maybe_value.value();
|
||||
|
||||
if (value.value()->is_calculated()) {
|
||||
if (value->is_calculated()) {
|
||||
Length length = Length(0, Length::Type::Calculated);
|
||||
length.set_calculated_style(&value.value()->as_calculated());
|
||||
length.set_calculated_style(&value->as_calculated());
|
||||
return length;
|
||||
}
|
||||
|
||||
return value.value()->to_length();
|
||||
if (value->has_length())
|
||||
return value->to_length();
|
||||
|
||||
return fallback;
|
||||
}
|
||||
|
||||
LengthPercentage StyleProperties::length_percentage_or_fallback(CSS::PropertyID id, LengthPercentage const& fallback) const
|
||||
{
|
||||
auto maybe_value = property(id);
|
||||
if (!maybe_value.has_value())
|
||||
return fallback;
|
||||
auto& value = maybe_value.value();
|
||||
|
||||
if (value->is_calculated()) {
|
||||
// FIXME: Handle percentages here
|
||||
Length length = Length(0, Length::Type::Calculated);
|
||||
length.set_calculated_style(&value->as_calculated());
|
||||
return length;
|
||||
}
|
||||
|
||||
if (value->is_percentage())
|
||||
return value->as_percentage().percentage();
|
||||
|
||||
if (value->has_length())
|
||||
return value->to_length();
|
||||
|
||||
return fallback;
|
||||
}
|
||||
|
||||
LengthBox StyleProperties::length_box(CSS::PropertyID left_id, CSS::PropertyID top_id, CSS::PropertyID right_id, CSS::PropertyID bottom_id, const CSS::Length& default_value) const
|
||||
{
|
||||
LengthBox box;
|
||||
box.left = length_or_fallback(left_id, default_value);
|
||||
box.top = length_or_fallback(top_id, default_value);
|
||||
box.right = length_or_fallback(right_id, default_value);
|
||||
box.bottom = length_or_fallback(bottom_id, default_value);
|
||||
box.left = length_percentage_or_fallback(left_id, default_value);
|
||||
box.top = length_percentage_or_fallback(top_id, default_value);
|
||||
box.right = length_percentage_or_fallback(right_id, default_value);
|
||||
box.bottom = length_percentage_or_fallback(bottom_id, default_value);
|
||||
return box;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -39,7 +39,8 @@ public:
|
|||
void set_property(CSS::PropertyID, NonnullRefPtr<StyleValue> value);
|
||||
Optional<NonnullRefPtr<StyleValue>> property(CSS::PropertyID) const;
|
||||
|
||||
Length length_or_fallback(CSS::PropertyID, const Length& fallback) const;
|
||||
Length length_or_fallback(CSS::PropertyID, Length const& fallback) const;
|
||||
LengthPercentage length_percentage_or_fallback(CSS::PropertyID, LengthPercentage const& fallback) const;
|
||||
LengthBox length_box(CSS::PropertyID left_id, CSS::PropertyID top_id, CSS::PropertyID right_id, CSS::PropertyID bottom_id, const CSS::Length& default_value) const;
|
||||
Color color_or_fallback(CSS::PropertyID, Layout::NodeWithStyle const&, Color fallback) const;
|
||||
Optional<CSS::TextAlign> text_align() const;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue