LibWeb: Implement CRC2D.imageSmoothingEnabled

We now select between nearest neighbor and bilinear filtering when
scaling images in CRC2D.drawImage().

This patch also adds CRC2D.imageSmoothingQuality but it's ignored for
now as we don't have a bunch of different quality levels to map it to.

Work towards #17993 (Ruffle Flash Player)

Userland/Libraries/LibWeb/Forward.h

@@ -530,6 +530,7 @@ enum class CanPlayTypeResult;
 enum class CanvasFillRule;
 enum class EndingType;
 enum class DOMParserSupportedType;
+enum class ImageSmoothingQuality;
 enum class ReferrerPolicy;
 enum class RequestDestination;
 enum class RequestMode;

Userland/Libraries/LibWeb/HTML/Canvas/CanvasImageSmoothing.h

@@ -0,0 +1,27 @@
+/*
+ * Copyright (c) 2023, Andreas Kling <kling@serenityos.org>
+ *
+ * SPDX-License-Identifier: BSD-2-Clause
+ */
+
+#pragma once
+
+#include <LibWeb/HTML/ImageData.h>
+
+namespace Web::HTML {
+
+// https://html.spec.whatwg.org/multipage/canvas.html#canvasimagesmoothing
+class CanvasImageSmoothing {
+public:
+    virtual ~CanvasImageSmoothing() = default;
+
+    virtual bool image_smoothing_enabled() const = 0;
+    virtual void set_image_smoothing_enabled(bool) = 0;
+    virtual Bindings::ImageSmoothingQuality image_smoothing_quality() const = 0;
+    virtual void set_image_smoothing_quality(Bindings::ImageSmoothingQuality) = 0;
+
+protected:
+    CanvasImageSmoothing() = default;
+};
+
+}

Userland/Libraries/LibWeb/HTML/Canvas/CanvasImageSmoothing.idl

@@ -0,0 +1,6 @@
+// https://html.spec.whatwg.org/multipage/canvas.html#canvasimagesmoothing
+interface mixin CanvasImageSmoothing {
+    // image smoothing
+    attribute boolean imageSmoothingEnabled; // (default true)
+    attribute ImageSmoothingQuality imageSmoothingQuality; // (default low)
+};

Userland/Libraries/LibWeb/HTML/Canvas/CanvasState.h

@@ -12,6 +12,7 @@
 #include <LibGfx/AffineTransform.h>
 #include <LibGfx/Color.h>
 #include <LibGfx/PaintStyle.h>
+#include <LibWeb/Bindings/CanvasRenderingContext2DPrototype.h>
 #include <LibWeb/HTML/CanvasGradient.h>
 #include <LibWeb/HTML/CanvasPattern.h>
 
@@ -74,6 +75,8 @@ public:
         FillOrStrokeStyle fill_style { Gfx::Color::Black };
         FillOrStrokeStyle stroke_style { Gfx::Color::Black };
         float line_width { 1 };
+        bool image_smoothing_enabled { true };
+        Bindings::ImageSmoothingQuality image_smoothing_quality { Bindings::ImageSmoothingQuality::Low };
     };
     DrawingState& drawing_state() { return m_drawing_state; }
     DrawingState const& drawing_state() const { return m_drawing_state; }

Userland/Libraries/LibWeb/HTML/CanvasRenderingContext2D.cpp

@@ -11,6 +11,7 @@
 #include <LibGfx/Quad.h>
 #include <LibGfx/Rect.h>
 #include <LibUnicode/Segmentation.h>
+#include <LibWeb/Bindings/CanvasRenderingContext2DPrototype.h>
 #include <LibWeb/Bindings/Intrinsics.h>
 #include <LibWeb/HTML/CanvasRenderingContext2D.h>
 #include <LibWeb/HTML/HTMLCanvasElement.h>
@@ -173,7 +174,12 @@ WebIDL::ExceptionOr<void> CanvasRenderingContext2D::draw_image_internal(CanvasIm
     if (!painter)
         return {};
 
-    painter->draw_scaled_bitmap_with_transform(destination_rect.to_rounded<int>(), *bitmap, source_rect, drawing_state().transform, 1.0f, Gfx::Painter::ScalingMode::BilinearBlend);
+    auto scaling_mode = Gfx::Painter::ScalingMode::NearestNeighbor;
+    if (drawing_state().image_smoothing_enabled) {
+        // FIXME: Honor drawing_state().image_smoothing_quality
+        scaling_mode = Gfx::Painter::ScalingMode::BilinearBlend;
+    }
+    painter->draw_scaled_bitmap_with_transform(destination_rect.to_rounded<int>(), *bitmap, source_rect, drawing_state().transform, 1.0f, scaling_mode);
 
     // 7. If image is not origin-clean, then set the CanvasRenderingContext2D's origin-clean flag to false.
     if (image_is_not_origin_clean(image))
@@ -560,4 +566,24 @@ bool image_is_not_origin_clean(CanvasImageSource const& image)
         });
 }
 
