Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-02 12:10:29 +01:00
Code Issues Projects Releases Packages Wiki Activity

Enable textAlign, textBaseline and direction attributes for canvas

Browse source
This commit is contained in:
Utsav Oza 2020-06-07 01:38:04 +05:30
parent c21fde3751
commit 34d0c313dc
15 changed files with 486 additions and 64 deletions
Download patch file Download diff file Expand all files Collapse all files

98
components/script/canvas_state.rs
View file

@ -3,10 +3,13 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/. */
use crate::dom::bindings::cell::DomRefCell;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasDirection;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasFillRule;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasImageSource;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasLineCap;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasLineJoin;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasTextAlign;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasTextBaseline;
use crate::dom::bindings::codegen::Bindings::ImageDataBinding::ImageDataMethods;
use crate::dom::bindings::codegen::UnionTypes::StringOrCanvasGradientOrCanvasPattern;
use crate::dom::bindings::error::{Error, ErrorResult, Fallible};
@ -27,7 +30,7 @@ use crate::dom::offscreencanvas::{OffscreenCanvas, OffscreenCanvasContext};
use crate::dom::paintworkletglobalscope::PaintWorkletGlobalScope;
use crate::dom::textmetrics::TextMetrics;
use crate::unpremultiplytable::UNPREMULTIPLY_TABLE;
use canvas_traits::canvas::{Canvas2dMsg, CanvasId, CanvasMsg};
use canvas_traits::canvas::{Canvas2dMsg, CanvasId, CanvasMsg, Direction, TextAlign, TextBaseline};
use canvas_traits::canvas::{CompositionOrBlending, FillOrStrokeStyle, FillRule};
use canvas_traits::canvas::{LineCapStyle, LineJoinStyle, LinearGradientStyle};
use canvas_traits::canvas::{RadialGradientStyle, RepetitionStyle};
@ -91,9 +94,14 @@ pub(crate) struct CanvasContextState {
shadow_blur: f64,
shadow_color: RGBA,
font_style: Option<Font>,
text_align: TextAlign,
text_baseline: TextBaseline,
direction: Direction,
}
impl CanvasContextState {
const DEFAULT_FONT_STYLE: &'static str = "10px sans-serif";
pub(crate) fn new() -> CanvasContextState {
let black = RGBA::new(0, 0, 0, 255);
CanvasContextState {
@ -112,6 +120,9 @@ impl CanvasContextState {
shadow_blur: 0.0,
shadow_color: RGBA::transparent(),
font_style: None,
text_align: Default::default(),
text_baseline: Default::default(),
direction: Default::default(),
}
}
}
@ -995,7 +1006,7 @@ impl CanvasState {
// https://html.spec.whatwg.org/multipage/#dom-context-2d-filltext
pub fn fill_text(
&self,
_canvas: Option<&HTMLCanvasElement>,
canvas: Option<&HTMLCanvasElement>,
text: DOMString,
x: f64,
y: f64,
@ -1007,9 +1018,19 @@ impl CanvasState {
if max_width.map_or(false, |max_width| !max_width.is_finite() || max_width <= 0.) {
return;
}
if self.state.borrow().font_style.is_none() {
self.set_font(canvas, CanvasContextState::DEFAULT_FONT_STYLE.into())
}
let is_rtl = false; // TODO: resolve is_rtl wrt to canvas element
let style = self.state.borrow().fill_style.to_fill_or_stroke_style();
self.send_canvas_2d_msg(Canvas2dMsg::FillText(text.into(), x, y, max_width, style));
self.send_canvas_2d_msg(Canvas2dMsg::FillText(
text.into(),
x,
y,
max_width,
style,
is_rtl,
));
}
// https://html.spec.whatwg.org/multipage/#textmetrics
@ -1040,7 +1061,7 @@ impl CanvasState {
// https://html.spec.whatwg.org/multipage/#dom-context-2d-font
pub fn font(&self) -> DOMString {
self.state.borrow().font_style.as_ref().map_or_else(
|| DOMString::from("10px sans-serif"),
|| CanvasContextState::DEFAULT_FONT_STYLE.into(),
|style| {
let mut result = String::new();
serialize_font(style, &mut result).unwrap();
@ -1049,6 +1070,73 @@ impl CanvasState {
)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textalign
pub fn text_align(&self) -> CanvasTextAlign {
match self.state.borrow().text_align {
TextAlign::Start => CanvasTextAlign::Start,
TextAlign::End => CanvasTextAlign::End,
TextAlign::Left => CanvasTextAlign::Left,
TextAlign::Right => CanvasTextAlign::Right,
TextAlign::Center => CanvasTextAlign::Center,
}
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textalign
pub fn set_text_align(&self, value: CanvasTextAlign) {
let text_align = match value {
CanvasTextAlign::Start => TextAlign::Start,
CanvasTextAlign::End => TextAlign::End,
CanvasTextAlign::Left => TextAlign::Left,
CanvasTextAlign::Right => TextAlign::Right,
CanvasTextAlign::Center => TextAlign::Center,
};
self.state.borrow_mut().text_align = text_align;
self.send_canvas_2d_msg(Canvas2dMsg::SetTextAlign(text_align));
}
pub fn text_baseline(&self) -> CanvasTextBaseline {
match self.state.borrow().text_baseline {
TextBaseline::Top => CanvasTextBaseline::Top,
TextBaseline::Hanging => CanvasTextBaseline::Hanging,
TextBaseline::Middle => CanvasTextBaseline::Middle,
TextBaseline::Alphabetic => CanvasTextBaseline::Alphabetic,
TextBaseline::Ideographic => CanvasTextBaseline::Ideographic,
TextBaseline::Bottom => CanvasTextBaseline::Bottom,
}
}
pub fn set_text_baseline(&self, value: CanvasTextBaseline) {
let text_baseline = match value {
CanvasTextBaseline::Top => TextBaseline::Top,
CanvasTextBaseline::Hanging => TextBaseline::Hanging,
CanvasTextBaseline::Middle => TextBaseline::Middle,
CanvasTextBaseline::Alphabetic => TextBaseline::Alphabetic,
CanvasTextBaseline::Ideographic => TextBaseline::Ideographic,
CanvasTextBaseline::Bottom => TextBaseline::Bottom,
};
self.state.borrow_mut().text_baseline = text_baseline;
self.send_canvas_2d_msg(Canvas2dMsg::SetTextBaseline(text_baseline));
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-direction
pub fn direction(&self) -> CanvasDirection {
match self.state.borrow().direction {
Direction::Ltr => CanvasDirection::Ltr,
Direction::Rtl => CanvasDirection::Rtl,
Direction::Inherit => CanvasDirection::Inherit,
}
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-direction
pub fn set_direction(&self, value: CanvasDirection) {
let direction = match value {
CanvasDirection::Ltr => Direction::Ltr,
CanvasDirection::Rtl => Direction::Rtl,
CanvasDirection::Inherit => Direction::Inherit,
};
self.state.borrow_mut().direction = direction;
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-linewidth
pub fn line_width(&self) -> f64 {
self.state.borrow().line_width

6
components/script/dom/bindings/trace.rs
View file

@ -47,7 +47,10 @@ use app_units::Au;
use canvas_traits::canvas::{
CanvasGradientStop, CanvasId, LinearGradientStyle, RadialGradientStyle,
};
use canvas_traits::canvas::{CompositionOrBlending, LineCapStyle, LineJoinStyle, RepetitionStyle};
use canvas_traits::canvas::{
CompositionOrBlending, Direction, LineCapStyle, LineJoinStyle, RepetitionStyle, TextAlign,
TextBaseline,
};
use canvas_traits::webgl::WebGLVertexArrayId;
use canvas_traits::webgl::{
ActiveAttribInfo, ActiveUniformBlockInfo, ActiveUniformInfo, GlType, TexDataType, TexFormat,
@ -503,6 +506,7 @@ unsafe_no_jsmanaged_fields!(RGBA);
unsafe_no_jsmanaged_fields!(StorageType);
unsafe_no_jsmanaged_fields!(CanvasGradientStop, LinearGradientStyle, RadialGradientStyle);
unsafe_no_jsmanaged_fields!(LineCapStyle, LineJoinStyle, CompositionOrBlending);
unsafe_no_jsmanaged_fields!(TextAlign, TextBaseline, Direction);
unsafe_no_jsmanaged_fields!(RepetitionStyle);
unsafe_no_jsmanaged_fields!(WebGLError, GLLimits, GlType);
unsafe_no_jsmanaged_fields!(TimeProfilerChan);

33
components/script/dom/canvasrenderingcontext2d.rs
View file

@ -3,11 +3,14 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/. */
use crate::canvas_state::CanvasState;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasDirection;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasFillRule;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasImageSource;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasLineCap;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasLineJoin;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasRenderingContext2DMethods;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasTextAlign;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasTextBaseline;
use crate::dom::bindings::codegen::UnionTypes::StringOrCanvasGradientOrCanvasPattern;
use crate::dom::bindings::error::{ErrorResult, Fallible};
use crate::dom::bindings::num::Finite;
@ -309,6 +312,36 @@ impl CanvasRenderingContext2DMethods for CanvasRenderingContext2D {
.set_font(self.canvas.as_ref().map(|c| &**c), value)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textalign
fn TextAlign(&self) -> CanvasTextAlign {
self.canvas_state.text_align()
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textalign
fn SetTextAlign(&self, value: CanvasTextAlign) {
self.canvas_state.set_text_align(value)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textbaseline
fn TextBaseline(&self) -> CanvasTextBaseline {
self.canvas_state.text_baseline()
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textbaseline
fn SetTextBaseline(&self, value: CanvasTextBaseline) {
self.canvas_state.set_text_baseline(value)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-direction
fn Direction(&self) -> CanvasDirection {
self.canvas_state.direction()
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-direction
fn SetDirection(&self, value: CanvasDirection) {
self.canvas_state.set_direction(value)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-drawimage
fn DrawImage(&self, image: CanvasImageSource, dx: f64, dy: f64) -> ErrorResult {
self.canvas_state

33
components/script/dom/offscreencanvasrenderingcontext2d.rs
View file

@ -3,10 +3,13 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/. */
use crate::canvas_state::CanvasState;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasDirection;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasFillRule;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasImageSource;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasLineCap;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasLineJoin;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasTextAlign;
use crate::dom::bindings::codegen::Bindings::CanvasRenderingContext2DBinding::CanvasTextBaseline;
use crate::dom::bindings::codegen::Bindings::OffscreenCanvasRenderingContext2DBinding::OffscreenCanvasRenderingContext2DMethods;
use crate::dom::bindings::codegen::UnionTypes::StringOrCanvasGradientOrCanvasPattern;
use crate::dom::bindings::error::ErrorResult;
@ -269,6 +272,36 @@ impl OffscreenCanvasRenderingContext2DMethods for OffscreenCanvasRenderingContex
.set_font(self.htmlcanvas.as_ref().map(|c| &**c), value)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textalign
fn TextAlign(&self) -> CanvasTextAlign {
self.canvas_state.text_align()
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textalign
fn SetTextAlign(&self, value: CanvasTextAlign) {
self.canvas_state.set_text_align(value)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textbaseline
fn TextBaseline(&self) -> CanvasTextBaseline {
self.canvas_state.text_baseline()
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-textbaseline
fn SetTextBaseline(&self, value: CanvasTextBaseline) {
self.canvas_state.set_text_baseline(value)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-direction
fn Direction(&self) -> CanvasDirection {
self.canvas_state.direction()
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-direction
fn SetDirection(&self, value: CanvasDirection) {
self.canvas_state.set_direction(value)
}
// https://html.spec.whatwg.org/multipage/#dom-context-2d-linewidth
fn LineWidth(&self) -> f64 {
self.canvas_state.line_width()

6
components/script/dom/webidls/CanvasRenderingContext2D.webidl
View file

@ -212,10 +212,10 @@ interface mixin CanvasPathDrawingStyles {
interface mixin CanvasTextDrawingStyles {
// text
attribute DOMString font; // (default 10px sans-serif)
//attribute CanvasTextAlign textAlign; // "start", "end", "left", "right", "center" (default: "start")
//attribute CanvasTextBaseline textBaseline; // "top", "hanging", "middle", "alphabetic",
attribute CanvasTextAlign textAlign; // "start", "end", "left", "right", "center" (default: "start")
attribute CanvasTextBaseline textBaseline; // "top", "hanging", "middle", "alphabetic",
// "ideographic", "bottom" (default: "alphabetic")
//attribute CanvasDirection direction; // "ltr", "rtl", "inherit" (default: "inherit")
attribute CanvasDirection direction; // "ltr", "rtl", "inherit" (default: "inherit")
};
[Exposed=(PaintWorklet, Window, Worker)]