NEOの格子模様の箇所をタッチした時のスクロールするしないの制御をtemplate内からneo.jsへ。

satopian · Jan 14, 2025 · 866ddc3 · 866ddc3
1 parent d78113e
commit 866ddc3
Show file tree

Hide file tree

Showing 2 changed files with 68 additions and 32 deletions.
diff --git a/potiboard5/neo.js b/potiboard5/neo.js
@@ -10,7 +10,7 @@ document.addEventListener("DOMContentLoaded", function () {
 
 var Neo = function () {};
 
-Neo.version = "1.6.11";
+Neo.version = "1.6.12";
 Neo.painter;
 Neo.fullScreen = false;
 Neo.uploaded = false;
@@ -247,6 +247,64 @@ Neo.initConfig = function (applet) {
   Neo.reservePen = Neo.clone(Neo.config.reserves[0]);
   Neo.reserveEraser = Neo.clone(Neo.config.reserves[1]);
 };
+document.addEventListener("DOMContentLoaded", () => {
+  // ピンチズーム検出
+  Neo.isPinchZooming = function () {
+    if ("visualViewport" in window) {
+      return window.visualViewport.scale > 1;
+    } else {
+      return document.documentElement.clientWidth > window.innerWidth;
+    }
+  };
+
+  // グリッド部分の touchmove イベントのデフォルトの動作をキャンセル
+  Neo.touch_move_grid_control = function (e) {
+    if (Neo.config.neo_disable_grid_touch_move) {
+      let screenwidth = Number(screen.width);
+      if (screenwidth - Neo.config.applet_width > 100) {
+        if (typeof e.cancelable !== "boolean" || e.cancelable) {
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      }
+    }
+  };
+
+  // グリッド部分の touchmove イベントをキャンセルする関数をイベントリスナーに追加
+  Neo.add_touch_move_grid_control = function () {
+    if (Neo.config.neo_disable_grid_touch_move) {
+      // すでにリスナーが追加されていない場合のみ追加
+      const elementNeo = document.getElementById("NEO");
+      if (!elementNeo._touchMoveListenerAdded) {
+        elementNeo.addEventListener("touchmove", Neo.touch_move_grid_control, {
+          passive: false,
+        });
+        elementNeo._touchMoveListenerAdded = true; // リスナーが追加されたことを記録
+      }
+    }
+  };
+
+  // グリッド部分の touchmove イベントをキャンセルする関数の追加とリムーブ
+  document.getElementById("NEO").addEventListener("touchmove", function (e) {
+    if (Neo.config.neo_disable_grid_touch_move) {
+      Neo.add_touch_move_grid_control();
+      if (Neo.isPinchZooming()) {
+        const elementNeo = document.getElementById("NEO");
+        elementNeo.removeEventListener(
+          "touchmove",
+          Neo.touch_move_grid_control,
+          {
+            passive: false,
+          },
+        );
+        elementNeo._touchMoveListenerAdded = false; // リスナーが削除されたことを記録
+      }
+    }
+  });
+
+  // 初期化
+  Neo.add_touch_move_grid_control();
+});
 
 Neo.fixConfig = function (value) {
   // javaでは"#12345"を色として解釈するがjavascriptでは"#012345"に変換しないとだめ
@@ -2246,6 +2304,14 @@ Neo.Painter.prototype._keyDownHandler = function (e) {
   if ((e.ctrlKey || e.metaKey) && keys.includes(e.key.toLowerCase())) {
     e.preventDefault();
   }
+  //FirefoxのメニューがAltキーで開閉しないようにする
+  document.addEventListener("keyup", (e) => {
+    // e.key を利用して特定のキーのアップイベントを検知する
+    if (e.key.toLowerCase() === "alt") {
+      e.preventDefault(); // Altキーのデフォルトの動作をキャンセル
+    }
+  });
+
   //text入力と、入力フォーム以外はすべてのキーボードイベントを無効化
   if (document.activeElement != this.inputText) {
     if (

diff --git a/potiboard5/templates/mono_en/mono_paint.blade.php b/potiboard5/templates/mono_en/mono_paint.blade.php
@@ -49,37 +49,6 @@
 			<link rel="stylesheet" href="neo.css?{{$parameter_day}}&{{$ver}}">
 			<script src="neo.js?{{$parameter_day}}&{{$ver}}"></script>
 		<script>
-			// https://qiita.com/tsmd/items/cfb5dcbec8433b87dc36
-			function isPinchZooming () {//ピンチズームを検知
-				if ('visualViewport' in window) {
-					return window.visualViewport.scale > 1
-				} else {
-					return document.documentElement.clientWidth > window.innerWidth
-				}
-			}
-		
-			function neo_disable_touch_move (e) {//NEOの網目でスワイプしない
-				let screenwidth = Number(screen.width);
-				let appw = Number({{$w}});
-				if((screenwidth-appw)>100){
-					if (typeof e.cancelable !== 'boolean' || e.cancelable) {
-					e.preventDefault();
-					e.stopPropagation();
-					}
-				}
-			}
-		
-			function neo_add_disable_touch_move() {
-				document.getElementById('NEO').addEventListener('touchmove', neo_disable_touch_move ,{ passive: false });
-			}
-			document.addEventListener('touchmove', function(e) {
-				neo_add_disable_touch_move();
-				if(isPinchZooming ()){//ピンチズーム使用時はNEOの網目でスワイプする
-					document.getElementById('NEO').removeEventListener('touchmove', neo_disable_touch_move ,{ passive: false });
-				}
-			});
-			window.addEventListener('DOMContentLoaded',neo_add_disable_touch_move,false);
-
 			Neo.handleExit=()=>{
 			@if($rep)
 			// 画像差し換えに必要なフォームデータをセット
@@ -347,6 +316,7 @@ function GradSelC(){if(d.grad.view.checked){d=document.grad;l=ps.length;pe="";fo
 						<param name="neo_confirm_unload" value="true">
 						<param name="neo_show_right_button" value="true">
 						<param name="neo_animation_skip" value="true">
+						<param name="neo_disable_grid_touch_move" value="true">
 					@else 
 					<applet code="pbbs.PaintBBS.class" archive="./PaintBBS.jar" name="paintbbs" width="{{$w}}" height="{{$h}}" mayscript>
 					@endif