Tweak the html canvas handling

Refresh the canvas size if the browser window gets resized, for example due to orientation changes.
This commit is contained in:
Simon Hausmann 2020-11-26 10:39:51 +01:00
parent a53fa707ed
commit fc4656571f

View file

@ -199,6 +199,9 @@ impl GLRenderer {
(windowed_context, gl_context) (windowed_context, gl_context)
}; };
#[cfg(target_arch = "wasm32")]
let event_loop_proxy = Rc::new(event_loop.create_proxy());
#[cfg(target_arch = "wasm32")] #[cfg(target_arch = "wasm32")]
let (window, context) = { let (window, context) = {
let canvas = web_sys::window() let canvas = web_sys::window()
@ -213,8 +216,6 @@ impl GLRenderer {
use winit::platform::web::WindowBuilderExtWebSys; use winit::platform::web::WindowBuilderExtWebSys;
use winit::platform::web::WindowExtWebSys; use winit::platform::web::WindowExtWebSys;
// Try to maintain the existing size of the canvas element. A window created with winit
// on the web will always have 1024x768 as size otherwise.
let existing_canvas_size = winit::dpi::LogicalSize::new( let existing_canvas_size = winit::dpi::LogicalSize::new(
canvas.client_width() as u32, canvas.client_width() as u32,
canvas.client_height() as u32, canvas.client_height() as u32,
@ -223,6 +224,42 @@ impl GLRenderer {
let window = let window =
Rc::new(window_builder.with_canvas(Some(canvas)).build(&event_loop).unwrap()); Rc::new(window_builder.with_canvas(Some(canvas)).build(&event_loop).unwrap());
// Try to maintain the existing size of the canvas element. A window created with winit
// on the web will always have 1024x768 as size otherwise.
let resize_canvas = {
let event_loop_proxy = event_loop_proxy.clone();
let canvas = web_sys::window()
.unwrap()
.document()
.unwrap()
.get_element_by_id(canvas_id)
.unwrap()
.dyn_into::<web_sys::HtmlCanvasElement>()
.unwrap();
let window = window.clone();
move |_: web_sys::Event| {
let existing_canvas_size = winit::dpi::LogicalSize::new(
canvas.client_width() as u32,
canvas.client_height() as u32,
);
window.set_inner_size(existing_canvas_size);
window.request_redraw();
event_loop_proxy
.send_event(sixtyfps_corelib::eventloop::CustomEvent::WakeUpAndPoll)
.ok();
}
};
let resize_closure =
wasm_bindgen::closure::Closure::wrap(Box::new(resize_canvas) as Box<dyn FnMut(_)>);
web_sys::window()
.unwrap()
.add_event_listener_with_callback("resize", resize_closure.as_ref().unchecked_ref())
.unwrap();
resize_closure.forget();
{ {
let default_size = window.inner_size().to_logical(window.scale_factor()); let default_size = window.inner_size().to_logical(window.scale_factor());
let new_size = winit::dpi::LogicalSize::new( let new_size = winit::dpi::LogicalSize::new(
@ -282,7 +319,7 @@ impl GLRenderer {
#[cfg(target_arch = "wasm32")] #[cfg(target_arch = "wasm32")]
window, window,
#[cfg(target_arch = "wasm32")] #[cfg(target_arch = "wasm32")]
event_loop_proxy: Rc::new(event_loop.create_proxy()), event_loop_proxy,
#[cfg(not(target_arch = "wasm32"))] #[cfg(not(target_arch = "wasm32"))]
windowed_context: Some(unsafe { windowed_context.make_not_current().unwrap() }), windowed_context: Some(unsafe { windowed_context.make_not_current().unwrap() }),
normal_rectangle: None, normal_rectangle: None,