PaintableBox.cpp 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714
  1. /*
  2. * Copyright (c) 2022, Andreas Kling <kling@serenityos.org>
  3. *
  4. * SPDX-License-Identifier: BSD-2-Clause
  5. */
  6. #include <AK/GenericShorthands.h>
  7. #include <LibUnicode/CharacterTypes.h>
  8. #include <LibWeb/DOM/Document.h>
  9. #include <LibWeb/HTML/HTMLHtmlElement.h>
  10. #include <LibWeb/Layout/BlockContainer.h>
  11. #include <LibWeb/Layout/InitialContainingBlock.h>
  12. #include <LibWeb/Painting/BackgroundPainting.h>
  13. #include <LibWeb/Painting/FilterPainting.h>
  14. #include <LibWeb/Painting/PaintableBox.h>
  15. #include <LibWeb/Painting/StackingContext.h>
  16. #include <LibWeb/Platform/FontPlugin.h>
  17. namespace Web::Painting {
  18. NonnullRefPtr<PaintableBox> PaintableBox::create(Layout::Box const& layout_box)
  19. {
  20. return adopt_ref(*new PaintableBox(layout_box));
  21. }
  22. PaintableBox::PaintableBox(Layout::Box const& layout_box)
  23. : Paintable(layout_box)
  24. {
  25. }
  26. PaintableBox::~PaintableBox()
  27. {
  28. }
  29. void PaintableBox::invalidate_stacking_context()
  30. {
  31. m_stacking_context = nullptr;
  32. }
  33. bool PaintableBox::is_out_of_view(PaintContext& context) const
  34. {
  35. return !enclosing_int_rect(absolute_paint_rect())
  36. .translated(context.painter().translation())
  37. .intersects(context.painter().clip_rect());
  38. }
  39. PaintableWithLines::PaintableWithLines(Layout::BlockContainer const& layout_box)
  40. : PaintableBox(layout_box)
  41. {
  42. }
  43. PaintableWithLines::~PaintableWithLines()
  44. {
  45. }
  46. void PaintableBox::set_offset(Gfx::FloatPoint const& offset)
  47. {
  48. m_offset = offset;
  49. // FIXME: This const_cast is gross.
  50. const_cast<Layout::Box&>(layout_box()).did_set_rect();
  51. }
  52. void PaintableBox::set_content_size(Gfx::FloatSize const& size)
  53. {
  54. m_content_size = size;
  55. // FIXME: This const_cast is gross.
  56. const_cast<Layout::Box&>(layout_box()).did_set_rect();
  57. }
  58. Gfx::FloatPoint PaintableBox::effective_offset() const
  59. {
  60. Gfx::FloatPoint offset;
  61. if (m_containing_line_box_fragment.has_value()) {
  62. // FIXME: This is a hack to deal with situations where the layout tree has been garbage collected.
  63. // We could avoid this by making the paintable tree garbage collected as well.
  64. if (!containing_block() || !containing_block()->paint_box())
  65. return offset;
  66. auto const& fragment = containing_block()->paint_box()->line_boxes()[m_containing_line_box_fragment->line_box_index].fragments()[m_containing_line_box_fragment->fragment_index];
  67. offset = fragment.offset();
  68. } else {
  69. offset = m_offset;
  70. }
  71. if (layout_box().computed_values().position() == CSS::Position::Relative) {
  72. auto const& inset = layout_box().box_model().inset;
  73. offset.translate_by(inset.left, inset.top);
  74. }
  75. return offset;
  76. }
  77. Gfx::FloatRect PaintableBox::compute_absolute_rect() const
  78. {
  79. Gfx::FloatRect rect { effective_offset(), content_size() };
  80. for (auto const* block = containing_block(); block && block->paintable(); block = block->paintable()->containing_block())
  81. rect.translate_by(block->paint_box()->effective_offset());
  82. return rect;
  83. }
  84. Gfx::FloatRect PaintableBox::absolute_rect() const
  85. {
  86. if (!m_absolute_rect.has_value())
  87. m_absolute_rect = compute_absolute_rect();
  88. return *m_absolute_rect;
  89. }
  90. Gfx::FloatRect PaintableBox::compute_absolute_paint_rect() const
  91. {
  92. // FIXME: This likely incomplete:
  93. auto rect = absolute_border_box_rect();
  94. auto resolved_box_shadow_data = resolve_box_shadow_data();
  95. for (auto const& shadow : resolved_box_shadow_data) {
  96. if (shadow.placement == ShadowPlacement::Inner)
  97. continue;
  98. auto inflate = shadow.spread_distance + shadow.blur_radius;
  99. auto shadow_rect = rect.inflated(inflate, inflate, inflate, inflate).translated(shadow.offset_x, shadow.offset_y);
  100. rect = rect.united(shadow_rect);
  101. }
  102. return rect;
  103. }
  104. Gfx::FloatRect PaintableBox::absolute_paint_rect() const
  105. {
  106. if (!m_absolute_paint_rect.has_value())
  107. m_absolute_paint_rect = compute_absolute_paint_rect();
  108. return *m_absolute_paint_rect;
  109. }
  110. void PaintableBox::set_containing_line_box_fragment(Optional<Layout::LineBoxFragmentCoordinate> fragment_coordinate)
  111. {
  112. m_containing_line_box_fragment = fragment_coordinate;
  113. }
  114. Painting::StackingContext* PaintableBox::enclosing_stacking_context()
  115. {
  116. for (auto* ancestor = layout_box().parent(); ancestor; ancestor = ancestor->parent()) {
  117. if (!is<Layout::Box>(ancestor))
  118. continue;
  119. auto& ancestor_box = static_cast<Layout::Box&>(const_cast<Layout::NodeWithStyle&>(*ancestor));
  120. if (auto* ancestor_paint_box = ancestor_box.paint_box(); ancestor_paint_box && ancestor_paint_box->stacking_context())
  121. return const_cast<StackingContext*>(ancestor_paint_box->stacking_context());
  122. }
  123. // We should always reach the Layout::InitialContainingBlock stacking context.
  124. VERIFY_NOT_REACHED();
  125. }
  126. void PaintableBox::paint(PaintContext& context, PaintPhase phase) const
  127. {
  128. if (!is_visible())
  129. return;
  130. auto clip_rect = computed_values().clip();
  131. auto should_clip_rect = clip_rect.is_rect() && layout_box().is_absolutely_positioned();
  132. if (phase == PaintPhase::Background) {
  133. if (should_clip_rect) {
  134. context.painter().save();
  135. auto border_box = absolute_border_box_rect();
  136. context.painter().add_clip_rect(clip_rect.to_rect().resolved(Paintable::layout_node(), border_box).to_rounded<int>());
  137. }
  138. paint_backdrop_filter(context);
  139. paint_background(context);
  140. paint_box_shadow(context);
  141. }
  142. if (phase == PaintPhase::Border) {
  143. paint_border(context);
  144. }
  145. if (phase == PaintPhase::Overlay && should_clip_rect)
  146. context.painter().restore();
  147. if (phase == PaintPhase::Overlay && layout_box().dom_node() && layout_box().document().inspected_node() == layout_box().dom_node()) {
  148. auto content_rect = absolute_rect();
  149. auto margin_box = box_model().margin_box();
  150. Gfx::FloatRect margin_rect;
  151. margin_rect.set_x(absolute_x() - margin_box.left);
  152. margin_rect.set_width(content_width() + margin_box.left + margin_box.right);
  153. margin_rect.set_y(absolute_y() - margin_box.top);
  154. margin_rect.set_height(content_height() + margin_box.top + margin_box.bottom);
  155. auto border_rect = absolute_border_box_rect();
  156. auto padding_rect = absolute_padding_box_rect();
  157. auto paint_inspector_rect = [&](Gfx::FloatRect const& rect, Color color) {
  158. context.painter().fill_rect(enclosing_int_rect(rect), Color(color).with_alpha(100));
  159. context.painter().draw_rect(enclosing_int_rect(rect), Color(color));
  160. };
  161. paint_inspector_rect(margin_rect, Color::Yellow);
  162. paint_inspector_rect(padding_rect, Color::Cyan);
  163. paint_inspector_rect(border_rect, Color::Green);
  164. paint_inspector_rect(content_rect, Color::Magenta);
  165. auto& font = Platform::FontPlugin::the().default_font();
  166. StringBuilder builder;
  167. if (layout_box().dom_node())
  168. builder.append(layout_box().dom_node()->debug_description());
  169. else
  170. builder.append(layout_box().debug_description());
  171. builder.appendff(" {}x{} @ {},{}", border_rect.width(), border_rect.height(), border_rect.x(), border_rect.y());
  172. auto size_text = builder.to_string();
  173. auto size_text_rect = border_rect;
  174. size_text_rect.set_y(border_rect.y() + border_rect.height());
  175. size_text_rect.set_top(size_text_rect.top());
  176. size_text_rect.set_width((float)font.width(size_text) + 4);
  177. size_text_rect.set_height(font.pixel_size() + 4);
  178. context.painter().fill_rect(enclosing_int_rect(size_text_rect), context.palette().color(Gfx::ColorRole::Tooltip));
  179. context.painter().draw_rect(enclosing_int_rect(size_text_rect), context.palette().threed_shadow1());
  180. context.painter().draw_text(enclosing_int_rect(size_text_rect), size_text, font, Gfx::TextAlignment::Center, context.palette().color(Gfx::ColorRole::TooltipText));
  181. }
  182. if (phase == PaintPhase::FocusOutline && layout_box().dom_node() && layout_box().dom_node()->is_element() && verify_cast<DOM::Element>(*layout_box().dom_node()).is_focused()) {
  183. // FIXME: Implement this as `outline` using :focus-visible in the default UA stylesheet to make it possible to override/disable.
  184. auto focus_outline_rect = enclosing_int_rect(absolute_border_box_rect()).inflated(4, 4);
  185. context.painter().draw_focus_rect(focus_outline_rect, context.palette().focus_outline());
  186. }
  187. }
  188. void PaintableBox::paint_border(PaintContext& context) const
  189. {
  190. auto borders_data = BordersData {
  191. .top = computed_values().border_top(),
  192. .right = computed_values().border_right(),
  193. .bottom = computed_values().border_bottom(),
  194. .left = computed_values().border_left(),
  195. };
  196. paint_all_borders(context, absolute_border_box_rect(), normalized_border_radii_data(), borders_data);
  197. }
  198. void PaintableBox::paint_backdrop_filter(PaintContext& context) const
  199. {
  200. auto& backdrop_filter = computed_values().backdrop_filter();
  201. if (!backdrop_filter.is_none())
  202. Painting::apply_backdrop_filter(context, layout_node(), absolute_border_box_rect(), normalized_border_radii_data(), backdrop_filter);
  203. }
  204. void PaintableBox::paint_background(PaintContext& context) const
  205. {
  206. // If the body's background properties were propagated to the root element, do no re-paint the body's background.
  207. if (layout_box().is_body() && document().html_element()->should_use_body_background_properties())
  208. return;
  209. Gfx::FloatRect background_rect;
  210. Color background_color = computed_values().background_color();
  211. auto* background_layers = &computed_values().background_layers();
  212. if (layout_box().is_root_element()) {
  213. // CSS 2.1 Appendix E.2: If the element is a root element, paint the background over the entire canvas.
  214. background_rect = context.viewport_rect().to_type<float>();
  215. // Section 2.11.2: If the computed value of background-image on the root element is none and its background-color is transparent,
  216. // user agents must instead propagate the computed values of the background properties from that element’s first HTML BODY child element.
  217. if (document().html_element()->should_use_body_background_properties()) {
  218. background_layers = document().background_layers();
  219. background_color = document().background_color(context.palette());
  220. }
  221. } else {
  222. background_rect = absolute_padding_box_rect();
  223. }
  224. // HACK: If the Box has a border, use the bordered_rect to paint the background.
  225. // This way if we have a border-radius there will be no gap between the filling and actual border.
  226. if (computed_values().border_top().width || computed_values().border_right().width || computed_values().border_bottom().width || computed_values().border_left().width)
  227. background_rect = absolute_border_box_rect();
  228. Painting::paint_background(context, layout_box(), background_rect, background_color, computed_values().image_rendering(), background_layers, normalized_border_radii_data());
  229. }
  230. Vector<ShadowData> PaintableBox::resolve_box_shadow_data() const
  231. {
  232. auto box_shadow_data = computed_values().box_shadow();
  233. if (box_shadow_data.is_empty())
  234. return {};
  235. Vector<ShadowData> resolved_box_shadow_data;
  236. resolved_box_shadow_data.ensure_capacity(box_shadow_data.size());
  237. for (auto const& layer : box_shadow_data) {
  238. resolved_box_shadow_data.empend(
  239. layer.color,
  240. static_cast<int>(layer.offset_x.to_px(layout_box())),
  241. static_cast<int>(layer.offset_y.to_px(layout_box())),
  242. static_cast<int>(layer.blur_radius.to_px(layout_box())),
  243. static_cast<int>(layer.spread_distance.to_px(layout_box())),
  244. layer.placement == CSS::ShadowPlacement::Outer ? ShadowPlacement::Outer : ShadowPlacement::Inner);
  245. }
  246. return resolved_box_shadow_data;
  247. }
  248. void PaintableBox::paint_box_shadow(PaintContext& context) const
  249. {
  250. auto resolved_box_shadow_data = resolve_box_shadow_data();
  251. if (resolved_box_shadow_data.is_empty())
  252. return;
  253. Painting::paint_box_shadow(context, absolute_border_box_rect().to_rounded<int>(), normalized_border_radii_data(), resolved_box_shadow_data);
  254. }
  255. BorderRadiiData PaintableBox::normalized_border_radii_data(ShrinkRadiiForBorders shrink) const
  256. {
  257. auto border_radius_data = Painting::normalized_border_radii_data(layout_box(), absolute_border_box_rect(),
  258. computed_values().border_top_left_radius(),
  259. computed_values().border_top_right_radius(),
  260. computed_values().border_bottom_right_radius(),
  261. computed_values().border_bottom_left_radius());
  262. if (shrink == ShrinkRadiiForBorders::Yes)
  263. border_radius_data.shrink(computed_values().border_top().width, computed_values().border_right().width, computed_values().border_bottom().width, computed_values().border_left().width);
  264. return border_radius_data;
  265. }
  266. Optional<Gfx::IntRect> PaintableBox::clip_rect() const
  267. {
  268. if (!m_clip_rect.has_value()) {
  269. if (containing_block() && containing_block()->paint_box())
  270. m_clip_rect = containing_block()->paint_box()->clip_rect();
  271. auto overflow_x = computed_values().overflow_x();
  272. auto overflow_y = computed_values().overflow_y();
  273. if (overflow_x == CSS::Overflow::Hidden && overflow_y == CSS::Overflow::Hidden) {
  274. if (m_clip_rect.has_value()) {
  275. m_clip_rect->intersect(absolute_padding_box_rect().to_rounded<int>());
  276. } else {
  277. m_clip_rect = absolute_padding_box_rect().to_rounded<int>();
  278. }
  279. }
  280. }
  281. return m_clip_rect;
  282. }
  283. void PaintableBox::before_children_paint(PaintContext& context, PaintPhase phase) const
  284. {
  285. if (!AK::first_is_one_of(phase, PaintPhase::Background, PaintPhase::Border, PaintPhase::Foreground))
  286. return;
  287. // FIXME: Support more overflow variations.
  288. auto clip_rect = this->clip_rect();
  289. auto overflow_x = computed_values().overflow_x();
  290. auto overflow_y = computed_values().overflow_y();
  291. auto clip_overflow = [&] {
  292. if (!m_clipping_overflow) {
  293. context.painter().save();
  294. context.painter().add_clip_rect(*clip_rect);
  295. m_clipping_overflow = true;
  296. }
  297. };
  298. if (clip_rect.has_value()) {
  299. clip_overflow();
  300. }
  301. if (overflow_y == CSS::Overflow::Hidden || overflow_x == CSS::Overflow::Hidden) {
  302. auto border_radii_data = normalized_border_radii_data(ShrinkRadiiForBorders::Yes);
  303. if (border_radii_data.has_any_radius()) {
  304. auto corner_clipper = BorderRadiusCornerClipper::create(absolute_padding_box_rect().to_rounded<int>(), border_radii_data, CornerClip::Outside, BorderRadiusCornerClipper::UseCachedBitmap::No);
  305. if (corner_clipper.is_error()) {
  306. dbgln("Failed to create overflow border-radius corner clipper: {}", corner_clipper.error());
  307. return;
  308. }
  309. clip_overflow();
  310. m_overflow_corner_radius_clipper = corner_clipper.release_value();
  311. m_overflow_corner_radius_clipper->sample_under_corners(context.painter());
  312. }
  313. }
  314. }
  315. void PaintableBox::after_children_paint(PaintContext& context, PaintPhase phase) const
  316. {
  317. if (!AK::first_is_one_of(phase, PaintPhase::Background, PaintPhase::Border, PaintPhase::Foreground))
  318. return;
  319. // FIXME: Support more overflow variations.
  320. if (m_clipping_overflow) {
  321. context.painter().restore();
  322. m_clipping_overflow = false;
  323. }
  324. if (m_overflow_corner_radius_clipper.has_value()) {
  325. m_overflow_corner_radius_clipper->blit_corner_clipping(context.painter());
  326. m_overflow_corner_radius_clipper = {};
  327. }
  328. }
  329. static void paint_cursor_if_needed(PaintContext& context, Layout::TextNode const& text_node, Layout::LineBoxFragment const& fragment)
  330. {
  331. auto const& browsing_context = text_node.browsing_context();
  332. if (!browsing_context.is_focused_context())
  333. return;
  334. if (!browsing_context.cursor_blink_state())
  335. return;
  336. if (browsing_context.cursor_position().node() != &text_node.dom_node())
  337. return;
  338. // NOTE: This checks if the cursor is before the start or after the end of the fragment. If it is at the end, after all text, it should still be painted.
  339. if (browsing_context.cursor_position().offset() < (unsigned)fragment.start() || browsing_context.cursor_position().offset() > (unsigned)(fragment.start() + fragment.length()))
  340. return;
  341. if (!fragment.layout_node().dom_node() || !fragment.layout_node().dom_node()->is_editable())
  342. return;
  343. auto fragment_rect = fragment.absolute_rect();
  344. float cursor_x = fragment_rect.x() + text_node.font().width(fragment.text().substring_view(0, text_node.browsing_context().cursor_position().offset() - fragment.start()));
  345. float cursor_top = fragment_rect.top();
  346. float cursor_height = fragment_rect.height();
  347. Gfx::IntRect cursor_rect(cursor_x, cursor_top, 1, cursor_height);
  348. context.painter().draw_rect(cursor_rect, text_node.computed_values().color());
  349. }
  350. static void paint_text_decoration(Gfx::Painter& painter, Layout::Node const& text_node, Layout::LineBoxFragment const& fragment)
  351. {
  352. auto& font = fragment.layout_node().font();
  353. auto fragment_box = enclosing_int_rect(fragment.absolute_rect());
  354. auto glyph_height = font.pixel_size();
  355. auto baseline = fragment_box.height() / 2 - (glyph_height + 4) / 2 + glyph_height;
  356. auto line_color = text_node.computed_values().text_decoration_color();
  357. int line_thickness = [&] {
  358. CSS::Length computed_thickness = text_node.computed_values().text_decoration_thickness().resolved(text_node, CSS::Length(1, CSS::Length::Type::Em));
  359. if (computed_thickness.is_auto())
  360. return max(glyph_height * 0.1f, 1.f);
  361. return computed_thickness.to_px(text_node);
  362. }();
  363. auto text_decoration_lines = text_node.computed_values().text_decoration_line();
  364. for (auto line : text_decoration_lines) {
  365. Gfx::IntPoint line_start_point {};
  366. Gfx::IntPoint line_end_point {};
  367. switch (line) {
  368. case CSS::TextDecorationLine::None:
  369. return;
  370. case CSS::TextDecorationLine::Underline:
  371. line_start_point = fragment_box.top_left().translated(0, baseline + 2);
  372. line_end_point = fragment_box.top_right().translated(0, baseline + 2);
  373. break;
  374. case CSS::TextDecorationLine::Overline:
  375. line_start_point = fragment_box.top_left().translated(0, baseline - glyph_height);
  376. line_end_point = fragment_box.top_right().translated(0, baseline - glyph_height);
  377. break;
  378. case CSS::TextDecorationLine::LineThrough: {
  379. auto x_height = font.x_height();
  380. line_start_point = fragment_box.top_left().translated(0, baseline - x_height / 2);
  381. line_end_point = fragment_box.top_right().translated(0, baseline - x_height / 2);
  382. break;
  383. }
  384. case CSS::TextDecorationLine::Blink:
  385. // Conforming user agents may simply not blink the text
  386. return;
  387. }
  388. switch (text_node.computed_values().text_decoration_style()) {
  389. case CSS::TextDecorationStyle::Solid:
  390. painter.draw_line(line_start_point, line_end_point, line_color, line_thickness, Gfx::Painter::LineStyle::Solid);
  391. break;
  392. case CSS::TextDecorationStyle::Double:
  393. switch (line) {
  394. case CSS::TextDecorationLine::Underline:
  395. break;
  396. case CSS::TextDecorationLine::Overline:
  397. line_start_point.translate_by(0, -line_thickness - 1);
  398. line_end_point.translate_by(0, -line_thickness - 1);
  399. break;
  400. case CSS::TextDecorationLine::LineThrough:
  401. line_start_point.translate_by(0, -line_thickness / 2);
  402. line_end_point.translate_by(0, -line_thickness / 2);
  403. break;
  404. default:
  405. VERIFY_NOT_REACHED();
  406. }
  407. painter.draw_line(line_start_point, line_end_point, line_color, line_thickness);
  408. painter.draw_line(line_start_point.translated(0, line_thickness + 1), line_end_point.translated(0, line_thickness + 1), line_color, line_thickness);
  409. break;
  410. case CSS::TextDecorationStyle::Dashed:
  411. painter.draw_line(line_start_point, line_end_point, line_color, line_thickness, Gfx::Painter::LineStyle::Dashed);
  412. break;
  413. case CSS::TextDecorationStyle::Dotted:
  414. painter.draw_line(line_start_point, line_end_point, line_color, line_thickness, Gfx::Painter::LineStyle::Dotted);
  415. break;
  416. case CSS::TextDecorationStyle::Wavy:
  417. painter.draw_triangle_wave(line_start_point, line_end_point, line_color, line_thickness + 1, line_thickness);
  418. break;
  419. }
  420. }
  421. }
  422. static void paint_text_fragment(PaintContext& context, Layout::TextNode const& text_node, Layout::LineBoxFragment const& fragment, Painting::PaintPhase phase)
  423. {
  424. auto& painter = context.painter();
  425. if (phase == Painting::PaintPhase::Foreground) {
  426. auto fragment_absolute_rect = fragment.absolute_rect();
  427. if (text_node.document().inspected_node() == &text_node.dom_node())
  428. context.painter().draw_rect(enclosing_int_rect(fragment_absolute_rect), Color::Magenta);
  429. // FIXME: text-transform should be done already in layout, since uppercase glyphs may be wider than lowercase, etc.
  430. auto text = text_node.text_for_rendering();
  431. auto text_transform = text_node.computed_values().text_transform();
  432. if (text_transform == CSS::TextTransform::Uppercase)
  433. text = Unicode::to_unicode_uppercase_full(text_node.text_for_rendering());
  434. if (text_transform == CSS::TextTransform::Lowercase)
  435. text = Unicode::to_unicode_lowercase_full(text_node.text_for_rendering());
  436. Gfx::FloatPoint baseline_start { fragment_absolute_rect.x(), fragment_absolute_rect.y() + fragment.baseline() };
  437. Utf8View view { text.substring_view(fragment.start(), fragment.length()) };
  438. painter.draw_text_run(baseline_start, view, fragment.layout_node().font(), text_node.computed_values().color());
  439. auto selection_rect = fragment.selection_rect(text_node.font());
  440. if (!selection_rect.is_empty()) {
  441. painter.fill_rect(enclosing_int_rect(selection_rect), context.palette().selection());
  442. Gfx::PainterStateSaver saver(painter);
  443. painter.add_clip_rect(enclosing_int_rect(selection_rect));
  444. painter.draw_text_run(baseline_start, view, fragment.layout_node().font(), context.palette().selection_text());
  445. }
  446. paint_text_decoration(painter, text_node, fragment);
  447. paint_cursor_if_needed(context, text_node, fragment);
  448. }
  449. }
  450. void PaintableWithLines::paint(PaintContext& context, PaintPhase phase) const
  451. {
  452. if (!is_visible())
  453. return;
  454. PaintableBox::paint(context, phase);
  455. if (m_line_boxes.is_empty())
  456. return;
  457. bool should_clip_overflow = computed_values().overflow_x() != CSS::Overflow::Visible && computed_values().overflow_y() != CSS::Overflow::Visible;
  458. Optional<BorderRadiusCornerClipper> corner_clipper;
  459. if (should_clip_overflow) {
  460. context.painter().save();
  461. // FIXME: Handle overflow-x and overflow-y being different values.
  462. auto clip_box = absolute_padding_box_rect().to_rounded<int>();
  463. context.painter().add_clip_rect(clip_box);
  464. auto scroll_offset = static_cast<Layout::BlockContainer const&>(layout_box()).scroll_offset();
  465. context.painter().translate(-scroll_offset.to_type<int>());
  466. auto border_radii = normalized_border_radii_data(ShrinkRadiiForBorders::Yes);
  467. if (border_radii.has_any_radius()) {
  468. auto clipper = BorderRadiusCornerClipper::create(clip_box, border_radii);
  469. if (!clipper.is_error()) {
  470. corner_clipper = clipper.release_value();
  471. corner_clipper->sample_under_corners(context.painter());
  472. }
  473. }
  474. }
  475. // Text shadows
  476. // This is yet another loop, but done here because all shadows should appear under all text.
  477. // So, we paint the shadows before painting any text.
  478. // FIXME: Find a smarter way to do this?
  479. if (phase == PaintPhase::Foreground) {
  480. for (auto& line_box : m_line_boxes) {
  481. for (auto& fragment : line_box.fragments()) {
  482. if (is<Layout::TextNode>(fragment.layout_node())) {
  483. auto& text_shadow = fragment.layout_node().computed_values().text_shadow();
  484. if (!text_shadow.is_empty()) {
  485. Vector<ShadowData> resolved_shadow_data;
  486. resolved_shadow_data.ensure_capacity(text_shadow.size());
  487. for (auto const& layer : text_shadow) {
  488. resolved_shadow_data.empend(
  489. layer.color,
  490. static_cast<int>(layer.offset_x.to_px(layout_box())),
  491. static_cast<int>(layer.offset_y.to_px(layout_box())),
  492. static_cast<int>(layer.blur_radius.to_px(layout_box())),
  493. static_cast<int>(layer.spread_distance.to_px(layout_box())),
  494. ShadowPlacement::Outer);
  495. }
  496. context.painter().set_font(fragment.layout_node().font());
  497. Painting::paint_text_shadow(context, fragment, resolved_shadow_data);
  498. }
  499. }
  500. }
  501. }
  502. }
  503. for (auto& line_box : m_line_boxes) {
  504. for (auto& fragment : line_box.fragments()) {
  505. if (context.should_show_line_box_borders()) {
  506. auto fragment_absolute_rect = fragment.absolute_rect();
  507. context.painter().draw_rect(enclosing_int_rect(fragment_absolute_rect), Color::Green);
  508. context.painter().draw_line(
  509. fragment_absolute_rect.top_left().translated(0, fragment.baseline()).to_rounded<int>(),
  510. fragment_absolute_rect.top_right().translated(0, fragment.baseline()).to_rounded<int>(), Color::Red);
  511. }
  512. if (is<Layout::TextNode>(fragment.layout_node()))
  513. paint_text_fragment(context, static_cast<Layout::TextNode const&>(fragment.layout_node()), fragment, phase);
  514. }
  515. }
  516. if (should_clip_overflow) {
  517. context.painter().restore();
  518. if (corner_clipper.has_value())
  519. corner_clipper->blit_corner_clipping(context.painter());
  520. }
  521. // FIXME: Merge this loop with the above somehow..
  522. if (phase == PaintPhase::FocusOutline) {
  523. for (auto& line_box : m_line_boxes) {
  524. for (auto& fragment : line_box.fragments()) {
  525. auto* node = fragment.layout_node().dom_node();
  526. if (!node)
  527. continue;
  528. auto* parent = node->parent_element();
  529. if (!parent)
  530. continue;
  531. if (parent->is_focused()) {
  532. // FIXME: Implement this as `outline` using :focus-visible in the default UA stylesheet to make it possible to override/disable.
  533. auto focus_outline_rect = enclosing_int_rect(fragment.absolute_rect()).inflated(4, 4);
  534. context.painter().draw_focus_rect(focus_outline_rect, context.palette().focus_outline());
  535. }
  536. }
  537. }
  538. }
  539. }
  540. bool PaintableWithLines::handle_mousewheel(Badge<EventHandler>, Gfx::IntPoint const&, unsigned, unsigned, int wheel_delta_x, int wheel_delta_y)
  541. {
  542. if (!layout_box().is_scrollable())
  543. return false;
  544. auto new_offset = layout_box().scroll_offset();
  545. new_offset.translate_by(wheel_delta_x, wheel_delta_y);
  546. const_cast<Layout::BlockContainer&>(layout_box()).set_scroll_offset(new_offset);
  547. return true;
  548. }
  549. Layout::BlockContainer const& PaintableWithLines::layout_box() const
  550. {
  551. return static_cast<Layout::BlockContainer const&>(PaintableBox::layout_box());
  552. }
  553. Layout::BlockContainer& PaintableWithLines::layout_box()
  554. {
  555. return static_cast<Layout::BlockContainer&>(PaintableBox::layout_box());
  556. }
  557. void PaintableBox::set_stacking_context(NonnullOwnPtr<StackingContext> stacking_context)
  558. {
  559. m_stacking_context = move(stacking_context);
  560. }
  561. Optional<HitTestResult> PaintableBox::hit_test(Gfx::FloatPoint const& position, HitTestType type) const
  562. {
  563. if (!is_visible())
  564. return {};
  565. if (layout_box().is_initial_containing_block_box()) {
  566. const_cast<Layout::InitialContainingBlock&>(static_cast<Layout::InitialContainingBlock const&>(layout_box())).build_stacking_context_tree_if_needed();
  567. return stacking_context()->hit_test(position, type);
  568. }
  569. if (!absolute_border_box_rect().contains(position.x(), position.y()))
  570. return {};
  571. for (auto* child = first_child(); child; child = child->next_sibling()) {
  572. auto result = child->hit_test(position, type);
  573. if (!result.has_value())
  574. continue;
  575. if (!result->paintable->visible_for_hit_testing())
  576. continue;
  577. return result;
  578. }
  579. return HitTestResult { *this };
  580. }
  581. Optional<HitTestResult> PaintableWithLines::hit_test(Gfx::FloatPoint const& position, HitTestType type) const
  582. {
  583. if (!layout_box().children_are_inline())
  584. return PaintableBox::hit_test(position, type);
  585. Optional<HitTestResult> last_good_candidate;
  586. for (auto& line_box : m_line_boxes) {
  587. for (auto& fragment : line_box.fragments()) {
  588. if (is<Layout::Box>(fragment.layout_node()) && static_cast<Layout::Box const&>(fragment.layout_node()).paint_box()->stacking_context())
  589. continue;
  590. if (!fragment.layout_node().containing_block()) {
  591. dbgln("FIXME: PaintableWithLines::hit_test(): Missing containing block on {}", fragment.layout_node().debug_description());
  592. continue;
  593. }
  594. auto fragment_absolute_rect = fragment.absolute_rect();
  595. if (fragment_absolute_rect.contains(position)) {
  596. if (is<Layout::BlockContainer>(fragment.layout_node()) && fragment.layout_node().paintable())
  597. return fragment.layout_node().paintable()->hit_test(position, type);
  598. return HitTestResult { *fragment.layout_node().paintable(), fragment.text_index_at(position.x()) };
  599. }
  600. if (fragment_absolute_rect.top() <= position.y())
  601. last_good_candidate = HitTestResult { *fragment.layout_node().paintable(), fragment.text_index_at(position.x()) };
  602. }
  603. }
  604. if (type == HitTestType::TextCursor && last_good_candidate.has_value())
  605. return last_good_candidate;
  606. if (is_visible() && absolute_border_box_rect().contains(position.x(), position.y()))
  607. return HitTestResult { *this };
  608. return {};
  609. }
  610. }