ImagePaintable.cpp 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
  1. /*
  2. * Copyright (c) 2018-2023, Andreas Kling <kling@serenityos.org>
  3. *
  4. * SPDX-License-Identifier: BSD-2-Clause
  5. */
  6. #include <LibGfx/StylePainter.h>
  7. #include <LibWeb/CSS/StyleValues/EdgeStyleValue.h>
  8. #include <LibWeb/CSS/StyleValues/LengthStyleValue.h>
  9. #include <LibWeb/CSS/StyleValues/PositionStyleValue.h>
  10. #include <LibWeb/HTML/DecodedImageData.h>
  11. #include <LibWeb/HTML/HTMLImageElement.h>
  12. #include <LibWeb/HTML/ImageRequest.h>
  13. #include <LibWeb/Layout/ImageBox.h>
  14. #include <LibWeb/Painting/BorderRadiusCornerClipper.h>
  15. #include <LibWeb/Painting/ImagePaintable.h>
  16. #include <LibWeb/Platform/FontPlugin.h>
  17. namespace Web::Painting {
  18. JS::NonnullGCPtr<ImagePaintable> ImagePaintable::create(Layout::ImageBox const& layout_box)
  19. {
  20. return layout_box.heap().allocate_without_realm<ImagePaintable>(layout_box);
  21. }
  22. ImagePaintable::ImagePaintable(Layout::ImageBox const& layout_box)
  23. : PaintableBox(layout_box)
  24. {
  25. const_cast<DOM::Document&>(layout_box.document()).register_viewport_client(*this);
  26. }
  27. void ImagePaintable::finalize()
  28. {
  29. Base::finalize();
  30. // NOTE: We unregister from the document in finalize() to avoid trouble
  31. // in the scenario where our Document has already been swept by GC.
  32. document().unregister_viewport_client(*this);
  33. }
  34. Layout::ImageBox const& ImagePaintable::layout_box() const
  35. {
  36. return static_cast<Layout::ImageBox const&>(layout_node());
  37. }
  38. void ImagePaintable::paint(PaintContext& context, PaintPhase phase) const
  39. {
  40. if (!is_visible())
  41. return;
  42. PaintableBox::paint(context, phase);
  43. if (phase == PaintPhase::Foreground) {
  44. auto image_rect = context.rounded_device_rect(absolute_rect());
  45. if (layout_box().renders_as_alt_text()) {
  46. auto& image_element = verify_cast<HTML::HTMLImageElement>(*dom_node());
  47. auto enclosing_rect = context.enclosing_device_rect(absolute_rect()).to_type<int>();
  48. context.painter().set_font(Platform::FontPlugin::the().default_font());
  49. context.painter().paint_frame(enclosing_rect, context.palette(), Gfx::FrameStyle::SunkenContainer);
  50. auto alt = image_element.alt();
  51. if (alt.is_empty())
  52. alt = image_element.src();
  53. context.painter().draw_text(enclosing_rect, alt, Gfx::TextAlignment::Center, computed_values().color(), Gfx::TextElision::Right);
  54. } else if (auto bitmap = layout_box().image_provider().current_image_bitmap(image_rect.size().to_type<int>())) {
  55. ScopedCornerRadiusClip corner_clip { context, image_rect, normalized_border_radii_data(ShrinkRadiiForBorders::Yes) };
  56. auto image_int_rect = image_rect.to_type<int>();
  57. auto bitmap_rect = bitmap->rect();
  58. auto scaling_mode = to_gfx_scaling_mode(computed_values().image_rendering(), bitmap_rect, image_int_rect);
  59. auto& dom_element = verify_cast<DOM::Element>(*dom_node());
  60. auto object_fit = dom_element.computed_css_values()->object_fit();
  61. auto bitmap_aspect_ratio = (float)bitmap_rect.height() / bitmap_rect.width();
  62. auto image_aspect_ratio = (float)image_rect.height().value() / image_rect.width().value();
  63. auto scale_x = 0.0f;
  64. auto scale_y = 0.0f;
  65. Gfx::IntRect bitmap_intersect = bitmap_rect;
  66. auto object_fit_value = CSS::InitialValues::object_fit();
  67. if (object_fit.has_value())
  68. object_fit_value = object_fit.value();
  69. switch (object_fit_value) {
  70. case CSS::ObjectFit::Fill:
  71. scale_x = (float)image_int_rect.width() / bitmap_rect.width();
  72. scale_y = (float)image_int_rect.height() / bitmap_rect.height();
  73. break;
  74. case CSS::ObjectFit::Contain:
  75. if (bitmap_aspect_ratio >= image_aspect_ratio) {
  76. scale_x = (float)image_int_rect.height() / bitmap_rect.height();
  77. scale_y = scale_x;
  78. } else {
  79. scale_x = (float)image_int_rect.width() / bitmap_rect.width();
  80. scale_y = scale_x;
  81. }
  82. break;
  83. case CSS::ObjectFit::Cover:
  84. if (bitmap_aspect_ratio >= image_aspect_ratio) {
  85. scale_x = (float)image_int_rect.width() / bitmap_rect.width();
  86. scale_y = scale_x;
  87. bitmap_intersect.set_height(bitmap_rect.width() * image_aspect_ratio);
  88. } else {
  89. scale_x = (float)image_int_rect.height() / bitmap_rect.height();
  90. scale_y = scale_x;
  91. bitmap_intersect.set_width(bitmap_rect.height() / image_aspect_ratio);
  92. }
  93. break;
  94. case CSS::ObjectFit::ScaleDown:
  95. // FIXME: Implement
  96. case CSS::ObjectFit::None:
  97. scale_x = 1;
  98. scale_y = 1;
  99. bitmap_intersect.set_size(image_int_rect.size());
  100. }
  101. auto scaled_bitmap_width = bitmap_rect.width() * scale_x;
  102. auto scaled_bitmap_height = bitmap_rect.height() * scale_y;
  103. auto residual_horizontal = image_int_rect.width() - scaled_bitmap_width;
  104. auto residual_vertical = image_int_rect.height() - scaled_bitmap_height;
  105. bitmap_intersect.set_x((bitmap_rect.width() - bitmap_intersect.width()) / 2);
  106. bitmap_intersect.set_y((bitmap_rect.height() - bitmap_intersect.height()) / 2);
  107. CSS::PositionStyleValue const& object_position = dom_element.computed_css_values()->object_position();
  108. auto offset_x = 0;
  109. auto const& horizontal = object_position.edge_x();
  110. if (horizontal->is_edge()) {
  111. auto const& horizontal_edge = horizontal->as_edge();
  112. auto const& offset = horizontal_edge.offset();
  113. if (horizontal_edge.edge() == CSS::PositionEdge::Left) {
  114. if (offset.is_percentage())
  115. offset_x = (double)(residual_horizontal)*offset.percentage().as_fraction();
  116. else
  117. offset_x = offset.length().to_px(layout_node()).to_int();
  118. bitmap_intersect.set_x(0);
  119. } else if (horizontal_edge.edge() == CSS::PositionEdge::Right) {
  120. if (offset.is_percentage())
  121. offset_x = (double)residual_horizontal - (double)(residual_horizontal)*offset.percentage().as_fraction();
  122. else
  123. offset_x = residual_horizontal - offset.length().to_px(layout_node()).to_int();
  124. if (image_int_rect.width() < scaled_bitmap_width)
  125. bitmap_intersect.set_x(-(offset_x / scale_x));
  126. }
  127. }
  128. auto offset_y = 0;
  129. auto const& vertical = object_position.edge_y();
  130. if (vertical->is_edge()) {
  131. auto const& vertical_edge = vertical->as_edge();
  132. auto const& offset = vertical_edge.offset();
  133. if (vertical_edge.edge() == CSS::PositionEdge::Top) {
  134. if (offset.is_percentage())
  135. offset_y = (double)(residual_vertical)*offset.percentage().as_fraction();
  136. else
  137. offset_y = offset.length().to_px(layout_node()).to_int();
  138. bitmap_intersect.set_y(0);
  139. } else if (vertical_edge.edge() == CSS::PositionEdge::Bottom) {
  140. if (offset.is_percentage())
  141. offset_y = (double)residual_vertical - (double)(residual_vertical)*offset.percentage().as_fraction();
  142. else
  143. offset_y = residual_vertical - offset.length().to_px(layout_node()).to_int();
  144. if (image_int_rect.height() < scaled_bitmap_height)
  145. bitmap_intersect.set_y(-(offset_y / scale_y));
  146. }
  147. }
  148. Gfx::IntRect draw_rect = {
  149. image_int_rect.x() + offset_x,
  150. image_int_rect.y() + offset_y,
  151. (int)scaled_bitmap_width,
  152. (int)scaled_bitmap_height
  153. };
  154. context.painter().draw_scaled_bitmap(draw_rect.intersected(image_int_rect), *bitmap, bitmap_rect.intersected(bitmap_intersect), 1.f, scaling_mode);
  155. }
  156. }
  157. }
  158. void ImagePaintable::did_set_viewport_rect(CSSPixelRect const& viewport_rect)
  159. {
  160. const_cast<Layout::ImageProvider&>(layout_box().image_provider()).set_visible_in_viewport(viewport_rect.intersects(absolute_rect()));
  161. }
  162. }