mirror of
https://github.com/RGBCube/serenity
synced 2025-07-27 01:17:35 +00:00
LibWeb: Add SVG <rect>
element and test case :^)
This commit is contained in:
parent
aa2f20fb60
commit
1dde6a0a2b
11 changed files with 225 additions and 1 deletions
|
@ -54,6 +54,8 @@ namespace Web::SVG::AttributeNames {
|
|||
E(repeatCount) \
|
||||
E(repeatDur) \
|
||||
E(requiredExtensions) \
|
||||
E(rx) \
|
||||
E(ry) \
|
||||
E(requiredFeatures) \
|
||||
E(specularConstant) \
|
||||
E(specularExponent) \
|
||||
|
|
153
Userland/Libraries/LibWeb/SVG/SVGRectElement.cpp
Normal file
153
Userland/Libraries/LibWeb/SVG/SVGRectElement.cpp
Normal file
|
@ -0,0 +1,153 @@
|
|||
/*
|
||||
* Copyright (c) 2022, Sam Atkins <atkinssj@serenityos.org>
|
||||
*
|
||||
* SPDX-License-Identifier: BSD-2-Clause
|
||||
*/
|
||||
|
||||
#include "SVGRectElement.h"
|
||||
#include <LibWeb/SVG/AttributeNames.h>
|
||||
#include <LibWeb/SVG/AttributeParser.h>
|
||||
|
||||
namespace Web::SVG {
|
||||
|
||||
SVGRectElement::SVGRectElement(DOM::Document& document, QualifiedName qualified_name)
|
||||
: SVGGeometryElement(document, qualified_name)
|
||||
{
|
||||
}
|
||||
|
||||
void SVGRectElement::parse_attribute(FlyString const& name, String const& value)
|
||||
{
|
||||
SVGGeometryElement::parse_attribute(name, value);
|
||||
|
||||
if (name == SVG::AttributeNames::x) {
|
||||
m_x = AttributeParser::parse_coordinate(value);
|
||||
m_path.clear();
|
||||
} else if (name == SVG::AttributeNames::y) {
|
||||
m_y = AttributeParser::parse_coordinate(value);
|
||||
m_path.clear();
|
||||
} else if (name == SVG::AttributeNames::width) {
|
||||
m_width = AttributeParser::parse_positive_length(value);
|
||||
m_path.clear();
|
||||
} else if (name == SVG::AttributeNames::height) {
|
||||
m_height = AttributeParser::parse_positive_length(value);
|
||||
m_path.clear();
|
||||
} else if (name == SVG::AttributeNames::rx) {
|
||||
m_radius_x = AttributeParser::parse_length(value);
|
||||
m_path.clear();
|
||||
} else if (name == SVG::AttributeNames::ry) {
|
||||
m_radius_y = AttributeParser::parse_length(value);
|
||||
m_path.clear();
|
||||
}
|
||||
}
|
||||
|
||||
Gfx::Path& SVGRectElement::get_path()
|
||||
{
|
||||
if (m_path.has_value())
|
||||
return m_path.value();
|
||||
|
||||
float width = m_width.value_or(0);
|
||||
float height = m_height.value_or(0);
|
||||
float x = m_x.value_or(0);
|
||||
float y = m_y.value_or(0);
|
||||
|
||||
Gfx::Path path;
|
||||
// If width or height is zero, rendering is disabled.
|
||||
if (width == 0 && height == 0) {
|
||||
m_path = move(path);
|
||||
return m_path.value();
|
||||
}
|
||||
|
||||
auto corner_radii = calculate_used_corner_radius_values();
|
||||
float rx = corner_radii.x();
|
||||
float ry = corner_radii.y();
|
||||
|
||||
// 1. perform an absolute moveto operation to location (x+rx,y);
|
||||
path.move_to({ x + rx, y });
|
||||
|
||||
// 2, perform an absolute horizontal lineto with parameter x+width-rx;
|
||||
path.horizontal_line_to(x + width - rx);
|
||||
|
||||
// 3. if both rx and ry are greater than zero,
|
||||
// perform an absolute elliptical arc operation to coordinate (x+width,y+ry),
|
||||
// where rx and ry are used as the equivalent parameters to the elliptical arc command,
|
||||
// the x-axis-rotation and large-arc-flag are set to zero,
|
||||
// the sweep-flag is set to one;
|
||||
double x_axis_rotation = 0;
|
||||
bool large_arc_flag = false;
|
||||
bool sweep_flag = true;
|
||||
if (rx > 0 && ry > 0)
|
||||
path.elliptical_arc_to({ x + width, y + ry }, corner_radii, x_axis_rotation, large_arc_flag, sweep_flag);
|
||||
|
||||
// 4. perform an absolute vertical lineto parameter y+height-ry;
|
||||
path.vertical_line_to(y + height - ry);
|
||||
|
||||
// 5. if both rx and ry are greater than zero,
|
||||
// perform an absolute elliptical arc operation to coordinate (x+width-rx,y+height),
|
||||
// using the same parameters as previously;
|
||||
if (rx > 0 && ry > 0)
|
||||
path.elliptical_arc_to({ x + width - rx, y + height }, corner_radii, x_axis_rotation, large_arc_flag, sweep_flag);
|
||||
|
||||
// 6. perform an absolute horizontal lineto parameter x+rx;
|
||||
path.horizontal_line_to(x + rx);
|
||||
|
||||
// 7. if both rx and ry are greater than zero,
|
||||
// perform an absolute elliptical arc operation to coordinate (x,y+height-ry),
|
||||
// using the same parameters as previously;
|
||||
if (rx > 0 && ry > 0)
|
||||
path.elliptical_arc_to({ x, y + height - ry }, corner_radii, x_axis_rotation, large_arc_flag, sweep_flag);
|
||||
|
||||
// 8. perform an absolute vertical lineto parameter y+ry
|
||||
path.vertical_line_to(y + ry);
|
||||
|
||||
// 9. if both rx and ry are greater than zero,
|
||||
// perform an absolute elliptical arc operation with a segment-completing close path operation,
|
||||
// using the same parameters as previously.
|
||||
if (rx > 0 && ry > 0)
|
||||
path.elliptical_arc_to({ x + rx, y }, corner_radii, x_axis_rotation, large_arc_flag, sweep_flag);
|
||||
|
||||
m_path = move(path);
|
||||
return m_path.value();
|
||||
}
|
||||
|
||||
Gfx::FloatPoint SVGRectElement::calculate_used_corner_radius_values()
|
||||
{
|
||||
// 1. Let rx and ry be length values.
|
||||
float rx = 0;
|
||||
float ry = 0;
|
||||
|
||||
// 2. If neither ‘rx’ nor ‘ry’ are properly specified, then set both rx and ry to 0. (This will result in square corners.)
|
||||
if (!m_radius_x.has_value() && !m_radius_y.has_value()) {
|
||||
rx = 0;
|
||||
ry = 0;
|
||||
}
|
||||
// 3. Otherwise, if a properly specified value is provided for ‘rx’, but not for ‘ry’, then set both rx and ry to the value of ‘rx’.
|
||||
else if (m_radius_x.has_value()) {
|
||||
rx = m_radius_x.value();
|
||||
ry = m_radius_x.value();
|
||||
}
|
||||
// 4. Otherwise, if a properly specified value is provided for ‘ry’, but not for ‘rx’, then set both rx and ry to the value of ‘ry’.
|
||||
else if (m_radius_y.has_value()) {
|
||||
rx = m_radius_y.value();
|
||||
ry = m_radius_y.value();
|
||||
}
|
||||
// 5. Otherwise, both ‘rx’ and ‘ry’ were specified properly. Set rx to the value of ‘rx’ and ry to the value of ‘ry’.
|
||||
else {
|
||||
rx = m_radius_x.value();
|
||||
ry = m_radius_y.value();
|
||||
}
|
||||
|
||||
// 6. If rx is greater than half of ‘width’, then set rx to half of ‘width’.
|
||||
auto half_width = m_width.value_or(0) / 2;
|
||||
if (rx > half_width)
|
||||
rx = half_width;
|
||||
|
||||
// 7. If ry is greater than half of ‘height’, then set ry to half of ‘height’.
|
||||
auto half_height = m_height.value_or(0) / 2;
|
||||
if (ry > half_height)
|
||||
ry = half_height;
|
||||
|
||||
// 8. The effective values of ‘rx’ and ‘ry’ are rx and ry, respectively.
|
||||
return Gfx::FloatPoint { rx, ry };
|
||||
}
|
||||
|
||||
}
|
38
Userland/Libraries/LibWeb/SVG/SVGRectElement.h
Normal file
38
Userland/Libraries/LibWeb/SVG/SVGRectElement.h
Normal file
|
@ -0,0 +1,38 @@
|
|||
/*
|
||||
* Copyright (c) 2022, Sam Atkins <atkinssj@serenityos.org>
|
||||
*
|
||||
* SPDX-License-Identifier: BSD-2-Clause
|
||||
*/
|
||||
|
||||
#pragma once
|
||||
|
||||
#include <LibWeb/SVG/SVGGeometryElement.h>
|
||||
|
||||
namespace Web::SVG {
|
||||
|
||||
// https://www.w3.org/TR/SVG11/shapes.html#RectElement
|
||||
class SVGRectElement final : public SVGGeometryElement {
|
||||
public:
|
||||
using WrapperType = Bindings::SVGRectElementWrapper;
|
||||
|
||||
SVGRectElement(DOM::Document&, QualifiedName);
|
||||
virtual ~SVGRectElement() override = default;
|
||||
|
||||
virtual void parse_attribute(FlyString const& name, String const& value) override;
|
||||
|
||||
virtual Gfx::Path& get_path() override;
|
||||
|
||||
private:
|
||||
Gfx::FloatPoint calculate_used_corner_radius_values();
|
||||
|
||||
Optional<Gfx::Path> m_path;
|
||||
|
||||
Optional<float> m_x;
|
||||
Optional<float> m_y;
|
||||
Optional<float> m_width;
|
||||
Optional<float> m_height;
|
||||
Optional<float> m_radius_x;
|
||||
Optional<float> m_radius_y;
|
||||
};
|
||||
|
||||
}
|
9
Userland/Libraries/LibWeb/SVG/SVGRectElement.idl
Normal file
9
Userland/Libraries/LibWeb/SVG/SVGRectElement.idl
Normal file
|
@ -0,0 +1,9 @@
|
|||
[Exposed=Window]
|
||||
interface SVGRectElement : SVGGeometryElement {
|
||||
// [SameObject] readonly attribute SVGAnimatedLength x;
|
||||
// [SameObject] readonly attribute SVGAnimatedLength y;
|
||||
// [SameObject] readonly attribute SVGAnimatedLength width;
|
||||
// [SameObject] readonly attribute SVGAnimatedLength height;
|
||||
// [SameObject] readonly attribute SVGAnimatedLength rx;
|
||||
// [SameObject] readonly attribute SVGAnimatedLength ry;
|
||||
};
|
|
@ -13,6 +13,7 @@ namespace Web::SVG::TagNames {
|
|||
#define ENUMERATE_SVG_GRAPHICS_TAGS \
|
||||
__ENUMERATE_SVG_TAG(g) \
|
||||
__ENUMERATE_SVG_TAG(path) \
|
||||
__ENUMERATE_SVG_TAG(rect) \
|
||||
__ENUMERATE_SVG_TAG(svg)
|
||||
|
||||
#define ENUMERATE_SVG_TAGS \
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue