RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-05-31 07:38:10 +00:00
Code Issues Activity Actions

LibWeb: Implement the canvas gradients

Browse source 
This gets:

- CanvasRenderingContext2D.createLinearGradient()
- CanvasRenderingContext2D.createConicGradient()
- CanvasRenderingContext2D.createRadialGradient()

Actually working as fill styles for paths and rectangles :^)
Getting them working for strokes is left as an exercise is
left as an exercise for the reader.
This commit is contained in:
MacDue 2023-01-19 19:10:00 +01:00 • committed by Andreas Kling
parent 24cb57ac88
commit 27a3e11f02
4 changed files with 26 additions and 38 deletions
Download patch file Download diff file Expand all files Collapse all files

30
Userland/Libraries/LibWeb/HTML/CanvasGradient.cpp
View file

@ -1,5 +1,6 @@
/*
* Copyright (c) 2022, Andreas Kling <kling@serenityos.org>
* Copyright (c) 2023, MacDue <macdue@dueutil.tech>
*
* SPDX-License-Identifier: BSD-2-Clause
*/
@ -13,35 +14,25 @@ namespace Web::HTML {
JS::NonnullGCPtr<CanvasGradient> CanvasGradient::create_radial(JS::Realm& realm, double x0, double y0, double r0, double x1, double y1, double r1)
{
(void)x0;
(void)y0;
(void)r0;
(void)x1;
(void)y1;
(void)r1;
return realm.heap().allocate<CanvasGradient>(realm, realm, Type::Radial);
auto radial_gradient = Gfx::CanvasRadialGradientPaintStyle::create(Gfx::FloatPoint { x0, y0 }, r0, Gfx::FloatPoint { x1, y1 }, r1);
return realm.heap().allocate<CanvasGradient>(realm, realm, *radial_gradient);
}
JS::NonnullGCPtr<CanvasGradient> CanvasGradient::create_linear(JS::Realm& realm, double x0, double y0, double x1, double y1)
{
(void)x0;
(void)y0;
(void)x1;
(void)y1;
return realm.heap().allocate<CanvasGradient>(realm, realm, Type::Linear);
auto linear_gradient = Gfx::CanvasLinearGradientPaintStyle::create(Gfx::FloatPoint { x0, y0 }, Gfx::FloatPoint { x1, y1 });
return realm.heap().allocate<CanvasGradient>(realm, realm, *linear_gradient);
}
JS::NonnullGCPtr<CanvasGradient> CanvasGradient::create_conic(JS::Realm& realm, double start_angle, double x, double y)
{
(void)start_angle;
(void)x;
(void)y;
return realm.heap().allocate<CanvasGradient>(realm, realm, Type::Conic);
auto conic_gradient = Gfx::CanvasConicGradientPaintStyle::create(Gfx::FloatPoint { x, y }, start_angle);
return realm.heap().allocate<CanvasGradient>(realm, realm, *conic_gradient);
}
CanvasGradient::CanvasGradient(JS::Realm& realm, Type type)
CanvasGradient::CanvasGradient(JS::Realm& realm, Gfx::GradientPaintStyle& gradient)
: PlatformObject(realm)
, m_type(type)
, m_gradient(gradient)
{
}
@ -68,12 +59,11 @@ WebIDL::ExceptionOr<void> CanvasGradient::add_color_stop(double offset, Deprecat
return WebIDL::SyntaxError::create(realm(), "Could not parse color for CanvasGradient");
// 4. Place a new stop on the gradient, at offset offset relative to the whole gradient, and with the color parsed color.
m_color_stops.append(ColorStop { offset, parsed_color.value() });
m_gradient->add_color_stop(offset, parsed_color.value());
// FIXME: If multiple stops are added at the same offset on a gradient, then they must be placed in the order added,
// with the first one closest to the start of the gradient, and each subsequent one infinitesimally further along
// towards the end point (in effect causing all but the first and last stop added at each point to be ignored).
quick_sort(m_color_stops, [](auto& a, auto& b) { return a.offset < b.offset; });
return {};
}