MediaQuery.cpp 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507
  1. /*
  2. * Copyright (c) 2021-2023, Sam Atkins <atkinssj@serenityos.org>
  3. *
  4. * SPDX-License-Identifier: BSD-2-Clause
  5. */
  6. #include <LibWeb/CSS/MediaQuery.h>
  7. #include <LibWeb/CSS/Serialize.h>
  8. #include <LibWeb/CSS/StyleComputer.h>
  9. #include <LibWeb/DOM/Document.h>
  10. #include <LibWeb/HTML/Window.h>
  11. #include <LibWeb/Page/Page.h>
  12. namespace Web::CSS {
  13. NonnullRefPtr<MediaQuery> MediaQuery::create_not_all()
  14. {
  15. auto media_query = new MediaQuery;
  16. media_query->m_negated = true;
  17. media_query->m_media_type = MediaType::All;
  18. return adopt_ref(*media_query);
  19. }
  20. String MediaFeatureValue::to_string() const
  21. {
  22. return m_value.visit(
  23. [](ValueID const& ident) { return MUST(String::from_utf8(string_from_value_id(ident))); },
  24. [](Length const& length) { return length.to_string(); },
  25. [](Ratio const& ratio) { return ratio.to_string(); },
  26. [](Resolution const& resolution) { return resolution.to_string(); },
  27. [](float number) { return MUST(String::number(number)); });
  28. }
  29. bool MediaFeatureValue::is_same_type(MediaFeatureValue const& other) const
  30. {
  31. return m_value.visit(
  32. [&](ValueID const&) { return other.is_ident(); },
  33. [&](Length const&) { return other.is_length(); },
  34. [&](Ratio const&) { return other.is_ratio(); },
  35. [&](Resolution const&) { return other.is_resolution(); },
  36. [&](float) { return other.is_number(); });
  37. }
  38. String MediaFeature::to_string() const
  39. {
  40. auto comparison_string = [](Comparison comparison) -> StringView {
  41. switch (comparison) {
  42. case Comparison::Equal:
  43. return "="sv;
  44. case Comparison::LessThan:
  45. return "<"sv;
  46. case Comparison::LessThanOrEqual:
  47. return "<="sv;
  48. case Comparison::GreaterThan:
  49. return ">"sv;
  50. case Comparison::GreaterThanOrEqual:
  51. return ">="sv;
  52. }
  53. VERIFY_NOT_REACHED();
  54. };
  55. switch (m_type) {
  56. case Type::IsTrue:
  57. return MUST(String::from_utf8(string_from_media_feature_id(m_id)));
  58. case Type::ExactValue:
  59. return MUST(String::formatted("{}: {}", string_from_media_feature_id(m_id), m_value->to_string()));
  60. case Type::MinValue:
  61. return MUST(String::formatted("min-{}: {}", string_from_media_feature_id(m_id), m_value->to_string()));
  62. case Type::MaxValue:
  63. return MUST(String::formatted("max-{}: {}", string_from_media_feature_id(m_id), m_value->to_string()));
  64. case Type::Range:
  65. if (!m_range->right_comparison.has_value())
  66. return MUST(String::formatted("{} {} {}", m_range->left_value.to_string(), comparison_string(m_range->left_comparison), string_from_media_feature_id(m_id)));
  67. return MUST(String::formatted("{} {} {} {} {}", m_range->left_value.to_string(), comparison_string(m_range->left_comparison), string_from_media_feature_id(m_id), comparison_string(*m_range->right_comparison), m_range->right_value->to_string()));
  68. }
  69. VERIFY_NOT_REACHED();
  70. }
  71. bool MediaFeature::evaluate(HTML::Window const& window) const
  72. {
  73. auto maybe_queried_value = window.query_media_feature(m_id);
  74. if (!maybe_queried_value.has_value())
  75. return false;
  76. auto queried_value = maybe_queried_value.release_value();
  77. switch (m_type) {
  78. case Type::IsTrue:
  79. if (queried_value.is_number())
  80. return queried_value.number() != 0;
  81. if (queried_value.is_length())
  82. return queried_value.length().raw_value() != 0;
  83. // FIXME: I couldn't figure out from the spec how ratios should be evaluated in a boolean context.
  84. if (queried_value.is_ratio())
  85. return !queried_value.ratio().is_degenerate();
  86. if (queried_value.is_resolution())
  87. return queried_value.resolution().to_dots_per_pixel() != 0;
  88. if (queried_value.is_ident()) {
  89. // NOTE: It is not technically correct to always treat `no-preference` as false, but every
  90. // media-feature that accepts it as a value treats it as false, so good enough. :^)
  91. // If other features gain this property for other identifiers in the future, we can
  92. // add more robust handling for them then.
  93. return queried_value.ident() != ValueID::None
  94. && queried_value.ident() != ValueID::NoPreference;
  95. }
  96. return false;
  97. case Type::ExactValue:
  98. return compare(window, *m_value, Comparison::Equal, queried_value);
  99. case Type::MinValue:
  100. return compare(window, queried_value, Comparison::GreaterThanOrEqual, *m_value);
  101. case Type::MaxValue:
  102. return compare(window, queried_value, Comparison::LessThanOrEqual, *m_value);
  103. case Type::Range:
  104. if (!compare(window, m_range->left_value, m_range->left_comparison, queried_value))
  105. return false;
  106. if (m_range->right_comparison.has_value())
  107. if (!compare(window, queried_value, *m_range->right_comparison, *m_range->right_value))
  108. return false;
  109. return true;
  110. }
  111. VERIFY_NOT_REACHED();
  112. }
  113. bool MediaFeature::compare(HTML::Window const& window, MediaFeatureValue left, Comparison comparison, MediaFeatureValue right)
  114. {
  115. if (!left.is_same_type(right))
  116. return false;
  117. if (left.is_ident()) {
  118. if (comparison == Comparison::Equal)
  119. return left.ident() == right.ident();
  120. return false;
  121. }
  122. if (left.is_number()) {
  123. switch (comparison) {
  124. case Comparison::Equal:
  125. return left.number() == right.number();
  126. case Comparison::LessThan:
  127. return left.number() < right.number();
  128. case Comparison::LessThanOrEqual:
  129. return left.number() <= right.number();
  130. case Comparison::GreaterThan:
  131. return left.number() > right.number();
  132. case Comparison::GreaterThanOrEqual:
  133. return left.number() >= right.number();
  134. }
  135. VERIFY_NOT_REACHED();
  136. }
  137. if (left.is_length()) {
  138. CSSPixels left_px;
  139. CSSPixels right_px;
  140. // Save ourselves some work if neither side is a relative length.
  141. if (left.length().is_absolute() && right.length().is_absolute()) {
  142. left_px = left.length().absolute_length_to_px();
  143. right_px = right.length().absolute_length_to_px();
  144. } else {
  145. auto viewport_rect = window.page().web_exposed_screen_area();
  146. auto const& initial_font = window.associated_document().style_computer().initial_font();
  147. Gfx::FontPixelMetrics const& initial_font_metrics = initial_font.pixel_metrics();
  148. Length::FontMetrics font_metrics { initial_font.presentation_size(), initial_font_metrics };
  149. left_px = left.length().to_px(viewport_rect, font_metrics, font_metrics);
  150. right_px = right.length().to_px(viewport_rect, font_metrics, font_metrics);
  151. }
  152. switch (comparison) {
  153. case Comparison::Equal:
  154. return left_px == right_px;
  155. case Comparison::LessThan:
  156. return left_px < right_px;
  157. case Comparison::LessThanOrEqual:
  158. return left_px <= right_px;
  159. case Comparison::GreaterThan:
  160. return left_px > right_px;
  161. case Comparison::GreaterThanOrEqual:
  162. return left_px >= right_px;
  163. }
  164. VERIFY_NOT_REACHED();
  165. }
  166. if (left.is_ratio()) {
  167. auto left_decimal = left.ratio().value();
  168. auto right_decimal = right.ratio().value();
  169. switch (comparison) {
  170. case Comparison::Equal:
  171. return left_decimal == right_decimal;
  172. case Comparison::LessThan:
  173. return left_decimal < right_decimal;
  174. case Comparison::LessThanOrEqual:
  175. return left_decimal <= right_decimal;
  176. case Comparison::GreaterThan:
  177. return left_decimal > right_decimal;
  178. case Comparison::GreaterThanOrEqual:
  179. return left_decimal >= right_decimal;
  180. }
  181. VERIFY_NOT_REACHED();
  182. }
  183. if (left.is_resolution()) {
  184. auto left_dppx = left.resolution().to_dots_per_pixel();
  185. auto right_dppx = right.resolution().to_dots_per_pixel();
  186. switch (comparison) {
  187. case Comparison::Equal:
  188. return left_dppx == right_dppx;
  189. case Comparison::LessThan:
  190. return left_dppx < right_dppx;
  191. case Comparison::LessThanOrEqual:
  192. return left_dppx <= right_dppx;
  193. case Comparison::GreaterThan:
  194. return left_dppx > right_dppx;
  195. case Comparison::GreaterThanOrEqual:
  196. return left_dppx >= right_dppx;
  197. }
  198. VERIFY_NOT_REACHED();
  199. }
  200. VERIFY_NOT_REACHED();
  201. }
  202. NonnullOwnPtr<MediaCondition> MediaCondition::from_general_enclosed(GeneralEnclosed&& general_enclosed)
  203. {
  204. auto result = new MediaCondition;
  205. result->type = Type::GeneralEnclosed;
  206. result->general_enclosed = move(general_enclosed);
  207. return adopt_own(*result);
  208. }
  209. NonnullOwnPtr<MediaCondition> MediaCondition::from_feature(MediaFeature&& feature)
  210. {
  211. auto result = new MediaCondition;
  212. result->type = Type::Single;
  213. result->feature = move(feature);
  214. return adopt_own(*result);
  215. }
  216. NonnullOwnPtr<MediaCondition> MediaCondition::from_not(NonnullOwnPtr<MediaCondition>&& condition)
  217. {
  218. auto result = new MediaCondition;
  219. result->type = Type::Not;
  220. result->conditions.append(move(condition));
  221. return adopt_own(*result);
  222. }
  223. NonnullOwnPtr<MediaCondition> MediaCondition::from_and_list(Vector<NonnullOwnPtr<MediaCondition>>&& conditions)
  224. {
  225. auto result = new MediaCondition;
  226. result->type = Type::And;
  227. result->conditions = move(conditions);
  228. return adopt_own(*result);
  229. }
  230. NonnullOwnPtr<MediaCondition> MediaCondition::from_or_list(Vector<NonnullOwnPtr<MediaCondition>>&& conditions)
  231. {
  232. auto result = new MediaCondition;
  233. result->type = Type::Or;
  234. result->conditions = move(conditions);
  235. return adopt_own(*result);
  236. }
  237. String MediaCondition::to_string() const
  238. {
  239. StringBuilder builder;
  240. builder.append('(');
  241. switch (type) {
  242. case Type::Single:
  243. builder.append(feature->to_string());
  244. break;
  245. case Type::Not:
  246. builder.append("not "sv);
  247. builder.append(conditions.first()->to_string());
  248. break;
  249. case Type::And:
  250. builder.join(" and "sv, conditions);
  251. break;
  252. case Type::Or:
  253. builder.join(" or "sv, conditions);
  254. break;
  255. case Type::GeneralEnclosed:
  256. builder.append(general_enclosed->to_string());
  257. break;
  258. }
  259. builder.append(')');
  260. return MUST(builder.to_string());
  261. }
  262. MatchResult MediaCondition::evaluate(HTML::Window const& window) const
  263. {
  264. switch (type) {
  265. case Type::Single:
  266. return as_match_result(feature->evaluate(window));
  267. case Type::Not:
  268. return negate(conditions.first()->evaluate(window));
  269. case Type::And:
  270. return evaluate_and(conditions, [&](auto& child) { return child->evaluate(window); });
  271. case Type::Or:
  272. return evaluate_or(conditions, [&](auto& child) { return child->evaluate(window); });
  273. case Type::GeneralEnclosed:
  274. return general_enclosed->evaluate();
  275. }
  276. VERIFY_NOT_REACHED();
  277. }
  278. String MediaQuery::to_string() const
  279. {
  280. StringBuilder builder;
  281. if (m_negated)
  282. builder.append("not "sv);
  283. if (m_negated || m_media_type != MediaType::All || !m_media_condition) {
  284. builder.append(CSS::to_string(m_media_type));
  285. if (m_media_condition)
  286. builder.append(" and "sv);
  287. }
  288. if (m_media_condition) {
  289. builder.append(m_media_condition->to_string());
  290. }
  291. return MUST(builder.to_string());
  292. }
  293. bool MediaQuery::evaluate(HTML::Window const& window)
  294. {
  295. auto matches_media = [](MediaType media) -> MatchResult {
  296. switch (media) {
  297. case MediaType::All:
  298. return MatchResult::True;
  299. case MediaType::Print:
  300. // FIXME: Enable for printing, when we have printing!
  301. return MatchResult::False;
  302. case MediaType::Screen:
  303. // FIXME: Disable for printing, when we have printing!
  304. return MatchResult::True;
  305. case MediaType::Unknown:
  306. return MatchResult::False;
  307. // Deprecated, must never match:
  308. case MediaType::TTY:
  309. case MediaType::TV:
  310. case MediaType::Projection:
  311. case MediaType::Handheld:
  312. case MediaType::Braille:
  313. case MediaType::Embossed:
  314. case MediaType::Aural:
  315. case MediaType::Speech:
  316. return MatchResult::False;
  317. }
  318. VERIFY_NOT_REACHED();
  319. };
  320. MatchResult result = matches_media(m_media_type);
  321. if ((result == MatchResult::True) && m_media_condition)
  322. result = m_media_condition->evaluate(window);
  323. if (m_negated)
  324. result = negate(result);
  325. m_matches = result == MatchResult::True;
  326. return m_matches;
  327. }
  328. // https://www.w3.org/TR/cssom-1/#serialize-a-media-query-list
  329. String serialize_a_media_query_list(Vector<NonnullRefPtr<MediaQuery>> const& media_queries)
  330. {
  331. // 1. If the media query list is empty, then return the empty string.
  332. if (media_queries.is_empty())
  333. return String {};
  334. // 2. Serialize each media query in the list of media queries, in the same order as they
  335. // appear in the media query list, and then serialize the list.
  336. return MUST(String::join(", "sv, media_queries));
  337. }
  338. bool is_media_feature_name(StringView name)
  339. {
  340. // MEDIAQUERIES-4 - https://www.w3.org/TR/mediaqueries-4/#media-descriptor-table
  341. if (name.equals_ignoring_ascii_case("any-hover"sv))
  342. return true;
  343. if (name.equals_ignoring_ascii_case("any-pointer"sv))
  344. return true;
  345. if (name.equals_ignoring_ascii_case("aspect-ratio"sv))
  346. return true;
  347. if (name.equals_ignoring_ascii_case("color"sv))
  348. return true;
  349. if (name.equals_ignoring_ascii_case("color-gamut"sv))
  350. return true;
  351. if (name.equals_ignoring_ascii_case("color-index"sv))
  352. return true;
  353. if (name.equals_ignoring_ascii_case("device-aspect-ratio"sv))
  354. return true;
  355. if (name.equals_ignoring_ascii_case("device-height"sv))
  356. return true;
  357. if (name.equals_ignoring_ascii_case("device-width"sv))
  358. return true;
  359. if (name.equals_ignoring_ascii_case("grid"sv))
  360. return true;
  361. if (name.equals_ignoring_ascii_case("height"sv))
  362. return true;
  363. if (name.equals_ignoring_ascii_case("hover"sv))
  364. return true;
  365. if (name.equals_ignoring_ascii_case("monochrome"sv))
  366. return true;
  367. if (name.equals_ignoring_ascii_case("orientation"sv))
  368. return true;
  369. if (name.equals_ignoring_ascii_case("overflow-block"sv))
  370. return true;
  371. if (name.equals_ignoring_ascii_case("overflow-inline"sv))
  372. return true;
  373. if (name.equals_ignoring_ascii_case("pointer"sv))
  374. return true;
  375. if (name.equals_ignoring_ascii_case("resolution"sv))
  376. return true;
  377. if (name.equals_ignoring_ascii_case("scan"sv))
  378. return true;
  379. if (name.equals_ignoring_ascii_case("update"sv))
  380. return true;
  381. if (name.equals_ignoring_ascii_case("width"sv))
  382. return true;
  383. // MEDIAQUERIES-5 - https://www.w3.org/TR/mediaqueries-5/#media-descriptor-table
  384. if (name.equals_ignoring_ascii_case("prefers-color-scheme"sv))
  385. return true;
  386. // FIXME: Add other level 5 feature names
  387. return false;
  388. }
  389. MediaQuery::MediaType media_type_from_string(StringView name)
  390. {
  391. if (name.equals_ignoring_ascii_case("all"sv))
  392. return MediaQuery::MediaType::All;
  393. if (name.equals_ignoring_ascii_case("aural"sv))
  394. return MediaQuery::MediaType::Aural;
  395. if (name.equals_ignoring_ascii_case("braille"sv))
  396. return MediaQuery::MediaType::Braille;
  397. if (name.equals_ignoring_ascii_case("embossed"sv))
  398. return MediaQuery::MediaType::Embossed;
  399. if (name.equals_ignoring_ascii_case("handheld"sv))
  400. return MediaQuery::MediaType::Handheld;
  401. if (name.equals_ignoring_ascii_case("print"sv))
  402. return MediaQuery::MediaType::Print;
  403. if (name.equals_ignoring_ascii_case("projection"sv))
  404. return MediaQuery::MediaType::Projection;
  405. if (name.equals_ignoring_ascii_case("screen"sv))
  406. return MediaQuery::MediaType::Screen;
  407. if (name.equals_ignoring_ascii_case("speech"sv))
  408. return MediaQuery::MediaType::Speech;
  409. if (name.equals_ignoring_ascii_case("tty"sv))
  410. return MediaQuery::MediaType::TTY;
  411. if (name.equals_ignoring_ascii_case("tv"sv))
  412. return MediaQuery::MediaType::TV;
  413. return MediaQuery::MediaType::Unknown;
  414. }
  415. StringView to_string(MediaQuery::MediaType media_type)
  416. {
  417. switch (media_type) {
  418. case MediaQuery::MediaType::All:
  419. return "all"sv;
  420. case MediaQuery::MediaType::Aural:
  421. return "aural"sv;
  422. case MediaQuery::MediaType::Braille:
  423. return "braille"sv;
  424. case MediaQuery::MediaType::Embossed:
  425. return "embossed"sv;
  426. case MediaQuery::MediaType::Handheld:
  427. return "handheld"sv;
  428. case MediaQuery::MediaType::Print:
  429. return "print"sv;
  430. case MediaQuery::MediaType::Projection:
  431. return "projection"sv;
  432. case MediaQuery::MediaType::Screen:
  433. return "screen"sv;
  434. case MediaQuery::MediaType::Speech:
  435. return "speech"sv;
  436. case MediaQuery::MediaType::TTY:
  437. return "tty"sv;
  438. case MediaQuery::MediaType::TV:
  439. return "tv"sv;
  440. case MediaQuery::MediaType::Unknown:
  441. return "unknown"sv;
  442. }
  443. VERIFY_NOT_REACHED();
  444. }
  445. }