added mouse button hook

src/components/Prototype3.tsx

@@ -18,6 +18,7 @@ import { findElementsInGaze } from 'src/hooks/findElementsInGaze';
 import { useKeyDown } from 'src/hooks/useKeyDown';
 import useWorldSim from 'src/hooks/useWorldSim';
 import type { Message } from 'src/types/schema-types';
+import { useMouseButtonDown } from 'src/hooks/useMouseButtonDown';
 
 const Prototype3 = () => {
   const [messages, setMessages] = useState<string[]>([]);
@@ -31,9 +32,10 @@ const Prototype3 = () => {
   const widgets = useAppSelector(getWidgets);
   const mousePosition = useMousePosition();
   const keyDown = useKeyDown();
+  const mouseButtonDown = useMouseButtonDown();
 
   const { messages: worldSimMessages } = useWorldSim();
-  console.log('worldSimMessages:', worldSimMessages);
+  //console.log('worldSimMessages:', worldSimMessages);
 
   useEffect(() => {
     const elementsInGaze = findElementsInGaze(

src/hooks/useMouseButtonDown.ts

@@ -0,0 +1,33 @@
+import { useEffect, useState } from 'react';
+
+export type Position = {
+  x: number;
+  y: number;
+};
+
+const initialState: Position = {
+  x: 0,
+  y: 0,
+};
+
+export function useMouseButtonDown() {
+  const [mouseButtDown, setMouseButtDown] = useState<Number>(-1);
+
+  useEffect(() => {
+    function handleMouseButtonDown(ev: MouseEvent) {
+        if(ev.button===0 || ev.button===1 || ev.button===2){
+            setMouseButtDown(ev.button);
+            console.log("Mouse button pressed: " + ev.button);
+        }
+    }
+
+    document.addEventListener('mouseup', handleMouseButtonDown);
+
+    // Don't forget to clean up
+    return () => {
+        document.removeEventListener('mouseup', handleMouseButtonDown);
+    }
+  });
+
+  return mouseButtDown;
+}