diff --git a/src/omnioverlay.jsx b/src/omnioverlay.jsx
new file mode 100644
index 0000000..75b5bad
--- /dev/null
+++ b/src/omnioverlay.jsx
@@ -0,0 +1,49 @@
+import { Canvas } from "@react-three/fiber";
+import { OrbitControls } from "@react-three/drei";
+import React, {
+ Suspense,
+ useRef,
+ createContext,
+ memo,
+ useContext,
+} from "react";
+
+import { PlanetInfo } from "./planetInfo.jsx";
+import { MyContext } from "./Scene3.jsx";
+
+export const ScreenOverlay = () => {
+ const { customData } = useContext(MyContext);
+
+ const handleChange = (event) => {
+ customData.current.updateSpeed(event.target.value);
+ };
+
+ const handleReset = () => {
+ customData.current.handleReset();
+ console.log("reset");
+ };
+
+ const handlePlanetOverlayVisibility = () => {
+ customData.current.handleVisibility();
+ console.log("asd");
+ };
+
+ return (
+ <>
+
+
+
+
+
+
+
+ );
+};
diff --git a/src/overlay.jsx b/src/overlay.jsx
deleted file mode 100644
index 8b13789..0000000
--- a/src/overlay.jsx
+++ /dev/null
@@ -1 +0,0 @@
-
diff --git a/src/path.jsx b/src/path.jsx
index 142a000..395c9ba 100644
--- a/src/path.jsx
+++ b/src/path.jsx
@@ -6,12 +6,14 @@ import React, {
useLayoutEffect,
useEffect,
useState,
+ useContext,
} from "react";
import { useControls } from "leva";
import * as THREE from "three";
import glsl from "glslify";
import { TextureLoader } from "three/src/loaders/TextureLoader";
import { PlanetOverlay } from "./planetOverlay";
+import { PlanetOverlayContext } from "./SharedPlanetState";
export const PlanetPath = ({
positions,
@@ -22,37 +24,51 @@ export const PlanetPath = ({
lineAt,
planet,
}) => {
- let distanceScaleFactor = 1000000;
- const otherPoints = useRef([]);
- const counter = useRef(0);
- const shiftCounter = useRef(0);
- const [points, setPoints] = useState([]);
-
- /*const points = positions.map(
- (pos) =>
- new THREE.Vector3(
- pos.x / distanceScaleFactor,
- pos.y / distanceScaleFactor,
- pos.z / distanceScaleFactor
- )
- );*/
const lineref = useRef();
- //if (lineref) lineref.current.userData.counter = 0;
+ const { speed } = useContext(PlanetOverlayContext);
- useLayoutEffect(() => {
- if (linePos) {
- for (var i = linePos.length - 1; i >= 0; i--) {
- otherPoints.current[i] = new THREE.Vector3(
- linePos[i].position.x / distanceScaleFactor,
- linePos[i].position.y / distanceScaleFactor,
- linePos[i].position.z / distanceScaleFactor
- );
+ useLayoutEffect(() => {});
+
+ useEffect(() => {});
+
+ /* const cutPath = (path, maxLength) => {
+ if (getLength(path) > maxLength) {
+ path.shift();
+ }
+ };*/
+
+ //from chatgpt very nice :D
+ const cutPath = (path, maxLength) => {
+ let length = getLength(path);
+ while (length > maxLength && path.length >= 2) {
+ const firstPoint = path[0];
+ const secondPoint = path[1];
+ const segmentLength = firstPoint.distanceTo(secondPoint);
+ if (segmentLength > maxLength) {
+ // If the first segment is longer than the maximum length,
+ // split it into multiple segments of the maximum length.
+ const numSegments = Math.ceil(segmentLength / maxLength);
+ const segmentDirection = secondPoint
+ .clone()
+ .sub(firstPoint)
+ .normalize();
+ const segmentLength = segmentLength / numSegments;
+ const newPoints = [firstPoint];
+ for (let i = 1; i < numSegments; i++) {
+ const newPoint = firstPoint
+ .clone()
+ .add(segmentDirection.clone().multiplyScalar(segmentLength * i));
+ newPoints.push(newPoint);
+ }
+ newPoints.push(secondPoint);
+ path.splice(0, 2, ...newPoints);
+ length = getLength(path);
+ } else {
+ path.shift();
+ length -= segmentLength;
}
}
- //console.log(otherPoints);
- });
-
- useEffect(() => {}, []);
+ };
function getLength(arrV3) {
let sum = 0;
@@ -61,45 +77,21 @@ export const PlanetPath = ({
}
return sum;
}
+
+ const lineGeometry = new THREE.BufferGeometry();
useFrame(() => {
- //console.log(planet);
- /* if (planet) {
- otherPoints.current.push(planet.current.position);
- //console.log(planet.current.position);
+ if (speed === 0) {
+ linePos.length = 0;
+ return;
}
- if (otherPoints.current.length > 0) {
- //console.log(otherPoints.current);
- //console.log(asd);
- lineref.current.geometry.setFromPoints(asd);
- lineref.current.geometry.setDrawRange(0, Infinity);
-
- //console.log(otherPoints);
- }*/
- //console.log(otherPoints);
- //var start = 0;
- //if (counter.current > lineLength) start = counter.current - lineLength;
- var realpoints = otherPoints.current.slice(
- shiftCounter.current,
- counter.current
- );
- //console.log(getLength(realpoints));
- if (realpoints.length > 0) {
- lineref.current.geometry.setFromPoints(realpoints);
- if (getLength(realpoints) > lineLength) {
- //console.log("cut");
- shiftCounter.current++;
- //realpoints.shift();
- }
- }
-
+ lineref.current.geometry.setFromPoints(linePos);
lineref.current.geometry.setDrawRange(0, Infinity);
- counter.current++;
- //console.log(counter.current);
+ cutPath(linePos, lineLength);
+ //console.log(getLength(linePos));
});
return (
<>
-
-
+
diff --git a/src/planetOverlay.jsx b/src/planetOverlay.jsx
index 96b48a8..95d94fc 100644
--- a/src/planetOverlay.jsx
+++ b/src/planetOverlay.jsx
@@ -26,11 +26,14 @@ import { MyContext } from "./Scene3";
import "./styles.css";
import PropTypes from "prop-types";
+import { PlanetOverlayContext } from "./SharedPlanetState";
export const PlanetOverlay = ({ planet }) => {
const ref = useRef();
let [opacity, setOpacity] = useState(0);
let [minDistance, setMinDistance] = useState(0);
+ const { nameVis, iconVis } = useContext(PlanetOverlayContext);
+
let [scolor, setSColor] = useState("white");
let [follow, setFollow] = useState(false);
const { camera } = useThree();
@@ -74,7 +77,7 @@ export const PlanetOverlay = ({ planet }) => {
setName(planet.current.userData.name);
setMinDistance(planet.current.userData.nearOvOp);
setSColor(planet.current.userData.scolor);
- }, [planet, name, minDistance, customData]);
+ }, [planet, name, minDistance, customData, iconVis, nameVis]);
useFrame(() => {
var distance = camera.position.distanceTo(planet.current.position);
@@ -87,6 +90,7 @@ export const PlanetOverlay = ({ planet }) => {
controls.current.target.copy(planet.current.position.clone());
controls.current.maxDistance = 20;
}
+ //console.log(iconVis);
}, []);
function startFollow() {
@@ -112,6 +116,7 @@ export const PlanetOverlay = ({ planet }) => {
className="icon"
onClick={handleClick}
onContextMenu={handleClick}
+ style={{ visibility: iconVis }}
>
- {name}
+
+ {name}
+