statusの送信 10fps

src/pages/shooter/index.tsx

@@ -1,4 +1,9 @@
-import { type KeyboardEventHandler, useState } from "react";
+import {
+	type KeyboardEventHandler,
+	useCallback,
+	useEffect,
+	useState,
+} from "react";
 import { DefaultButton } from "../../components/ui/Button";
 import { Modal } from "../../components/ui/Modal";
 import { ShooterButton } from "../../components/ui/ShooterButton";
@@ -21,6 +26,50 @@ const Shooter = () => {
 	const [images, setImages] = useState(initialImages);
 	const uuid = useUUIDStore((state) => state.uuid);
 
+	const sendData = useCallback(
+		(mes_type: message_type) => {
+			const data: Schema = {
+				id: uuid,
+				interval: 0,
+				angle: {
+					x: orientationDiff.beta,
+					y: orientationDiff.gamma,
+				},
+				acceleration: {
+					x: 0,
+					y: 0,
+					z: 0,
+				},
+				distance: {
+					x: 0,
+					y: 0,
+					z: 0,
+				},
+				message_type: mes_type,
+				event_type: event_type.shooter,
+			};
+			console.log(data);
+			socketRef?.current?.send(JSON.stringify(data));
+		},
+		[uuid, orientationDiff, socketRef],
+	);
+
+	useEffect(() => {
+		let intervalId: number | null = null;
+
+		if (!isOpen) {
+			intervalId = window.setInterval(() => {
+				sendData(message_type.status);
+			}, 100);
+		}
+
+		return () => {
+			if (intervalId !== null) {
+				clearInterval(intervalId);
+			}
+		};
+	}, [isOpen, sendData]);
+
 	const handleClick = () => {
 		const audio = new Audio("/sound/cork_sound.mp3");
 		audio
@@ -29,27 +78,7 @@ const Shooter = () => {
 			.catch((error) => {
 				console.error("オーディオの音が出なかった", error);
 			});
-		const data: Schema = {
-			id: uuid,
-			interval: 0,
-			angle: {
-				x: orientationDiff.beta,
-				y: orientationDiff.gamma,
-			},
-			acceleration: {
-				x: 0,
-				y: 0,
-				z: 0,
-			},
-			distance: {
-				x: 0,
-				y: 0,
-				z: 0,
-			},
-			message_type: message_type.action,
-			event_type: event_type.shooter,
-		};
-		socketRef?.current?.send(JSON.stringify(data));
+		sendData(message_type.action);
 		setImages((prevImages) => prevImages.slice(1));
 	};
 

src/type/schema.ts

@@ -26,7 +26,7 @@ interface distance {
 }
 
 export enum message_type {
-	pointer = "pointer",
+	status = "status",
 	action = "action",
 }