LibWeb: Make PaintContext aware of CSS and DevicePixels

Store the ratio between device and CSS pixels on the PaintContext, so
that it can convert between the two.

Co-authored-by: MacDue <macdue@dueutil.tech>

Userland/Libraries/LibWeb/Painting/PaintContext.cpp

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018-2022, Andreas Kling <kling@serenityos.org>
+ * Copyright (c) 2022, Sam Atkins <atkinssj@serenityos.org>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -8,9 +9,10 @@
 
 namespace Web {
 
-PaintContext::PaintContext(Gfx::Painter& painter, Palette const& palette)
+PaintContext::PaintContext(Gfx::Painter& painter, Palette const& palette, float device_pixels_per_css_pixel)
     : m_painter(painter)
     , m_palette(palette)
+    , m_device_pixels_per_css_pixel(device_pixels_per_css_pixel)
 {
 }
 
@@ -32,4 +34,76 @@ void PaintContext::clear_svg_context()
     m_svg_context.clear();
 }
 
+DevicePixels PaintContext::rounded_device_pixels(CSSPixels css_pixels) const
+{
+    return roundf(css_pixels.value() * m_device_pixels_per_css_pixel);
+}
+
+DevicePixels PaintContext::enclosing_device_pixels(CSSPixels css_pixels) const
+{
+    return ceilf(css_pixels.value() * m_device_pixels_per_css_pixel);
+}
+
+DevicePixels PaintContext::floored_device_pixels(CSSPixels css_pixels) const
+{
+    return floorf(css_pixels.value() * m_device_pixels_per_css_pixel);
+}
+
+DevicePixelPoint PaintContext::rounded_device_point(CSSPixelPoint point) const
+{
+    return {
+        roundf(point.x().value() * m_device_pixels_per_css_pixel),
+        roundf(point.y().value() * m_device_pixels_per_css_pixel)
+    };
+}
+
+DevicePixelRect PaintContext::enclosing_device_rect(CSSPixelRect rect) const
+{
+    return {
+        floorf(rect.x().value() * m_device_pixels_per_css_pixel),
+        floorf(rect.y().value() * m_device_pixels_per_css_pixel),
+        ceilf(rect.width().value() * m_device_pixels_per_css_pixel),
+        ceilf(rect.height().value() * m_device_pixels_per_css_pixel)
+    };
+}
+
+DevicePixelRect PaintContext::rounded_device_rect(CSSPixelRect rect) const
+{
+    return {
+        roundf(rect.x().value() * m_device_pixels_per_css_pixel),
+        roundf(rect.y().value() * m_device_pixels_per_css_pixel),
+        roundf(rect.width().value() * m_device_pixels_per_css_pixel),
+        roundf(rect.height().value() * m_device_pixels_per_css_pixel)
+    };
+}
+
+DevicePixelSize PaintContext::enclosing_device_size(CSSPixelSize size) const
+{
+    return {
+        ceilf(size.width().value() * m_device_pixels_per_css_pixel),
+        ceilf(size.height().value() * m_device_pixels_per_css_pixel)
+    };
+}
+
+DevicePixelSize PaintContext::rounded_device_size(CSSPixelSize size) const
+{
+    return {
+        roundf(size.width().value() * m_device_pixels_per_css_pixel),
+        roundf(size.height().value() * m_device_pixels_per_css_pixel)
+    };
+}
+
+CSSPixels PaintContext::scale_to_css_pixels(DevicePixels device_pixels) const
+{
+    return device_pixels.value() / m_device_pixels_per_css_pixel;
+}
+
+CSSPixelPoint PaintContext::scale_to_css_point(DevicePixelPoint point) const
+{
+    return {
+        scale_to_css_pixels(point.x()),
+        scale_to_css_pixels(point.y())
+    };
+}
+
 }

Userland/Libraries/LibWeb/Painting/PaintContext.h

@@ -1,5 +1,6 @@
 /*
  * Copyright (c) 2018-2022, Andreas Kling <kling@serenityos.org>
+ * Copyright (c) 2022, Sam Atkins <atkinssj@serenityos.org>
  *
  * SPDX-License-Identifier: BSD-2-Clause
  */
@@ -10,13 +11,14 @@
 #include <LibGfx/Forward.h>
 #include <LibGfx/Palette.h>
 #include <LibGfx/Rect.h>
+#include <LibWeb/PixelUnits.h>
 #include <LibWeb/SVG/SVGContext.h>
 
 namespace Web {
 
 class PaintContext {
 public:
-    PaintContext(Gfx::Painter& painter, Palette const& palette);
+    PaintContext(Gfx::Painter& painter, Palette const& palette, float device_pixels_per_css_pixel);
 
     Gfx::Painter& painter() const { return m_painter; }
     Palette const& palette() const { return m_palette; }
@@ -35,9 +37,20 @@ public:
     bool has_focus() const { return m_focus; }
     void set_has_focus(bool focus) { m_focus = focus; }
 
+    DevicePixels enclosing_device_pixels(CSSPixels css_pixels) const;
+    DevicePixels floored_device_pixels(CSSPixels css_pixels) const;
+    DevicePixels rounded_device_pixels(CSSPixels css_pixels) const;
+    DevicePixelPoint rounded_device_point(CSSPixelPoint) const;
+    DevicePixelRect enclosing_device_rect(CSSPixelRect) const;
+    DevicePixelRect rounded_device_rect(CSSPixelRect) const;
+    DevicePixelSize enclosing_device_size(CSSPixelSize) const;
+    DevicePixelSize rounded_device_size(CSSPixelSize) const;
+    CSSPixels scale_to_css_pixels(DevicePixels) const;
+    CSSPixelPoint scale_to_css_point(DevicePixelPoint) const;
+
     PaintContext clone(Gfx::Painter& painter) const
     {
-        auto clone = PaintContext(painter, m_palette);
+        auto clone = PaintContext(painter, m_palette, m_device_pixels_per_css_pixel);
         clone.m_viewport_rect = m_viewport_rect;
         clone.m_should_show_line_box_borders = m_should_show_line_box_borders;
         clone.m_focus = m_focus;
@@ -49,6 +62,7 @@ private:
     Gfx::Painter& m_painter;
     Palette m_palette;
     Optional<SVGContext> m_svg_context;
+    float m_device_pixels_per_css_pixel;
     Gfx::IntRect m_viewport_rect;
     bool m_should_show_line_box_borders { false };
     bool m_focus { false };

Userland/Services/WebContent/PageHost.cpp

@@ -118,7 +118,7 @@ void PageHost::paint(Web::DevicePixelRect const& content_rect, Gfx::Bitmap& targ
         return;
     }
 
-    Web::PaintContext context(painter, palette());
+    Web::PaintContext context(painter, palette(), device_pixels_per_css_pixel());
     context.set_should_show_line_box_borders(m_should_show_line_box_borders);
     context.set_viewport_rect(content_rect.to_type<int>());
     context.set_has_focus(m_has_focus);

Userland/Utilities/headless-browser.cpp

@@ -87,7 +87,7 @@ public:
             return;
         }
 
-        Web::PaintContext context(painter, palette());
+        Web::PaintContext context(painter, palette(), device_pixels_per_css_pixel());
         context.set_should_show_line_box_borders(false);
         context.set_viewport_rect(content_rect.to_type<int>());
         context.set_has_focus(true);