LibWeb: Add Ratio type to MediaFeatureValue

As noted, the Parser can't handle the `<number>` syntax for this - it
gets parsed instead by the `<number>` branch. We can't actually resolve
the ambiguity without making the Parser aware of what type each
media-feature is, but I will get to that soon. :^)
This commit is contained in:
Sam Atkins 2022-03-06 17:50:56 +00:00 committed by Andreas Kling
parent 5f93f1c161
commit deea129b8c
Notes: sideshowbarker 2024-07-17 17:49:57 +09:00
4 changed files with 50 additions and 7 deletions

View File

@ -25,6 +25,7 @@ String MediaFeatureValue::to_string() const
return m_value.visit(
[](String const& ident) { return serialize_an_identifier(ident); },
[](Length const& length) { return length.to_string(); },
[](Ratio const& ratio) { return ratio.to_string(); },
[](Resolution const& resolution) { return resolution.to_string(); },
[](double number) { return String::number(number); });
}
@ -34,6 +35,7 @@ bool MediaFeatureValue::is_same_type(MediaFeatureValue const& other) const
return m_value.visit(
[&](String const&) { return other.is_ident(); },
[&](Length const&) { return other.is_length(); },
[&](Ratio const&) { return other.is_ratio(); },
[&](Resolution const&) { return other.is_resolution(); },
[&](double) { return other.is_number(); });
}
@ -88,6 +90,9 @@ bool MediaFeature::evaluate(DOM::Window const& window) const
return queried_value.number() != 0;
if (queried_value.is_length())
return queried_value.length().raw_value() != 0;
// FIXME: I couldn't figure out from the spec how ratios should be evaluated in a boolean context.
if (queried_value.is_ratio())
return !queried_value.ratio().is_degenerate();
if (queried_value.is_resolution())
return queried_value.resolution().to_dots_per_pixel() != 0;
if (queried_value.is_ident())
@ -181,6 +186,25 @@ bool MediaFeature::compare(DOM::Window const& window, MediaFeatureValue left, Co
VERIFY_NOT_REACHED();
}
if (left.is_ratio()) {
auto left_decimal = left.ratio().value();
auto right_decimal = right.ratio().value();
switch (comparison) {
case Comparison::Equal:
return left_decimal == right_decimal;
case Comparison::LessThan:
return left_decimal < right_decimal;
case Comparison::LessThanOrEqual:
return left_decimal <= right_decimal;
case Comparison::GreaterThan:
return left_decimal > right_decimal;
case Comparison::GreaterThanOrEqual:
return left_decimal >= right_decimal;
}
VERIFY_NOT_REACHED();
}
if (left.is_resolution()) {
auto left_dppx = left.resolution().to_dots_per_pixel();
auto right_dppx = right.resolution().to_dots_per_pixel();

View File

@ -13,6 +13,7 @@
#include <AK/OwnPtr.h>
#include <AK/RefCounted.h>
#include <LibWeb/CSS/GeneralEnclosed.h>
#include <LibWeb/CSS/Ratio.h>
#include <LibWeb/CSS/StyleValue.h>
namespace Web::CSS {
@ -30,6 +31,11 @@ public:
{
}
explicit MediaFeatureValue(Ratio ratio)
: m_value(move(ratio))
{
}
explicit MediaFeatureValue(Resolution resolution)
: m_value(move(resolution))
{
@ -45,6 +51,7 @@ public:
bool is_ident() const { return m_value.has<String>(); }
bool is_length() const { return m_value.has<Length>(); }
bool is_number() const { return m_value.has<double>(); }
bool is_ratio() const { return m_value.has<Ratio>(); }
bool is_resolution() const { return m_value.has<Resolution>(); }
bool is_same_type(MediaFeatureValue const& other) const;
@ -60,6 +67,12 @@ public:
return m_value.get<Length>();
}
Ratio const& ratio() const
{
VERIFY(is_ratio());
return m_value.get<Ratio>();
}
Resolution const& resolution() const
{
VERIFY(is_resolution());
@ -73,8 +86,7 @@ public:
}
private:
// TODO: Support <ratio> once we have that.
Variant<String, Length, Resolution, double> m_value;
Variant<String, Length, Ratio, Resolution, double> m_value;
};
// https://www.w3.org/TR/mediaqueries-4/#mq-features

View File

@ -1153,13 +1153,14 @@ Optional<MediaFeatureValue> Parser::parse_media_feature_value(TokenStream<StyleC
auto position = tokens.position();
tokens.skip_whitespace();
auto& first = tokens.next_token();
tokens.skip_whitespace();
// `<number>`
if (first.is(Token::Type::Number))
if (first.is(Token::Type::Number) && !tokens.has_next_token())
return MediaFeatureValue(first.token().number_value());
// `<dimension>`
if (auto dimension = parse_dimension(first); dimension.has_value()) {
if (auto dimension = parse_dimension(first); dimension.has_value() && !tokens.has_next_token()) {
if (dimension->is_length())
return MediaFeatureValue(dimension->length());
if (dimension->is_resolution())
@ -1167,10 +1168,15 @@ Optional<MediaFeatureValue> Parser::parse_media_feature_value(TokenStream<StyleC
}
// `<ident>`
if (first.is(Token::Type::Ident))
if (first.is(Token::Type::Ident) && !tokens.has_next_token())
return MediaFeatureValue(first.token().ident());
// FIXME: `<ratio>`, once we have ratios.
// `<ratio>`
// Note that a single <number> is a valid <ratio>, but it gets parsed above as a <number>.
// This will get solved with directed parsing of values based on the media-feature.
tokens.rewind_to_position(position);
if (auto ratio = parse_ratio(tokens); ratio.has_value() && !tokens.has_next_token())
return MediaFeatureValue(ratio.release_value());
tokens.rewind_to_position(position);
return {};

View File

@ -381,7 +381,8 @@ Optional<CSS::MediaFeatureValue> Window::query_media_feature(FlyString const& na
return CSS::MediaFeatureValue("hover");
if (name.equals_ignoring_case("any-pointer"sv))
return CSS::MediaFeatureValue("fine");
// FIXME: aspect-ratio
if (name.equals_ignoring_case("aspect-ratio"sv))
return CSS::MediaFeatureValue(CSS::Ratio(inner_width(), inner_height()));
if (name.equals_ignoring_case("color"sv))
return CSS::MediaFeatureValue(8);
if (name.equals_ignoring_case("color-gamut"sv))