V 0.0.5

Author: ANYhackerfort

public/dcv/dcv3.glb

@@ -2,24 +2,24 @@ import React, { useState, useRef, Suspense } from "react";
 import { Canvas, useFrame } from "@react-three/fiber";
 import { OrbitControls, PerspectiveCamera, Environment } from "@react-three/drei";
 import * as THREE from "three";
-import CornerText from "../shared/2dText";
+import CornerText from "../miscellaneous/2DTexts/2dText.tsx";
 import ChatComponent from "../Assisstant/alltogether";
-import CircularTherm from "../labComponents/circularTherm/ThermometerMainComponent";
-import SmallKnob from "../labComponents/SmallKnob/smallKnob";
-import VVR from "../labComponents/VariableVoltageRegulator/mainframe";
-import BigKnob from "../labComponents/BigKnob/bigKnob";
-import Grid from "./grid";
-import RaycastingComponent from "../raycaster/lab1Raycaster";
-import LightSwitch from "../miscellaneous/switchAndCasing";
-import DVM from "../labComponents/DigitalVoltmeter/digitalVoltmeter.tsx";
+import CircularTherm from "../labComponents/SmallInstruments/circularTherm/ThermometerMainComponent.tsx";
+import SmallKnob from "../labComponents/knobs/smallKnob.tsx";
+import BigKnob from "../labComponents/knobs/currentKnob.tsx";
+import Grid from "../miscellaneous/planks/grid.tsx";
+import RaycastingComponent from "../raycasters/lab1Raycaster.tsx";
+import LightSwitch from "../clickables/VVR_switch/switchAndCasing.tsx";
+import DVM from "../labComponents/FrankHertzMainComp/digitalVoltmeter.tsx";
 import { FrontFaceContextProvider } from "../contexts/frontFaceContext.tsx";
 import { useFrontFaceContext } from "../hooks/useFrontFaceContext.tsx";
