try to prevent double tap on hint with stylus from zooming in

edloper · Dec 8, 2024 · ec50e04 · ec50e04
1 parent bf3fb7e
commit ec50e04
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 14 deletions.
diff --git a/game_fullscreen.html b/game_fullscreen.html
@@ -4,10 +4,10 @@
   <title>Missing Link</title>
   <meta name="apple-mobile-web-app-capable" content="yes"> 
   <meta name="mobile-web-app-capable" content="yes">
-  <link rel="apple-touch-icon" sizes="180x180" href="images/thumbnail.png">
-  <link rel="apple-touch-icon" sizes="152x152" href="images/thumbnail.png">
-  <link rel="apple-touch-icon" sizes="167x167" href="images/thumbnail.png">
-  <link rel="apple-touch-icon" sizes="120x120" href="images/thumbnail.png">
+  <link rel="apple-touch-icon" sizes="180x180" href="images/icon_blue.png">
+  <link rel="apple-touch-icon" sizes="152x152" href="images/icon_blue.png">
+  <link rel="apple-touch-icon" sizes="167x167" href="images/icon_blue.png">
+  <link rel="apple-touch-icon" sizes="120x120" href="images/icon_blue.png">
   <link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
   <link rel="stylesheet" href="style.css">
   <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
@@ -84,7 +84,7 @@
 </head>
 <body class="fullscreen" style>
   <div id="levelPicker">
-    Testing 1
+    Testing 2
     <img src="images/titles/title2.jpg" class="missingLinkTitle">
   </div>
   <div id="game" style="display: none"></div>

diff --git a/javascript/game.js b/javascript/game.js
@@ -140,16 +140,11 @@ class Game {
 	});
 
 	$("#gameUndo")
-	    .click(e => { this.undo(); e.preventDefault(); })
-	    .dblclick(e => { e.preventDefault(); })
-	    .on('pointerdown', e => { e.preventDefault(); })
-	    .on('stylusdown', e => { e.preventDefault(); });
+	    .mousedown(e => { this.undo(); e.preventDefault(); }, {passive: false} )
+	    .on('touchstart', e => { this.undo(); e.preventDefault(); }, {passive: false} );
 	$("#gameHint")
-	    .click(e => { this.hint(); e.preventDefault(); }, {passive: false} )
-	    .dblclick(e => { e.preventDefault(); }, {passive: false} )
-	    .on('touchstart', e => { e.preventDefault(); }, {passive: false} )
-	    .on('pointerdown', e => { e.preventDefault(); }, {passive: false} )
-	    .on('stylusdown', e => { e.preventDefault(); }, {passive: false} );
+	    .mousedown(e => { this.hint(); e.preventDefault(); }, {passive: false} )
+	    .on('touchstart', e => { this.hint(); e.preventDefault(); }, {passive: false} );
 	new ToggleButton($("#gameEasyMode"), {
 	    label: "Easy Mode",
 	    height: 30, width: 80,

diff --git a/style.css b/style.css
@@ -24,6 +24,7 @@
 	border-radius: 8px;
 	display: inline-block;
 	vertical-align: middle;
+	touch-action: none;
     }
     .actionButton img {
 	height: 40px;