InlinePaintable.cpp 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256
  1. /*
  2. * Copyright (c) 2018-2022, Andreas Kling <kling@serenityos.org>
  3. *
  4. * SPDX-License-Identifier: BSD-2-Clause
  5. */
  6. #include <LibGfx/AntiAliasingPainter.h>
  7. #include <LibWeb/DOM/Document.h>
  8. #include <LibWeb/Layout/BlockContainer.h>
  9. #include <LibWeb/Painting/BackgroundPainting.h>
  10. #include <LibWeb/Painting/InlinePaintable.h>
  11. namespace Web::Painting {
  12. JS::NonnullGCPtr<InlinePaintable> InlinePaintable::create(Layout::InlineNode const& layout_node)
  13. {
  14. return layout_node.heap().allocate_without_realm<InlinePaintable>(layout_node);
  15. }
  16. InlinePaintable::InlinePaintable(Layout::InlineNode const& layout_node)
  17. : Paintable(layout_node)
  18. {
  19. }
  20. Layout::InlineNode const& InlinePaintable::layout_node() const
  21. {
  22. return static_cast<Layout::InlineNode const&>(Paintable::layout_node());
  23. }
  24. Optional<int> InlinePaintable::scroll_frame_id() const
  25. {
  26. if (m_enclosing_scroll_frame)
  27. return m_enclosing_scroll_frame->id;
  28. return {};
  29. }
  30. Optional<CSSPixelPoint> InlinePaintable::enclosing_scroll_frame_offset() const
  31. {
  32. if (m_enclosing_scroll_frame)
  33. return m_enclosing_scroll_frame->offset;
  34. return {};
  35. }
  36. Optional<CSSPixelRect> InlinePaintable::clip_rect() const
  37. {
  38. if (m_enclosing_clip_frame)
  39. return m_enclosing_clip_frame->rect();
  40. return {};
  41. }
  42. void InlinePaintable::before_paint(PaintContext& context, PaintPhase) const
  43. {
  44. if (scroll_frame_id().has_value()) {
  45. context.recording_painter().save();
  46. context.recording_painter().set_scroll_frame_id(scroll_frame_id().value());
  47. }
  48. if (clip_rect().has_value()) {
  49. context.recording_painter().save();
  50. context.recording_painter().add_clip_rect(context.enclosing_device_rect(*clip_rect()).to_type<int>());
  51. }
  52. }
  53. void InlinePaintable::after_paint(PaintContext& context, PaintPhase) const
  54. {
  55. if (clip_rect().has_value())
  56. context.recording_painter().restore();
  57. if (scroll_frame_id().has_value())
  58. context.recording_painter().restore();
  59. }
  60. void InlinePaintable::paint(PaintContext& context, PaintPhase phase) const
  61. {
  62. auto& painter = context.recording_painter();
  63. if (phase == PaintPhase::Background) {
  64. auto containing_block_position_in_absolute_coordinates = containing_block()->paintable_box()->absolute_position();
  65. for_each_fragment([&](auto const& fragment, bool is_first_fragment, bool is_last_fragment) {
  66. CSSPixelRect absolute_fragment_rect { containing_block_position_in_absolute_coordinates.translated(fragment.offset()), fragment.size() };
  67. if (is_first_fragment) {
  68. auto extra_start_width = box_model().padding.left;
  69. absolute_fragment_rect.translate_by(-extra_start_width, 0);
  70. absolute_fragment_rect.set_width(absolute_fragment_rect.width() + extra_start_width);
  71. }
  72. if (is_last_fragment) {
  73. auto extra_end_width = box_model().padding.right;
  74. absolute_fragment_rect.set_width(absolute_fragment_rect.width() + extra_end_width);
  75. }
  76. auto const& border_radii_data = fragment.border_radii_data();
  77. paint_background(context, layout_node(), absolute_fragment_rect, computed_values().background_color(), computed_values().image_rendering(), &computed_values().background_layers(), border_radii_data);
  78. if (!box_shadow_data().is_empty()) {
  79. auto borders_data = BordersData {
  80. .top = computed_values().border_top(),
  81. .right = computed_values().border_right(),
  82. .bottom = computed_values().border_bottom(),
  83. .left = computed_values().border_left(),
  84. };
  85. auto absolute_fragment_rect_bordered = absolute_fragment_rect.inflated(
  86. borders_data.top.width, borders_data.right.width,
  87. borders_data.bottom.width, borders_data.left.width);
  88. paint_box_shadow(context, absolute_fragment_rect_bordered, absolute_fragment_rect,
  89. borders_data, border_radii_data, box_shadow_data());
  90. }
  91. return IterationDecision::Continue;
  92. });
  93. }
  94. auto paint_border_or_outline = [&](Optional<BordersData> outline_data = {}, CSSPixels outline_offset = 0) {
  95. auto borders_data = BordersData {
  96. .top = computed_values().border_top(),
  97. .right = computed_values().border_right(),
  98. .bottom = computed_values().border_bottom(),
  99. .left = computed_values().border_left(),
  100. };
  101. auto containing_block_position_in_absolute_coordinates = containing_block()->paintable_box()->absolute_position();
  102. for_each_fragment([&](auto const& fragment, bool is_first_fragment, bool is_last_fragment) {
  103. CSSPixelRect absolute_fragment_rect { containing_block_position_in_absolute_coordinates.translated(fragment.offset()), fragment.size() };
  104. if (is_first_fragment) {
  105. auto extra_start_width = box_model().padding.left;
  106. absolute_fragment_rect.translate_by(-extra_start_width, 0);
  107. absolute_fragment_rect.set_width(absolute_fragment_rect.width() + extra_start_width);
  108. }
  109. if (is_last_fragment) {
  110. auto extra_end_width = box_model().padding.right;
  111. absolute_fragment_rect.set_width(absolute_fragment_rect.width() + extra_end_width);
  112. }
  113. auto borders_rect = absolute_fragment_rect.inflated(borders_data.top.width, borders_data.right.width, borders_data.bottom.width, borders_data.left.width);
  114. auto border_radii_data = fragment.border_radii_data();
  115. if (outline_data.has_value()) {
  116. auto outline_offset_x = outline_offset;
  117. auto outline_offset_y = outline_offset;
  118. // "Both the height and the width of the outside of the shape drawn by the outline should not
  119. // become smaller than twice the computed value of the outline-width property to make sure
  120. // that an outline can be rendered even with large negative values."
  121. // https://www.w3.org/TR/css-ui-4/#outline-offset
  122. // So, if the horizontal outline offset is > half the borders_rect's width then we set it to that.
  123. // (And the same for y)
  124. if ((borders_rect.width() / 2) + outline_offset_x < 0)
  125. outline_offset_x = -borders_rect.width() / 2;
  126. if ((borders_rect.height() / 2) + outline_offset_y < 0)
  127. outline_offset_y = -borders_rect.height() / 2;
  128. border_radii_data.inflate(outline_data->top.width + outline_offset_y, outline_data->right.width + outline_offset_x, outline_data->bottom.width + outline_offset_y, outline_data->left.width + outline_offset_x);
  129. borders_rect.inflate(outline_data->top.width + outline_offset_y, outline_data->right.width + outline_offset_x, outline_data->bottom.width + outline_offset_y, outline_data->left.width + outline_offset_x);
  130. context.recording_painter().paint_borders(context.rounded_device_rect(borders_rect), border_radii_data.as_corners(context), outline_data->to_device_pixels(context));
  131. } else {
  132. context.recording_painter().paint_borders(context.rounded_device_rect(borders_rect), border_radii_data.as_corners(context), borders_data.to_device_pixels(context));
  133. }
  134. return IterationDecision::Continue;
  135. });
  136. };
  137. if (phase == PaintPhase::Border) {
  138. paint_border_or_outline();
  139. }
  140. if (phase == PaintPhase::Outline) {
  141. auto maybe_outline_data = this->outline_data();
  142. if (maybe_outline_data.has_value())
  143. paint_border_or_outline(maybe_outline_data.value(), computed_values().outline_offset().to_px(layout_node()));
  144. }
  145. if (phase == PaintPhase::Foreground) {
  146. for_each_fragment([&](auto const& fragment, bool, bool) {
  147. if (is<Layout::TextNode>(fragment.layout_node()))
  148. paint_text_fragment(context, static_cast<Layout::TextNode const&>(fragment.layout_node()), fragment, phase);
  149. });
  150. }
  151. if (phase == PaintPhase::Overlay && layout_node().document().inspected_layout_node() == &layout_node()) {
  152. // FIXME: This paints a double-thick border between adjacent fragments, where ideally there
  153. // would be none. Once we implement non-rectangular outlines for the `outline` CSS
  154. // property, we can use that here instead.
  155. for_each_fragment([&](auto const& fragment, bool, bool) {
  156. painter.draw_rect(context.enclosing_device_rect(fragment.absolute_rect()).template to_type<int>(), Color::Magenta);
  157. return IterationDecision::Continue;
  158. });
  159. }
  160. }
  161. template<typename Callback>
  162. void InlinePaintable::for_each_fragment(Callback callback) const
  163. {
  164. for (size_t i = 0; i < m_fragments.size(); ++i) {
  165. auto const& fragment = m_fragments[i];
  166. callback(fragment, i == 0, i == m_fragments.size() - 1);
  167. }
  168. }
  169. TraversalDecision InlinePaintable::hit_test(CSSPixelPoint position, HitTestType type, Function<TraversalDecision(HitTestResult)> const& callback) const
  170. {
  171. if (m_clip_rect.has_value() && !m_clip_rect.value().contains(position))
  172. return TraversalDecision::Continue;
  173. auto position_adjusted_by_scroll_offset = position;
  174. if (enclosing_scroll_frame_offset().has_value())
  175. position_adjusted_by_scroll_offset.translate_by(-enclosing_scroll_frame_offset().value());
  176. for (auto const& fragment : m_fragments) {
  177. if (fragment.paintable().stacking_context())
  178. continue;
  179. auto fragment_absolute_rect = fragment.absolute_rect();
  180. if (fragment_absolute_rect.contains(position_adjusted_by_scroll_offset)) {
  181. if (fragment.paintable().hit_test(position, type, callback) == TraversalDecision::Break)
  182. return TraversalDecision::Break;
  183. auto hit_test_result = HitTestResult { const_cast<Paintable&>(fragment.paintable()), fragment.text_index_at(position_adjusted_by_scroll_offset.x()) };
  184. if (callback(hit_test_result) == TraversalDecision::Break)
  185. return TraversalDecision::Break;
  186. }
  187. }
  188. bool should_exit = false;
  189. for_each_child([&](Paintable const& child) {
  190. if (should_exit)
  191. return;
  192. if (child.stacking_context())
  193. return;
  194. if (child.hit_test(position, type, callback) == TraversalDecision::Break)
  195. should_exit = true;
  196. });
  197. if (should_exit)
  198. return TraversalDecision::Break;
  199. return TraversalDecision::Continue;
  200. }
  201. CSSPixelRect InlinePaintable::bounding_rect() const
  202. {
  203. CSSPixelRect bounding_rect;
  204. for_each_fragment([&](auto const& fragment, bool, bool) {
  205. auto fragment_absolute_rect = fragment.absolute_rect();
  206. bounding_rect = bounding_rect.united(fragment_absolute_rect);
  207. });
  208. if (bounding_rect.is_empty()) {
  209. // FIXME: This is adhoc, and we should return rect of empty fragment instead.
  210. auto containing_block_position_in_absolute_coordinates = containing_block()->paintable_box()->absolute_position();
  211. return { containing_block_position_in_absolute_coordinates, { 0, 0 } };
  212. }
  213. return bounding_rect;
  214. }
  215. }