SVGHMI: prevent unwnted context menu and pinch zoom svghmi
authorEdouard Tisserant
Wed, 02 Dec 2020 14:31:57 +0100
branchsvghmi
changeset 3082 20a5eb6a02e6
parent 3081 9e55061c87fa
child 3083 45f044cf845b
SVGHMI: prevent unwnted context menu and pinch zoom
svghmi/gen_index_xhtml.ysl2
svghmi/svghmi.js
--- a/svghmi/gen_index_xhtml.ysl2	Wed Dec 02 14:30:58 2020 +0100
+++ b/svghmi/gen_index_xhtml.ysl2	Wed Dec 02 14:31:57 2020 +0100
@@ -66,7 +66,9 @@
              xmlns:svg="http://www.w3.org/2000/svg"
              xmlns:xlink="http://www.w3.org/1999/xlink" {
             head;
-            body style="margin:0;overflow:hidden;user-select:none;" {
+            // prevents user selection by mouse click / touch and drag
+            // prevents pinch zoom and other accidental panning panning with touch devices
+            body style="margin:0;overflow:hidden;user-select:none;touch-action:none;" {
                 // Inline SVG
                 copy "$result_svg";
                 script{
--- a/svghmi/svghmi.js	Wed Dec 02 14:30:58 2020 +0100
+++ b/svghmi/svghmi.js	Wed Dec 02 14:31:57 2020 +0100
@@ -311,6 +311,11 @@
 var current_page_index;
 
 function prepare_svg() {
+    // prevents context menu from appearing on right click and long touch
+    document.body.addEventListener('contextmenu', e => {
+        e.preventDefault();
+    });
+
     for(let eltid in detachable_elements){
         let [element,parent] = detachable_elements[eltid];
         parent.removeChild(element);