Merge pull request #98931 from adamscott/fix-ime-web-issues

[Web] Fix issue where focus timer would throw continuously

platform/web/js/libs/library_godot_input.js

@@ -38,41 +38,57 @@ const GodotIME = {
 	$GodotIME: {
 		ime: null,
 		active: false,
+		focusTimerIntervalId: -1,
 
 		getModifiers: function (evt) {
 			return (evt.shiftKey + 0) + ((evt.altKey + 0) << 1) + ((evt.ctrlKey + 0) << 2) + ((evt.metaKey + 0) << 3);
 		},
 
 		ime_active: function (active) {
-			function focus_timer() {
-				GodotIME.active = true;
-				GodotIME.ime.focus();
+			function clearFocusTimerInterval() {
+				clearInterval(GodotIME.focusTimerIntervalId);
+				GodotIME.focusTimerIntervalId = -1;
 			}
 
-			if (GodotIME.ime) {
-				if (active) {
-					GodotIME.ime.style.display = 'block';
-					setInterval(focus_timer, 100);
-				} else {
-					GodotIME.ime.style.display = 'none';
-					GodotConfig.canvas.focus();
-					GodotIME.active = false;
+			function focusTimer() {
+				if (GodotIME.ime == null) {
+					clearFocusTimerInterval();
+					return;
 				}
+				GodotIME.ime.focus();
+			}
+
+			if (GodotIME.focusTimerIntervalId > -1) {
+				clearFocusTimerInterval();
+			}
+
+			if (GodotIME.ime == null) {
+				return;
+			}
+
+			GodotIME.active = active;
+			if (active) {
+				GodotIME.ime.style.display = 'block';
+				GodotIME.focusTimerIntervalId = setInterval(focusTimer, 100);
+			} else {
+				GodotIME.ime.style.display = 'none';
+				GodotConfig.canvas.focus();
 			}
 		},
 
 		ime_position: function (x, y) {
-			if (GodotIME.ime) {
-				const canvas = GodotConfig.canvas;
-				const rect = canvas.getBoundingClientRect();
-				const rw = canvas.width / rect.width;
-				const rh = canvas.height / rect.height;
-				const clx = (x / rw) + rect.x;
-				const cly = (y / rh) + rect.y;
-
-				GodotIME.ime.style.left = `${clx}px`;
-				GodotIME.ime.style.top = `${cly}px`;
+			if (GodotIME.ime == null) {
+				return;
 			}
+			const canvas = GodotConfig.canvas;
+			const rect = canvas.getBoundingClientRect();
+			const rw = canvas.width / rect.width;
+			const rh = canvas.height / rect.height;
+			const clx = (x / rw) + rect.x;
+			const cly = (y / rh) + rect.y;
+
+			GodotIME.ime.style.left = `${clx}px`;
+			GodotIME.ime.style.top = `${cly}px`;
 		},
 
 		init: function (ime_cb, key_cb, code, key) {
@@ -84,20 +100,27 @@ const GodotIME = {
 				evt.preventDefault();
 			}
 			function ime_event_cb(event) {
-				if (GodotIME.ime) {
-					if (event.type === 'compositionstart') {
-						ime_cb(0, null);
-						GodotIME.ime.innerHTML = '';
-					} else if (event.type === 'compositionupdate') {
-						const ptr = GodotRuntime.allocString(event.data);
-						ime_cb(1, ptr);
-						GodotRuntime.free(ptr);
-					} else if (event.type === 'compositionend') {
-						const ptr = GodotRuntime.allocString(event.data);
-						ime_cb(2, ptr);
-						GodotRuntime.free(ptr);
-						GodotIME.ime.innerHTML = '';
-					}
+				if (GodotIME.ime == null) {
+					return;
+				}
+				switch (event.type) {
+				case 'compositionstart':
+					ime_cb(0, null);
+					GodotIME.ime.innerHTML = '';
+					break;
+				case 'compositionupdate': {
+					const ptr = GodotRuntime.allocString(event.data);
+					ime_cb(1, ptr);
+					GodotRuntime.free(ptr);
+				} break;
+				case 'compositionend': {
+					const ptr = GodotRuntime.allocString(event.data);
+					ime_cb(2, ptr);
+					GodotRuntime.free(ptr);
+					GodotIME.ime.innerHTML = '';
+				} break;
+				default:
+					// Do nothing.
 				}
 			}
 
@@ -133,10 +156,15 @@ const GodotIME = {
 		},
 
 		clear: function () {
-			if (GodotIME.ime) {
-				GodotIME.ime.remove();
-				GodotIME.ime = null;
+			if (GodotIME.ime == null) {
+				return;
+			}
+			if (GodotIME.focusTimerIntervalId > -1) {
+				clearInterval(GodotIME.focusTimerIntervalId);
+				GodotIME.focusTimerIntervalId = -1;
 			}
+			GodotIME.ime.remove();
+			GodotIME.ime = null;
 		},
 	},
 };