Serenity Operating System
1/*
2 * Copyright (c) 2020-2022, Andreas Kling <kling@serenityos.org>
3 * Copyright (c) 2022, Sam Atkins <atkinssj@serenityos.org>
4 *
5 * SPDX-License-Identifier: BSD-2-Clause
6 */
7
8#include <AK/ExtraMathConstants.h>
9#include <LibWeb/HTML/Canvas/CanvasPath.h>
10
11namespace Web::HTML {
12
13void CanvasPath::close_path()
14{
15 m_path.close();
16}
17
18void CanvasPath::move_to(float x, float y)
19{
20 m_path.move_to({ x, y });
21}
22
23void CanvasPath::line_to(float x, float y)
24{
25 m_path.line_to({ x, y });
26}
27
28void CanvasPath::quadratic_curve_to(float cx, float cy, float x, float y)
29{
30 m_path.quadratic_bezier_curve_to({ cx, cy }, { x, y });
31}
32
33void CanvasPath::bezier_curve_to(double cp1x, double cp1y, double cp2x, double cp2y, double x, double y)
34{
35 m_path.cubic_bezier_curve_to(Gfx::FloatPoint(cp1x, cp1y), Gfx::FloatPoint(cp2x, cp2y), Gfx::FloatPoint(x, y));
36}
37
38WebIDL::ExceptionOr<void> CanvasPath::arc(float x, float y, float radius, float start_angle, float end_angle, bool counter_clockwise)
39{
40 if (radius < 0)
41 return WebIDL::IndexSizeError::create(m_self.realm(), DeprecatedString::formatted("The radius provided ({}) is negative.", radius));
42 return ellipse(x, y, radius, radius, 0, start_angle, end_angle, counter_clockwise);
43}
44
45WebIDL::ExceptionOr<void> CanvasPath::ellipse(float x, float y, float radius_x, float radius_y, float rotation, float start_angle, float end_angle, bool counter_clockwise)
46{
47 if (radius_x < 0)
48 return WebIDL::IndexSizeError::create(m_self.realm(), DeprecatedString::formatted("The major-axis radius provided ({}) is negative.", radius_x));
49
50 if (radius_y < 0)
51 return WebIDL::IndexSizeError::create(m_self.realm(), DeprecatedString::formatted("The minor-axis radius provided ({}) is negative.", radius_y));
52
53 if (constexpr float tau = M_TAU; (!counter_clockwise && (end_angle - start_angle) >= tau)
54 || (counter_clockwise && (start_angle - end_angle) >= tau)) {
55 start_angle = 0;
56 end_angle = tau;
57 } else {
58 start_angle = fmodf(start_angle, tau);
59 end_angle = fmodf(end_angle, tau);
60 }
61
62 // Then, figure out where the ends of the arc are.
63 // To do so, we can pretend that the center of this ellipse is at (0, 0),
64 // and the whole coordinate system is rotated `rotation` radians around the x axis, centered on `center`.
65 // The sign of the resulting relative positions is just whether our angle is on one of the left quadrants.
66 auto sin_rotation = sinf(rotation);
67 auto cos_rotation = cosf(rotation);
68
69 auto resolve_point_with_angle = [&](float angle) {
70 auto tan_relative = tanf(angle);
71 auto tan2 = tan_relative * tan_relative;
72
73 auto ab = radius_x * radius_y;
74 auto a2 = radius_x * radius_x;
75 auto b2 = radius_y * radius_y;
76 auto sqrt = sqrtf(b2 + a2 * tan2);
77
78 auto relative_x_position = ab / sqrt;
79 auto relative_y_position = ab * tan_relative / sqrt;
80
81 // Make sure to set the correct sign
82 float sn = sinf(angle) >= 0 ? 1 : -1;
83 relative_x_position *= sn;
84 relative_y_position *= sn;
85
86 // Now rotate it (back) around the center point by 'rotation' radians, then move it back to our actual origin.
87 auto relative_rotated_x_position = relative_x_position * cos_rotation - relative_y_position * sin_rotation;
88 auto relative_rotated_y_position = relative_x_position * sin_rotation + relative_y_position * cos_rotation;
89 return Gfx::FloatPoint { relative_rotated_x_position + x, relative_rotated_y_position + y };
90 };
91
92 auto start_point = resolve_point_with_angle(start_angle);
93 auto end_point = resolve_point_with_angle(end_angle);
94
95 m_path.move_to(start_point);
96
97 double delta_theta = end_angle - start_angle;
98
99 // FIXME: This is still goofy for some values.
100 m_path.elliptical_arc_to(end_point, { radius_x, radius_y }, rotation, delta_theta > M_PI, !counter_clockwise);
101
102 m_path.close();
103 return {};
104}
105
106void CanvasPath::rect(float x, float y, float width, float height)
107{
108 m_path.move_to({ x, y });
109 if (width == 0 || height == 0)
110 return;
111 m_path.line_to({ x + width, y });
112 m_path.line_to({ x + width, y + height });
113 m_path.line_to({ x, y + height });
114 m_path.close();
115}
116
117}