Add DeviceEvent::MouseMove on web platform to support pointer lock (#1827)

* Add DeviceEvent::MouseMove on web platform to support pointer lock

* Update changelog

* Add support for stdweb too

* Add mouse_delta to stdweb

* Remove reference to pointer lock

CHANGELOG.md

@@ -9,6 +9,7 @@
 - On Android, unimplemented events are marked as unhandled on the native event loop.
 - On Windows, added `WindowBuilderExtWindows::with_menu` to set a custom menu at window creation time.
 - On Android, bump `ndk` and `ndk-glue` to 0.3: use predefined constants for event `ident`.
+- On Web, added support for `DeviceEvent::MouseMotion` to listen for relative mouse movements.
 
 # 0.24.0 (2020-12-09)
 

src/platform_impl/web/event_loop/window_target.rs

@@ -1,6 +1,8 @@
 use super::{super::monitor, backend, device, proxy::Proxy, runner, window};
 use crate::dpi::{PhysicalSize, Size};
-use crate::event::{DeviceId, ElementState, Event, KeyboardInput, TouchPhase, WindowEvent};
+use crate::event::{
+    DeviceEvent, DeviceId, ElementState, Event, KeyboardInput, TouchPhase, WindowEvent,
+};
 use crate::event_loop::ControlFlow;
 use crate::monitor::MonitorHandle as RootMH;
 use crate::window::{Theme, WindowId};
@@ -130,7 +132,7 @@ impl<T> WindowTarget<T> {
         });
 
         let runner = self.runner.clone();
-        canvas.on_cursor_move(move |pointer_id, position, modifiers| {
+        canvas.on_cursor_move(move |pointer_id, position, delta, modifiers| {
             runner.send_event(Event::WindowEvent {
                 window_id: WindowId(id),
                 event: WindowEvent::CursorMoved {
@@ -139,6 +141,12 @@ impl<T> WindowTarget<T> {
                     modifiers,
                 },
             });
+            runner.send_event(Event::DeviceEvent {
+                device_id: DeviceId(device::Id(pointer_id)),
+                event: DeviceEvent::MouseMotion {
+                    delta: (delta.x, delta.y),
+                },
+            });
         });
 
         let runner = self.runner.clone();

src/platform_impl/web/stdweb/canvas.rs

@@ -222,13 +222,14 @@ impl Canvas {
 
     pub fn on_cursor_move<F>(&mut self, mut handler: F)
     where
-        F: 'static + FnMut(i32, PhysicalPosition<f64>, ModifiersState),
+        F: 'static + FnMut(i32, PhysicalPosition<f64>, PhysicalPosition<f64>, ModifiersState),
     {
         // todo
         self.on_cursor_move = Some(self.add_event(move |event: PointerMoveEvent| {
             handler(
                 event.pointer_id(),
                 event::mouse_position(&event).to_physical(super::scale_factor()),
+                event::mouse_delta(&event).to_physical(super::scale_factor()),
                 event::mouse_modifiers(&event),
             );
         }));

src/platform_impl/web/stdweb/event.rs

@@ -30,6 +30,13 @@ pub fn mouse_position(event: &impl IMouseEvent) -> LogicalPosition<f64> {
     }
 }
 
+pub fn mouse_delta(event: &impl IMouseEvent) -> LogicalPosition<f64> {
+    LogicalPosition {
+        x: event.movement_x() as f64,
+        y: event.movement_y() as f64,
+    }
+}
+
 pub fn mouse_scroll_delta(event: &MouseWheelEvent) -> Option<MouseScrollDelta> {
     let x = event.delta_x();
     let y = -event.delta_y();

src/platform_impl/web/web_sys/canvas.rs

@@ -238,7 +238,7 @@ impl Canvas {
 
     pub fn on_cursor_move<F>(&mut self, handler: F)
     where
-        F: 'static + FnMut(i32, PhysicalPosition<f64>, ModifiersState),
+        F: 'static + FnMut(i32, PhysicalPosition<f64>, PhysicalPosition<f64>, ModifiersState),
     {
         match &mut self.mouse_state {
             MouseState::HasPointerEvent(h) => h.on_cursor_move(&self.common, handler),

src/platform_impl/web/web_sys/canvas/mouse_handler.rs

@@ -160,7 +160,7 @@ impl MouseHandler {
 
     pub fn on_cursor_move<F>(&mut self, canvas_common: &super::Common, mut handler: F)
     where
-        F: 'static + FnMut(i32, PhysicalPosition<f64>, ModifiersState),
+        F: 'static + FnMut(i32, PhysicalPosition<f64>, PhysicalPosition<f64>, ModifiersState),
     {
         let mouse_capture_state = self.mouse_capture_state.clone();
         let canvas = canvas_common.raw.clone();
@@ -190,9 +190,11 @@ impl MouseHandler {
                             // use `offsetX`/`offsetY`.
                             event::mouse_position_by_client(&event, &canvas)
                         };
+                        let mouse_delta = event::mouse_delta(&event);
                         handler(
                             0,
                             mouse_pos.to_physical(super::super::scale_factor()),
+                            mouse_delta.to_physical(super::super::scale_factor()),
                             event::mouse_modifiers(&event),
                         );
                     }

src/platform_impl/web/web_sys/canvas/pointer_handler.rs

@@ -87,7 +87,7 @@ impl PointerHandler {
 
     pub fn on_cursor_move<F>(&mut self, canvas_common: &super::Common, mut handler: F)
     where
-        F: 'static + FnMut(i32, PhysicalPosition<f64>, ModifiersState),
+        F: 'static + FnMut(i32, PhysicalPosition<f64>, PhysicalPosition<f64>, ModifiersState),
     {
         self.on_cursor_move = Some(canvas_common.add_event(
             "pointermove",
@@ -95,6 +95,7 @@ impl PointerHandler {
                 handler(
                     event.pointer_id(),
                     event::mouse_position(&event).to_physical(super::super::scale_factor()),
+                    event::mouse_delta(&event).to_physical(super::super::scale_factor()),
                     event::mouse_modifiers(&event),
                 );
             },

src/platform_impl/web/web_sys/event.rs

@@ -29,6 +29,13 @@ pub fn mouse_position(event: &MouseEvent) -> LogicalPosition<f64> {
     }
 }
 
+pub fn mouse_delta(event: &MouseEvent) -> LogicalPosition<f64> {
+    LogicalPosition {
+        x: event.movement_x() as f64,
+        y: event.movement_y() as f64,
+    }
+}
+
 pub fn mouse_position_by_client(
     event: &MouseEvent,
     canvas: &HtmlCanvasElement,