1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
use crate::output_settings::OutputSettings;
use embedded_graphics::{
drawable::Pixel,
geometry::Size,
pixelcolor::{PixelColor, Rgb888},
prelude::*,
DrawTarget,
};
use wasm_bindgen::{JsCast, JsValue};
use web_sys::HtmlCanvasElement;
pub struct WebSimulatorDisplay {
size: Size,
canvas: HtmlCanvasElement,
output_settings: OutputSettings,
}
impl WebSimulatorDisplay {
pub fn new(size: (u32, u32), output_settings: &OutputSettings) -> Self {
let width = size.0 * output_settings.scale + (size.0 - 1) * output_settings.pixel_spacing;
let height = size.1 * output_settings.scale + (size.1 - 1) * output_settings.pixel_spacing;
let document = web_sys::window().unwrap().document().unwrap();
let canvas = document.create_element("canvas").unwrap();
let canvas: web_sys::HtmlCanvasElement = canvas
.dyn_into::<web_sys::HtmlCanvasElement>()
.map_err(|_| ())
.unwrap();
canvas.set_width(width);
canvas.set_height(height);
let context = canvas
.get_context("2d")
.unwrap()
.unwrap()
.dyn_into::<web_sys::CanvasRenderingContext2d>()
.unwrap();
context.set_fill_style(&JsValue::from_str("black"));
context.fill_rect(0.0, 0.0, width as f64, height as f64);
let body = document.body().expect("document should have a body");
body.append_child(&canvas)
.expect("couldn't append canvas to body");
WebSimulatorDisplay {
size: Size::new(width, height),
canvas,
output_settings: output_settings.clone(),
}
}
}
impl<C> DrawTarget<C> for WebSimulatorDisplay
where
C: PixelColor + Into<Rgb888>,
{
type Error = core::convert::Infallible;
fn draw_pixel(&mut self, pixel: Pixel<C>) -> Result<(), Self::Error> {
let Pixel(coord, color) = pixel;
let context = self
.canvas
.get_context("2d")
.unwrap()
.unwrap()
.dyn_into::<web_sys::CanvasRenderingContext2d>()
.unwrap();
let color_rgb888 = color.into();
let css_color = format!(
"rgb({},{},{})",
color_rgb888.r(),
color_rgb888.g(),
color_rgb888.b()
);
context.set_fill_style(&JsValue::from_str(&css_color));
let pitch = (self.output_settings.scale + self.output_settings.pixel_spacing) as i32;
context.fill_rect(
(coord.x * pitch) as f64,
(coord.y * pitch) as f64,
self.output_settings.scale as f64,
self.output_settings.scale as f64,
);
Ok(())
}
fn size(&self) -> Size {
self.size
}
}