mirror of
https://github.com/RGBCube/serenity
synced 2025-07-25 19:57:35 +00:00
LibWeb: Add some basic path drawing functionality to the canvas element
This patch adds the following methods to CanvasRenderingContext2D: - beginPath() - moveTo(x, y) - lineTo(x, y) - closePath() - stroke() We also add the lineWidth property. :^)
This commit is contained in:
parent
60c2e41079
commit
0d93e249c3
6 changed files with 163 additions and 0 deletions
|
@ -53,6 +53,14 @@ CanvasRenderingContext2DWrapper::CanvasRenderingContext2DWrapper(CanvasRendering
|
|||
put_native_property("strokeStyle", stroke_style_getter, stroke_style_setter);
|
||||
put_native_function("strokeRect", stroke_rect, 4);
|
||||
put_native_function("drawImage", draw_image, 3);
|
||||
|
||||
put_native_function("beginPath", begin_path, 0);
|
||||
put_native_function("closePath", close_path, 0);
|
||||
put_native_function("stroke", stroke, 0);
|
||||
put_native_function("moveTo", move_to, 0);
|
||||
put_native_function("lineTo", line_to, 0);
|
||||
|
||||
put_native_property("lineWidth", line_width_getter, line_width_setter);
|
||||
}
|
||||
|
||||
CanvasRenderingContext2DWrapper::~CanvasRenderingContext2DWrapper()
|
||||
|
@ -162,5 +170,68 @@ void CanvasRenderingContext2DWrapper::stroke_style_setter(JS::Interpreter& inter
|
|||
impl->set_stroke_style(value.to_string());
|
||||
}
|
||||
|
||||
JS::Value CanvasRenderingContext2DWrapper::line_width_getter(JS::Interpreter& interpreter)
|
||||
{
|
||||
auto* impl = impl_from(interpreter);
|
||||
if (!impl)
|
||||
return {};
|
||||
return JS::Value(impl->line_width());
|
||||
}
|
||||
|
||||
void CanvasRenderingContext2DWrapper::line_width_setter(JS::Interpreter& interpreter, JS::Value value)
|
||||
{
|
||||
if (auto* impl = impl_from(interpreter))
|
||||
impl->set_line_width(value.to_double());
|
||||
}
|
||||
|
||||
JS::Value CanvasRenderingContext2DWrapper::begin_path(JS::Interpreter& interpreter)
|
||||
{
|
||||
auto* impl = impl_from(interpreter);
|
||||
if (!impl)
|
||||
return {};
|
||||
impl->begin_path();
|
||||
return JS::js_undefined();
|
||||
}
|
||||
|
||||
JS::Value CanvasRenderingContext2DWrapper::close_path(JS::Interpreter& interpreter)
|
||||
{
|
||||
auto* impl = impl_from(interpreter);
|
||||
if (!impl)
|
||||
return {};
|
||||
impl->close_path();
|
||||
return JS::js_undefined();
|
||||
}
|
||||
|
||||
JS::Value CanvasRenderingContext2DWrapper::stroke(JS::Interpreter& interpreter)
|
||||
{
|
||||
auto* impl = impl_from(interpreter);
|
||||
if (!impl)
|
||||
return {};
|
||||
impl->stroke();
|
||||
return JS::js_undefined();
|
||||
}
|
||||
|
||||
JS::Value CanvasRenderingContext2DWrapper::move_to(JS::Interpreter& interpreter)
|
||||
{
|
||||
auto* impl = impl_from(interpreter);
|
||||
if (!impl)
|
||||
return {};
|
||||
double x = interpreter.argument(0).to_double();
|
||||
double y = interpreter.argument(1).to_double();
|
||||
impl->move_to(x, y);
|
||||
return JS::js_undefined();
|
||||
}
|
||||
|
||||
JS::Value CanvasRenderingContext2DWrapper::line_to(JS::Interpreter& interpreter)
|
||||
{
|
||||
auto* impl = impl_from(interpreter);
|
||||
if (!impl)
|
||||
return {};
|
||||
double x = interpreter.argument(0).to_double();
|
||||
double y = interpreter.argument(1).to_double();
|
||||
impl->line_to(x, y);
|
||||
return JS::js_undefined();
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
@ -51,6 +51,13 @@ private:
|
|||
static void fill_style_setter(JS::Interpreter&, JS::Value);
|
||||
static JS::Value stroke_style_getter(JS::Interpreter&);
|
||||
static void stroke_style_setter(JS::Interpreter&, JS::Value);
|
||||
static JS::Value line_width_getter(JS::Interpreter&);
|
||||
static void line_width_setter(JS::Interpreter&, JS::Value);
|
||||
static JS::Value begin_path(JS::Interpreter&);
|
||||
static JS::Value close_path(JS::Interpreter&);
|
||||
static JS::Value stroke(JS::Interpreter&);
|
||||
static JS::Value move_to(JS::Interpreter&);
|
||||
static JS::Value line_to(JS::Interpreter&);
|
||||
|
||||
NonnullRefPtr<CanvasRenderingContext2D> m_impl;
|
||||
};
|
||||
|
|
|
@ -134,4 +134,35 @@ OwnPtr<Gfx::Painter> CanvasRenderingContext2D::painter()
|
|||
return make<Gfx::Painter>(*m_element->bitmap());
|
||||
}
|
||||
|
||||
void CanvasRenderingContext2D::begin_path()
|
||||
{
|
||||
m_path = Gfx::Path();
|
||||
}
|
||||
|
||||
void CanvasRenderingContext2D::close_path()
|
||||
{
|
||||
m_path.close();
|
||||
}
|
||||
|
||||
void CanvasRenderingContext2D::move_to(float x, float y)
|
||||
{
|
||||
m_path.move_to({ x, y });
|
||||
}
|
||||
|
||||
void CanvasRenderingContext2D::line_to(float x, float y)
|
||||
{
|
||||
m_path.line_to({ x, y });
|
||||
}
|
||||
|
||||
void CanvasRenderingContext2D::stroke()
|
||||
{
|
||||
dbg() << "stroke path " << m_path;
|
||||
|
||||
auto painter = this->painter();
|
||||
if (!painter)
|
||||
return;
|
||||
|
||||
painter->stroke_path(m_path, m_stroke_style, m_line_width);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -30,6 +30,7 @@
|
|||
#include <LibGfx/AffineTransform.h>
|
||||
#include <LibGfx/Color.h>
|
||||
#include <LibGfx/Forward.h>
|
||||
#include <LibGfx/Path.h>
|
||||
#include <LibWeb/Bindings/Wrappable.h>
|
||||
|
||||
namespace Web {
|
||||
|
@ -61,6 +62,15 @@ public:
|
|||
void scale(float sx, float sy);
|
||||
void translate(float x, float y);
|
||||
|
||||
void set_line_width(float line_width) { m_line_width = line_width; }
|
||||
float line_width() const { return m_line_width; }
|
||||
|
||||
void begin_path();
|
||||
void close_path();
|
||||
void move_to(float x, float y);
|
||||
void line_to(float x, float y);
|
||||
void stroke();
|
||||
|
||||
private:
|
||||
explicit CanvasRenderingContext2D(HTMLCanvasElement&);
|
||||
|
||||
|
@ -73,6 +83,9 @@ private:
|
|||
Gfx::AffineTransform m_transform;
|
||||
Gfx::Color m_fill_style;
|
||||
Gfx::Color m_stroke_style;
|
||||
float m_line_width { 1 };
|
||||
|
||||
Gfx::Path m_path;
|
||||
};
|
||||
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue