shithub: puzzles

Info  •  Files  •  Log  •  Branches

js: Use the Pointer Events API, but only to capture the pointer

Element.setPointerCapture() captures both pointer and mouse events, so
we can use our existing mouse handlers and just have a minimal
pointerdown handler that calls setPointerCapture().  This saves (or at
least postpones) all the tedious rewriting referred to in ecd868ac.

This means that now drags beyond the puzzle area work in WebKit-based
browsers, and we don't get deprecation warnings in current Gecko-based
ones.  Older Gecko-based browsers continue to use Element.setCapture()
and hence still work correctly.

--- a/emccpre.js

+++ b/emccpre.js

@@ -285,7 +285,9 @@

 }

 function set_capture(element, event) {

-    if (element.setCapture !== undefined) {

+    // This is only needed if we don't have Pointer Events available.

+    if (element.setCapture !== undefined &&

+        element.setPointerCapture === undefined) {

         element.setCapture(true);

         return;

     }

@@ -317,6 +319,13 @@

         return toret;

     };

+    onscreen_canvas.onpointerdown = function(event) {

+        // Arrange that all mouse (and pointer) events are sent to

+        // this element until all buttons are released.  We can assume

+        // that if we managed to receive a pointerdown event,

+        // Element.setPointerCapture() is available.

+        onscreen_canvas.setPointerCapture(event.pointerId);

+    }

     onscreen_canvas.onmousedown = function(event) {

         if (event.button >= 3)

             return;

@@ -665,6 +674,9 @@

         var restore_puzzle_size = Module.cwrap('restore_puzzle_size',

                                                'void', []);

         resize_handle.oncontextmenu = function(event) { return false; }

+        resize_handle.onpointerdown = function(event) {

+            resize_handle.setPointerCapture(event.pointerId);

+        }

         resize_handle.onmousedown = function(event) {

             if (event.button == 0) {

                 var xy = element_coords(onscreen_canvas);