+bool CanvasRenderingContext2D::image_smoothing_enabled() const
+{
+    return drawing_state().image_smoothing_enabled;
+}
+
+void CanvasRenderingContext2D::set_image_smoothing_enabled(bool enabled)
+{
+    drawing_state().image_smoothing_enabled = enabled;
+}
+
+Bindings::ImageSmoothingQuality CanvasRenderingContext2D::image_smoothing_quality() const
+{
+    return drawing_state().image_smoothing_quality;
+}
+
+void CanvasRenderingContext2D::set_image_smoothing_quality(Bindings::ImageSmoothingQuality quality)
+{
+    drawing_state().image_smoothing_quality = quality;
+}
+
 }

Userland/Libraries/LibWeb/HTML/CanvasRenderingContext2D.h

@@ -20,6 +20,7 @@
 #include <LibWeb/HTML/Canvas/CanvasDrawPath.h>
 #include <LibWeb/HTML/Canvas/CanvasFillStrokeStyles.h>
 #include <LibWeb/HTML/Canvas/CanvasImageData.h>
+#include <LibWeb/HTML/Canvas/CanvasImageSmoothing.h>
 #include <LibWeb/HTML/Canvas/CanvasPath.h>
 #include <LibWeb/HTML/Canvas/CanvasPathDrawingStyles.h>
 #include <LibWeb/HTML/Canvas/CanvasRect.h>
@@ -48,6 +49,7 @@ class CanvasRenderingContext2D
     , public CanvasText
     , public CanvasDrawImage
     , public CanvasImageData
+    , public CanvasImageSmoothing
     , public CanvasPathDrawingStyles<CanvasRenderingContext2D> {
 
     WEB_PLATFORM_OBJECT(CanvasRenderingContext2D, Bindings::PlatformObject);
@@ -84,6 +86,11 @@ public:
 
     virtual void clip() override;
 
+    virtual bool image_smoothing_enabled() const override;
+    virtual void set_image_smoothing_enabled(bool) override;
+    virtual Bindings::ImageSmoothingQuality image_smoothing_quality() const override;
+    virtual void set_image_smoothing_quality(Bindings::ImageSmoothingQuality) override;
+
 private:
     explicit CanvasRenderingContext2D(JS::Realm&, HTMLCanvasElement&);
 

Userland/Libraries/LibWeb/HTML/CanvasRenderingContext2D.idl

@@ -3,6 +3,7 @@
 #import <HTML/Canvas/CanvasDrawPath.idl>
 #import <HTML/Canvas/CanvasFillStrokeStyles.idl>
 #import <HTML/Canvas/CanvasImageData.idl>
+#import <HTML/Canvas/CanvasImageSmoothing.idl>
 #import <HTML/Canvas/CanvasPath.idl>
 #import <HTML/Canvas/CanvasPathDrawingStyles.idl>
 #import <HTML/Canvas/CanvasRect.idl>
@@ -10,6 +11,8 @@
 #import <HTML/Canvas/CanvasText.idl>
 #import <HTML/Canvas/CanvasTransform.idl>
 
+enum ImageSmoothingQuality { "low", "medium", "high" };
+
 // https://html.spec.whatwg.org/multipage/canvas.html#canvasrenderingcontext2d
 [Exposed=Window]
 interface CanvasRenderingContext2D {
@@ -19,7 +22,7 @@ interface CanvasRenderingContext2D {
 CanvasRenderingContext2D includes CanvasState;
 CanvasRenderingContext2D includes CanvasTransform;
 // FIXME: CanvasRenderingContext2D includes CanvasCompositing;
-// FIXME: CanvasRenderingContext2D includes CanvasImageSmoothing;
+CanvasRenderingContext2D includes CanvasImageSmoothing;
 CanvasRenderingContext2D includes CanvasFillStrokeStyles;
 // FIXME: CanvasRenderingContext2D includes CanvasShadowStyles;
 // FIXME: CanvasRenderingContext2D includes CanvasFilters;