diff --git a/Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp b/Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp index 64a4722d44..ed3083f80e 100644 --- a/Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp +++ b/Userland/Libraries/LibWeb/Painting/BackgroundPainting.cpp @@ -18,18 +18,18 @@ namespace Web::Painting { // https://www.w3.org/TR/css-backgrounds-3/#backgrounds -void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMetrics const& layout_node, Gfx::FloatRect const& border_rect, Color background_color, CSS::ImageRendering image_rendering, Vector const* background_layers, BorderRadiiData const& border_radii) +void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMetrics const& layout_node, CSSPixelRect const& border_rect, Color background_color, CSS::ImageRendering image_rendering, Vector const* background_layers, BorderRadiiData const& border_radii) { auto& painter = context.painter(); struct BackgroundBox { - Gfx::FloatRect rect; + CSSPixelRect rect; BorderRadiiData radii; - inline void shrink(float top, float right, float bottom, float left) + inline void shrink(CSSPixels top, CSSPixels right, CSSPixels bottom, CSSPixels left) { rect.shrink(top, right, bottom, left); - radii.shrink(top, right, bottom, left); + radii.shrink(top.value(), right.value(), bottom.value(), left.value()); } }; @@ -76,7 +76,7 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet } Gfx::AntiAliasingPainter aa_painter { painter }; - aa_painter.fill_rect_with_rounded_corners(color_box.rect.to_rounded(), + aa_painter.fill_rect_with_rounded_corners(context.rounded_device_rect(color_box.rect).to_type(), background_color, color_box.radii.top_left.as_corner(), color_box.radii.top_right.as_corner(), color_box.radii.bottom_right.as_corner(), color_box.radii.bottom_left.as_corner()); if (!has_paintable_layers) @@ -111,9 +111,10 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet // Clip auto clip_box = get_box(layer.clip); - auto clip_rect = clip_box.rect.to_rounded(); - painter.add_clip_rect(clip_rect); - ScopedCornerRadiusClip corner_clip { painter, clip_rect, clip_box.radii }; + CSSPixelRect const& css_clip_rect = clip_box.rect; + auto clip_rect = context.rounded_device_rect(css_clip_rect); + painter.add_clip_rect(clip_rect.to_type()); + ScopedCornerRadiusClip corner_clip { painter, clip_rect.to_type(), clip_box.radii }; if (layer.clip == CSS::BackgroundBox::BorderBox) { // Shrink the effective clip rect if to account for the bits the borders will definitely paint over @@ -122,12 +123,12 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet } auto& image = *layer.background_image; - Gfx::FloatRect background_positioning_area; + CSSPixelRect background_positioning_area; // Attachment and Origin switch (layer.attachment) { case CSS::BackgroundAttachment::Fixed: - background_positioning_area = layout_node.root().browsing_context().viewport_rect().to_type(); + background_positioning_area = layout_node.root().browsing_context().viewport_rect().to_type(); break; case CSS::BackgroundAttachment::Local: case CSS::BackgroundAttachment::Scroll: @@ -136,33 +137,33 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet } // FIXME: Implement proper default sizing algorithm: https://drafts.csswg.org/css-images/#default-sizing - auto natural_image_width = image.natural_width().value_or(background_positioning_area.width()); - auto natural_image_height = image.natural_height().value_or(background_positioning_area.height()); + CSSPixels natural_image_width = image.natural_width().value_or(background_positioning_area.width().value()); + CSSPixels natural_image_height = image.natural_height().value_or(background_positioning_area.height().value()); // If any of these are zero, the NaNs will pop up in the painting code. if (background_positioning_area.is_empty() || natural_image_height <= 0 || natural_image_width <= 0) continue; // Size - Gfx::FloatRect image_rect; + CSSPixelRect image_rect; switch (layer.size_type) { case CSS::BackgroundSize::Contain: { - float max_width_ratio = background_positioning_area.width() / natural_image_width; - float max_height_ratio = background_positioning_area.height() / natural_image_height; + float max_width_ratio = (background_positioning_area.width() / natural_image_width).value(); + float max_height_ratio = (background_positioning_area.height() / natural_image_height).value(); float ratio = min(max_width_ratio, max_height_ratio); image_rect.set_size(natural_image_width * ratio, natural_image_height * ratio); break; } case CSS::BackgroundSize::Cover: { - float max_width_ratio = background_positioning_area.width() / natural_image_width; - float max_height_ratio = background_positioning_area.height() / natural_image_height; + float max_width_ratio = (background_positioning_area.width() / natural_image_width).value(); + float max_height_ratio = (background_positioning_area.height() / natural_image_height).value(); float ratio = max(max_width_ratio, max_height_ratio); image_rect.set_size(natural_image_width * ratio, natural_image_height * ratio); break; } case CSS::BackgroundSize::LengthPercentage: { - float width; - float height; + CSSPixels width; + CSSPixels height; bool x_is_auto = layer.size_x.is_auto(); bool y_is_auto = layer.size_y.is_auto(); if (x_is_auto && y_is_auto) { @@ -197,10 +198,10 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet // where round() is a function that returns the nearest natural number // (integer greater than zero). if (layer.repeat_x == CSS::Repeat::Round) { - image_rect.set_width(background_positioning_area.width() / roundf(background_positioning_area.width() / image_rect.width())); + image_rect.set_width(background_positioning_area.width() / round(background_positioning_area.width() / image_rect.width())); } if (layer.repeat_y == CSS::Repeat::Round) { - image_rect.set_height(background_positioning_area.height() / roundf(background_positioning_area.height() / image_rect.height())); + image_rect.set_height(background_positioning_area.height() / round(background_positioning_area.height() / image_rect.height())); } // If background-repeat is round for one dimension only and if background-size is auto @@ -216,18 +217,18 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet } } - float space_x = background_positioning_area.width() - image_rect.width(); - float space_y = background_positioning_area.height() - image_rect.height(); + CSSPixels space_x = background_positioning_area.width() - image_rect.width(); + CSSPixels space_y = background_positioning_area.height() - image_rect.height(); // Position - float offset_x = layer.position_offset_x.resolved(layout_node, CSS::Length::make_px(space_x)).to_px(layout_node); + CSSPixels offset_x = layer.position_offset_x.resolved(layout_node, CSS::Length::make_px(space_x)).to_px(layout_node); if (layer.position_edge_x == CSS::PositionEdge::Right) { image_rect.set_right_without_resize(background_positioning_area.right() - offset_x); } else { image_rect.set_left(background_positioning_area.left() + offset_x); } - float offset_y = layer.position_offset_y.resolved(layout_node, CSS::Length::make_px(space_y)).to_px(layout_node); + CSSPixels offset_y = layer.position_offset_y.resolved(layout_node, CSS::Length::make_px(space_y)).to_px(layout_node); if (layer.position_edge_y == CSS::PositionEdge::Bottom) { image_rect.set_bottom_without_resize(background_positioning_area.bottom() - offset_y); } else { @@ -237,8 +238,8 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet // Repetition bool repeat_x = false; bool repeat_y = false; - float x_step = 0; - float y_step = 0; + CSSPixels x_step = 0; + CSSPixels y_step = 0; switch (layer.repeat_x) { case CSS::Repeat::Round: @@ -246,13 +247,13 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet repeat_x = true; break; case CSS::Repeat::Space: { - int whole_images = background_positioning_area.width() / image_rect.width(); + int whole_images = (background_positioning_area.width() / image_rect.width()).value(); if (whole_images <= 1) { x_step = image_rect.width(); repeat_x = false; } else { - float space = fmodf(background_positioning_area.width(), image_rect.width()); - x_step = image_rect.width() + ((float)space / (float)(whole_images - 1)); + auto space = fmod(background_positioning_area.width(), image_rect.width()); + x_step = image_rect.width() + (space / (float)(whole_images - 1)); repeat_x = true; } break; @@ -266,8 +267,8 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet break; } // Move image_rect to the left-most tile position that is still visible - if (repeat_x && image_rect.x() > clip_rect.x()) { - auto x_delta = floorf(x_step * ceilf((image_rect.x() - clip_rect.x()) / x_step)); + if (repeat_x && image_rect.x() > css_clip_rect.x()) { + auto x_delta = floor(x_step * ceil((image_rect.x() - css_clip_rect.x()) / x_step)); image_rect.set_x(image_rect.x() - x_delta); } @@ -277,12 +278,12 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet repeat_y = true; break; case CSS::Repeat::Space: { - int whole_images = background_positioning_area.height() / image_rect.height(); + int whole_images = (background_positioning_area.height() / image_rect.height()).value(); if (whole_images <= 1) { y_step = image_rect.height(); repeat_y = false; } else { - float space = fmodf(background_positioning_area.height(), image_rect.height()); + auto space = fmod(background_positioning_area.height(), image_rect.height()); y_step = image_rect.height() + ((float)space / (float)(whole_images - 1)); repeat_y = true; } @@ -297,27 +298,27 @@ void paint_background(PaintContext& context, Layout::NodeWithStyleAndBoxModelMet break; } // Move image_rect to the top-most tile position that is still visible - if (repeat_y && image_rect.y() > clip_rect.y()) { - auto y_delta = floorf(y_step * ceilf((image_rect.y() - clip_rect.y()) / y_step)); + if (repeat_y && image_rect.y() > css_clip_rect.y()) { + auto y_delta = floor(y_step * ceil((image_rect.y() - css_clip_rect.y()) / y_step)); image_rect.set_y(image_rect.y() - y_delta); } - float initial_image_x = image_rect.x(); - float image_y = image_rect.y(); - Optional last_int_image_rect; + CSSPixels initial_image_x = image_rect.x(); + CSSPixels image_y = image_rect.y(); + Optional last_image_device_rect; - image.resolve_for_size(layout_node, image_rect.size()); + image.resolve_for_size(layout_node, image_rect.size().to_type()); - while (image_y < clip_rect.bottom()) { + while (image_y < css_clip_rect.bottom()) { image_rect.set_y(image_y); - float image_x = initial_image_x; - while (image_x < clip_rect.right()) { + auto image_x = initial_image_x; + while (image_x < css_clip_rect.right()) { image_rect.set_x(image_x); - auto int_image_rect = image_rect.to_rounded(); - if (int_image_rect != last_int_image_rect && int_image_rect.intersects(context.device_viewport_rect().to_type())) - image.paint(context, int_image_rect, image_rendering); - last_int_image_rect = int_image_rect; + auto image_device_rect = context.rounded_device_rect(image_rect); + if (image_device_rect != last_image_device_rect && image_device_rect.intersects(context.device_viewport_rect())) + image.paint(context, image_device_rect.to_type(), image_rendering); + last_image_device_rect = image_device_rect; if (!repeat_x) break; image_x += x_step; diff --git a/Userland/Libraries/LibWeb/Painting/BackgroundPainting.h b/Userland/Libraries/LibWeb/Painting/BackgroundPainting.h index cdd0e8af4e..32c5fbad40 100644 --- a/Userland/Libraries/LibWeb/Painting/BackgroundPainting.h +++ b/Userland/Libraries/LibWeb/Painting/BackgroundPainting.h @@ -1,18 +1,17 @@ /* - * Copyright (c) 2021, Sam Atkins + * Copyright (c) 2021-2022, Sam Atkins * * SPDX-License-Identifier: BSD-2-Clause */ #pragma once -#include #include #include #include namespace Web::Painting { -void paint_background(PaintContext&, Layout::NodeWithStyleAndBoxModelMetrics const&, Gfx::FloatRect const&, Color background_color, CSS::ImageRendering, Vector const*, BorderRadiiData const&); +void paint_background(PaintContext&, Layout::NodeWithStyleAndBoxModelMetrics const&, CSSPixelRect const&, Color background_color, CSS::ImageRendering, Vector const*, BorderRadiiData const&); } diff --git a/Userland/Libraries/LibWeb/Painting/InlinePaintable.cpp b/Userland/Libraries/LibWeb/Painting/InlinePaintable.cpp index 32d27f7744..305ea28a83 100644 --- a/Userland/Libraries/LibWeb/Painting/InlinePaintable.cpp +++ b/Userland/Libraries/LibWeb/Painting/InlinePaintable.cpp @@ -55,7 +55,7 @@ void InlinePaintable::paint(PaintContext& context, Painting::PaintPhase phase) c } auto border_radii_data = Painting::normalized_border_radii_data(layout_node(), absolute_fragment_rect, top_left_border_radius, top_right_border_radius, bottom_right_border_radius, bottom_left_border_radius); - Painting::paint_background(context, layout_node(), absolute_fragment_rect, computed_values().background_color(), computed_values().image_rendering(), &computed_values().background_layers(), border_radii_data); + Painting::paint_background(context, layout_node(), absolute_fragment_rect.to_type(), computed_values().background_color(), computed_values().image_rendering(), &computed_values().background_layers(), border_radii_data); if (auto computed_box_shadow = computed_values().box_shadow(); !computed_box_shadow.is_empty()) { Vector resolved_box_shadow_data; diff --git a/Userland/Libraries/LibWeb/Painting/PaintableBox.cpp b/Userland/Libraries/LibWeb/Painting/PaintableBox.cpp index 677c50eb16..46cb3b51fc 100644 --- a/Userland/Libraries/LibWeb/Painting/PaintableBox.cpp +++ b/Userland/Libraries/LibWeb/Painting/PaintableBox.cpp @@ -243,13 +243,13 @@ void PaintableBox::paint_background(PaintContext& context) const if (layout_box().is_body() && document().html_element()->should_use_body_background_properties()) return; - Gfx::FloatRect background_rect; + CSSPixelRect background_rect; Color background_color = computed_values().background_color(); auto* background_layers = &computed_values().background_layers(); if (layout_box().is_root_element()) { // CSS 2.1 Appendix E.2: If the element is a root element, paint the background over the entire canvas. - background_rect = context.device_viewport_rect().to_type().to_type(); + background_rect = context.css_viewport_rect(); // Section 2.11.2: If the computed value of background-image on the root element is none and its background-color is transparent, // user agents must instead propagate the computed values of the background properties from that element’s first HTML BODY child element. @@ -258,13 +258,13 @@ void PaintableBox::paint_background(PaintContext& context) const background_color = document().background_color(context.palette()); } } else { - background_rect = absolute_padding_box_rect(); + background_rect = absolute_padding_box_rect().to_type(); } // HACK: If the Box has a border, use the bordered_rect to paint the background. // This way if we have a border-radius there will be no gap between the filling and actual border. if (computed_values().border_top().width || computed_values().border_right().width || computed_values().border_bottom().width || computed_values().border_left().width) - background_rect = absolute_border_box_rect(); + background_rect = absolute_border_box_rect().to_type(); Painting::paint_background(context, layout_box(), background_rect, background_color, computed_values().image_rendering(), background_layers, normalized_border_radii_data()); }