-import TripleOutput from "../labComponents/tripleOutPutPowerSupply/mainComponent.tsx";
-import CurrentInstrument from "../labComponents/Box/box.tsx";
-import OakPlank from "../planks/lightOak.tsx";
-import FrankHertzMain from "../labComponents/FrankhertzChasis/frankHertz.tsx";
-import CurrentRegulator from "../labComponents/FrankhertzChasis/currentRegulator.tsx";
-import ControlsComponent from "../miscellaneous/cameracontrol.tsx";
+import TripleOutput from "../labComponents/FrankHertzMainComp/tripleOutPutPowerSupply/mainComponent.tsx";
+import CurrentInstrument from "../labComponents/FrankHertzMainComp/currentInstrument.tsx";
+import OakPlank from "../miscellaneous/planks/lightOak.tsx";
+import FrankHertzMain from "../labComponents/FrankHertzMainComp/frankHertz.tsx";
+import CurrentRegulator from "../labComponents/FrankHertzMainComp/currentRegulator.tsx";
+import ControlsComponent from "../miscellaneous/controls/cameracontrol.tsx";
+import VVR from "../labComponents/FrankHertzMainComp/VariableVoltageRegulator/mainframe.tsx";
 
 interface CameraProps {
   xN: number
@@ -116,12 +116,14 @@ const GraphPaperComponent: React.FC = () => {
 
           {/* Components: From Bottom to Top*/}
           <Grid />
-          <TripleOutput position={[-20, -0.4, 0]} />
+          <TripleOutput position={[-22, -0.3, 22]} />
           <CurrentInstrument position={[27, 0.5, 0]} />
           <OakPlank />
-          <FrankHertzMain position={[5, 16, 0]}/>
+          <FrankHertzMain position={[5, 12, 0]}/>
           <CurrentRegulator position={[40, 26, 5]}/>
-          <DVM position={[25, 28, 23]} scale={[4.4, 4.8, 4.4]} unique_id="DVM_2"/>
+          <DVM position={[20, 30, 23]} scale={[1.7, 1.7, 1.85]} unique_id="DVM_2"/>
+          <VVR position={[-30, 24, 2]} />
+          <DVM position={[30, 80, 8]} scale={[1.7, 1.7, 1.85]} rotation={[0, Math.PI, 0]} unique_id="DVM_1"/>
         </Canvas>
       </div>
     </Suspense>

public/dcv/dcv4.glb

@@ -0,0 +1,73 @@
+import React, { useRef, useEffect, useState } from "react";
+import * as THREE from "three";
+import { useLoader } from "@react-three/fiber";
+import { GLTFLoader } from "three-stdlib";
+
+interface SwitchProps {
+  position: [number, number, number]; // Position prop
+  scale?: [number, number, number];
+  rotation?: [number, number, number]; // Optional rotation prop
+  unique_id: string;
+}
+
+const Switch: React.FC<SwitchProps> = ({
+  position,
+  scale = [1, 1, 1],
+  rotation = [0, 0, 0],
+  unique_id,
+}) => {
+  const [isOn, setIsOn] = useState(false); // State for the switch position
+  const groupRef = useRef<THREE.Group | null>(null);
+
+  // Load the "on" and "off" models
+  const onModelGLTF = useLoader(GLTFLoader, "/switch/switch_button2.glb");
+  const offModelGLTF = useLoader(GLTFLoader, "/switch/switch_button_off.glb");
+
+  const [onModel, setOnModel] = useState<THREE.Object3D | null>(null);
+  const [offModel, setOffModel] = useState<THREE.Object3D | null>(null);
+
+  useEffect(() => {
+    const handleClick = () => {
+      setIsOn((prevState) => !prevState);
+    };
+
+    // Add interaction handlers to the models
+    const applyUserData = (model: THREE.Object3D, type_switch: string) => {
+      const clonedScene = model.clone();
+      clonedScene.traverse((child) => {
+        if ((child as THREE.Mesh).isMesh) {
+          const mesh = child as THREE.Mesh;
+          mesh.userData.unique_id = unique_id;
+          mesh.userData.handleIntersect = handleClick;
+          mesh.userData.type = "switch_button";
+        }
+      });
+      if (type_switch == "on") {
+        setOnModel(clonedScene);
+      } else {
+        setOffModel(clonedScene);
+      }
+    };
+
+    if (onModelGLTF.scene) applyUserData(onModelGLTF.scene, "on");
+    if (offModelGLTF.scene) applyUserData(offModelGLTF.scene, "off");
+
+  }, [onModelGLTF, offModelGLTF, unique_id]);
+
+  return (
+    <group ref={groupRef} position={position} rotation={rotation} scale={scale}>
+      {isOn ? (
+        onModel && <primitive object={onModel} position={[-20.8, -14.9, -1]} />
+      ) : (
+        offModel && (
+          <primitive
+            object={offModel}
+            rotation={[0, 0, Math.PI]} 
+          />
+        )
+      )}
+    </group>
+  );  
+};
+
+export default Switch;

public/dvm.jpg

@@ -0,0 +1,49 @@
+import React, { useRef, useEffect, useState } from "react"
+import * as THREE from "three"
+import { useLoader } from "@react-three/fiber"
+import { GLTFLoader } from "three-stdlib"
+import Switch from "./switch"
+
+interface LightSwitchProps {
+  position: [number, number, number] // Position prop
+  rotation?: [number, number, number] // Optional rotation prop
+  unique_id: string
+  scale?: [number, number, number]
+}
+
+const LightSwitch: React.FC<LightSwitchProps> = ({
+  position,
+  rotation = [Math.PI, Math.PI, Math.PI / 2], // Default to 90 degrees around the Y-axis
+  unique_id,
+  scale = [0.2, 0.2, 0.2],
+}) => {
+  const gltf = useLoader(GLTFLoader, "/switch/switch_casing1.glb")
+  const [model, setModel] = useState<THREE.Object3D | null>(null)
+  const groupRef = useRef<THREE.Group | null>(null)
+
+  // Clone and prepare the model
+  useEffect(() => {
+    if (gltf.scene) {
+      const clonedScene = gltf.scene.clone()
+
+      clonedScene.traverse((child) => {
+        if ((child as THREE.Mesh).isMesh) {
+          const mesh = child as THREE.Mesh
+          mesh.userData.unique_id = unique_id
+          mesh.userData.type = "switch_casing"
+        }
+      })
+
+      setModel(clonedScene)
+    }
+  }, [gltf, unique_id])
+
+  return (
+    <group ref={groupRef} position={position} rotation={rotation} scale={scale}>
+      {model && <primitive object={model}/>}
+      <Switch position={[20.85,14.9,1.2]} unique_id={"tops_switch_1"} />
+    </group>
+  )
+}
+
+export default LightSwitch

public/green_material.mtl

@@ -1,7 +1,6 @@
 import React from "react"
 import Button2 from "./longButton"
 import Button1 from "./circleAndTriangleButton"
-import TriangleButton from "./triangleButton"
 
 interface Button {
   id: string
@@ -10,7 +9,8 @@ interface Button {
   rotation: [number, number, number]
   scale: [number, number, number]
   type: string
-  typeGen: string
+  key: string
+  typeGen?: string | null;
 }
 
 interface ButtonComponentProps {
@@ -29,7 +29,7 @@ const ButtonComponent: React.FC<ButtonComponentProps> = ({ buttons }) => {
               position={button.position}
               rotation={button.rotation}
               scale={button.scale}
-              typeGen={button.typeGen}
+              typeGen={button.typeGen ?? "circleButton"} 
             />
           )
         } else if (button.type === "type2") {

public/image.png

@@ -42,6 +42,7 @@ const Button1: React.FC<ButtonProps> = ({
           const mesh = child as THREE.Mesh;
           mesh.userData.unique_id = unique_id;
           mesh.userData.handleIntersect = handleClick;
+          mesh.userData.type = "triangle_circle_button";
         }
       });
 
@@ -56,17 +57,17 @@ const Button1: React.FC<ButtonProps> = ({
 
       if (isMovingForward) {
         const targetY = position[1] - 0.5;
-        groupRef.current.position.y = THREE.MathUtils.lerp(posY, targetY, 0.1);
+        groupRef.current.position.y = THREE.MathUtils.lerp(posY, targetY, 0.6);
 
         if (Math.abs(posY - targetY) < 0.01) {
           setIsMovingForward(false);
-          setTimeout(() => setIsMovingBack(true), 300);
+          setTimeout(() => setIsMovingBack(true), 50);
         }
       }
 
       if (isMovingBack) {
         const targetY = position[1];
-        groupRef.current.position.y = THREE.MathUtils.lerp(posY, targetY, 0.1);
+        groupRef.current.position.y = THREE.MathUtils.lerp(posY, targetY, 0.4);
 
         if (Math.abs(posY - targetY) < 0.01) {
           setIsMovingBack(false);