mass generating blue orbs progress

src/components/BlueOrb/BlueOrb.tsx

@@ -9,6 +9,8 @@ import SSkn from "../../static/sprites/SSkn.png";
 import SSKnActive from "../../static/sprites/SSkn_active.png";
 import Tda from "../../static/sprites/Tda.png";
 import TdaActive from "../../static/sprites/Tda_active.png";
+import GaTE from "../../static/sprites/GaTE.png";
+import GaTEActive from "../../static/sprites/GaTE_active.png";
 
 type BlueOrbContructorProps = {
   sprite: string;
@@ -33,6 +35,7 @@ const BlueOrb = memo((props: BlueOrbContructorProps) => {
       Tda: [Tda, TdaActive],
       SSkn: [SSkn, SSKnActive],
       Cou: [Cou, CouActive],
+      GaTE: [GaTE, GaTEActive],
     } as SpriteToPath)[sprite];
   };
 

src/components/GrayPlanes/GrayPlanes.tsx

@@ -44,33 +44,34 @@ const GrayPlanes = memo(() => {
   });
 
   return (
-    <a.group
+    // separate wrapper group to make it rotate around [0,0,0]
-      position={[0.1, 0, -2]}
+    <a.group rotation-y={grayPlaneState.grayPlaneRotY}>
-      position-y={grayPlaneState.grayPlanePosY}
+      <a.group
-      rotation={[0, 0, 0]}
+        position={[0.1, 0, -2]}
-      rotation-y={grayPlaneState.grayPlaneRotY}
+        position-y={grayPlaneState.grayPlanePosY}
-      ref={grayPlaneGroupRef}
+        ref={grayPlaneGroupRef}
-      visible={grayPlanesVisible}
+        visible={grayPlanesVisible}
-    >
+      >
-      {grayPlaneRefs.map((ref, idx: number) => {
+        {grayPlaneRefs.map((ref, idx: number) => {
-        return (
+          return (
-          <mesh
+            <mesh
-            scale={[0.04, 10, 0.04]}
+              scale={[0.04, 10, 0.04]}
-            position={grayPlanePoses[idx] as [number, number, number]}
+              position={grayPlanePoses[idx] as [number, number, number]}
-            ref={ref}
+              ref={ref}
-            key={idx}
+              key={idx}
-          >
+            >
-            <planeBufferGeometry attach="geometry" />
+              <planeBufferGeometry attach="geometry" />
-            <meshBasicMaterial
+              <meshBasicMaterial
-              attach="material"
+                attach="material"
-              color={0xd3d3d3}
+                color={0xd3d3d3}
-              opacity={0.2}
+                opacity={0.2}
-              transparent={true}
+                transparent={true}
-              side={THREE.DoubleSide}
+                side={THREE.DoubleSide}
-            />
+              />
-          </mesh>
+            </mesh>
-        );
+          );
-      })}
+        })}
+      </a.group>
     </a.group>
   );
 });

src/components/GrayRing.tsx

@@ -62,8 +62,9 @@ const GrayRing = memo((props: GrayRingProps) => {
     vec4 color(vec2 vUv, int quadnum, bool textureexists, int thinperiod, int quadlen, float step) {
       if (!textureexists) {
         return vec4(0.259,0.259,0.322, 1);
-      } else if (quadnum % 2 == 1) {
+      } else if (uint(quadnum) % uint(2) == uint(1)) {
         return texture2D(hole, vec2(tolocal(vUv.x, quadlen-thinperiod, step), vUv.y));
+          // return vec4(tolocal(vUv.x, quadlen-thinperiod, step), 0, 0, 1);
       } else if (quadnum == 0) {
         return texture2D(lof, vec2(tolocal(vUv.x, quadlen-thinperiod, step), vUv.y));
       } else {
@@ -84,18 +85,18 @@ const GrayRing = memo((props: GrayRingProps) => {
       int quadlen = int(step)/4;
       
       // segment within circle's quad
-      int quadel = int(segment) % quadlen;
+      uint quadel = uint(segment) % uint(quadlen);
       
       // which quad
-      int quadnum = int(segment) / quadlen;
+      int quadnum = int(uint(segment) / uint(quadlen));
      
      // how big thin part is
      int thinperiod = 8;
      
-      if (quadel < thinperiod && isheight(vUv.y, thin)) {
+      if (quadel < uint(thinperiod) && isheight(vUv.y, thin)) {
           // thin line
           gl_FragColor = color(vUv, quadnum, false, thinperiod, quadlen, step);
-      } else if (quadel == thinperiod) {
+      } else if (quadel == uint(thinperiod)) {
           // slope up
           float dist = tolocal(vUv.x, 1, step);
           if (vUv.y > slope(1.0-dist, thin) && vUv.y < 1.0-slope(1.0-dist, thin)) {
@@ -103,7 +104,7 @@ const GrayRing = memo((props: GrayRingProps) => {
           } else {
               gl_FragColor = vec4(0, 0, 0, 0);
           }
-      } else if (quadel == quadlen-1) {
+      } else if (quadel == uint(quadlen-1)) {
           // slope down
           float dist = tolocal(vUv.x, 1, step);
           if (vUv.y > slope(dist, thin) && vUv.y < 1.0-slope(dist, thin)) {
@@ -111,7 +112,7 @@ const GrayRing = memo((props: GrayRingProps) => {
           } else {
               gl_FragColor = vec4(0, 0, 0, 0);
           }
-      } else if (quadel > thinperiod) {
+      } else if (quadel > uint(thinperiod)) {
             gl_FragColor = color(vUv, quadnum, true, thinperiod, quadlen, step);
       } else {
           // transparent

src/components/HUD/HUDElement.tsx

@@ -11,8 +11,6 @@ import { a, useSpring } from "@react-spring/three";
 import { useRecoilValue } from "recoil";
 import { hudActiveAtom } from "./HUDElementAtom";
 import { currentHUDAtom } from "./HUDElementAtom";
-import level_y_values from "../../resources/level_y_values.json";
-import { currentBlueOrbAtom } from "../BlueOrb/CurrentBlueOrbAtom";
 
 export type HUDElementProps = {
   hudVisibility: boolean;
@@ -38,11 +36,10 @@ export type BlueOrbHuds = {
 type LevelYValues = {
   [level: string]: number;
 };
+
 const HUDElement = memo((props: HUDElementProps) => {
   const currentBlueOrbHUD = useRecoilValue(currentHUDAtom);
 
-  const currentBlueOrb = useRecoilValue(currentBlueOrbAtom);
-
   const hudActive = useRecoilValue(hudActiveAtom);
 
   const { bigHUDPositionX } = useSpring({

src/components/MainScene/CameraAtom.tsx

@@ -7,7 +7,7 @@ export const camPosYAtom = atom({
 
 export const camRotYAtom = atom({
   key: "camRotYAtom",
-  default: -0.55,
+  default: 2.75,
 });
 
 // export const camPosYAtom = atom({

src/components/PurpleRing.tsx

@@ -88,18 +88,18 @@ const PurpleRing = memo((props: PurpleRingProps) => {
       float thick = 1.0;
       float slopefactor = 1.0;
       
-      int halfc = int(step)/2;
+      uint halfc = uint(step)/uint(2);
       
       // segment within circle
-      int segment = int(floor(vUv.x * step));
+      uint segment = uint(floor(vUv.x * step));
-      int thinperiod = halfc-8;
+      uint thinperiod = halfc-uint(8);
      
-     int halfel = segment % halfc;
+      uint halfel = segment % halfc;
      
-      if (halfel < thinperiod-1 && istop(vUv.y, thin)) {
+      if (halfel < thinperiod-uint(1) && istop(vUv.y, thin)) {
           // thin line top
           gl_FragColor = color(vUv, step, false);
-      } else if (halfel == thinperiod - 1) {
+      } else if (halfel == thinperiod - uint(1)) {
           // thin line and corner
           float dist = tolocal(vUv.x, 1, step);
           float val = 1.0-slope(1.0-dist, thin);
@@ -117,10 +117,10 @@ const PurpleRing = memo((props: PurpleRingProps) => {
           } else {
               gl_FragColor = vec4(0, 0, 0, 0);
           }
-      } else if (halfel == thinperiod+1 && isbottom(vUv.y, thin)) {
+      } else if (halfel == thinperiod+uint(1) && isbottom(vUv.y, thin)) {
           // thin line bottom
           gl_FragColor = vec4(0.325,0.325,0.698, 1);
-      } else if (halfel == thinperiod + 2) {
+      } else if (halfel == thinperiod + uint(2)) {
           // slope up
           float dist = tolocal(vUv.x, 1, step);
           float val = 1.0-slope(1.0-dist, thin);
@@ -129,10 +129,10 @@ const PurpleRing = memo((props: PurpleRingProps) => {
           } else {
               gl_FragColor = vec4(0, 0, 0, 0);
           }        
-      } else if (halfel > thinperiod + 2 && halfel < thinperiod+7) {
+      } else if (halfel > thinperiod + uint(2) && halfel < thinperiod+uint(7)) {
           // thick part
           gl_FragColor = color(vUv, step, true);
-      } else if (halfel == thinperiod+7) {
+      } else if (halfel == thinperiod+uint(7)) {
           // slope up
           float dist = tolocal(vUv.x, 1, step);
           float val = slope(dist, thin);

src/resources/blue_orb_directions.json

@@ -33,7 +33,7 @@
     "up": "",
     "down": "",
     "left": "0506",
-    "right": ""
+    "right": "+0520"
   },
   "0515": {
     "up": "",
@@ -47,10 +47,16 @@
     "left": "+0517",
     "right": ""
   },
-  "0500": {
+  "0517": {
-    "up": "0508",
+    "up": "",
     "down": "",
-    "left": "+0517",
+    "left": "+0500",
+    "right": ""
+  },
+  "0500": {
+    "up": "",
+    "down": "",
+    "left": "0510",
     "right": ""
   }
 }

src/resources/blue_orb_huds.json

@@ -161,22 +161,62 @@
   },
   "17": {
     "long": {
-      "position": [-0.45, 0.15, -8.6],
+      "position": [0.85, 0.15, -8.6],
       "scale": [1, 0.03, 1],
-      "type": "normal",
+      "type": "mirrored",
-      "initial_position": [-1.45, 0.15, -8.6]
+      "initial_position": [1.45, 0.15, -8.6]
     },
     "boring": {
-      "position": [0.48, 0.174, -8.6],
+      "position": [-0.1, 0.174, -8.6],
       "scale": [1, 0.03, 1],
-      "type": "normal",
+      "type": "mirrored",
-      "initial_position": [1.48, 0.174, -8.6]
+      "initial_position": [-1.48, 0.174, -8.6]
     },
     "big": {
-      "position": [0.36, 0.13, -8.6],
+      "position": [-0.35, 0.13, -8.6],
+      "scale": [0.5, 0.06, 1],
+      "type": "mirrored",
+      "initial_position": [-1.36, 0.13, -8.6]
+    }
+  },
+  "10": {
+    "long": {
+      "position": [-0.45, -0.09, -8.6],
+      "scale": [1, 0.03, 1],
+      "type": "normal",
+      "initial_position": [-1.45, -0.09, -8.6]
+    },
+    "boring": {
+      "position": [0.5, -0.07, -8.6],
+      "scale": [1, 0.03, 1],
+      "type": "normal",
+      "initial_position": [1.48, -0.07, -8.6]
+    },
+    "big": {
+      "position": [0.35, -0.12, -8.6],
       "scale": [0.5, 0.06, 1],
       "type": "normal",
-      "initial_position": [1.36, 0.13, -8.6]
+      "initial_position": [1.36, -0.12, -8.6]
+    }
+  },
+  "20": {
+    "long": {
+      "position": [0.85, 0.15, -8.6],
+      "scale": [1, 0.03, 1],
+      "type": "mirrored",
+      "initial_position": [1.45, 0.15, -8.6]
+    },
+    "boring": {
+      "position": [-0.1, 0.174, -8.6],
+      "scale": [1, 0.03, 1],
+      "type": "mirrored",
+      "initial_position": [-1.48, 0.174, -8.6]
+    },
+    "big": {
+      "position": [-0.35, 0.13, -8.6],
+      "scale": [0.5, 0.06, 1],
+      "type": "mirrored",
+      "initial_position": [-1.36, 0.13, -8.6]
     }
   }
 }

src/resources/blue_orb_positons.json

@@ -0,0 +1,98 @@
+{
+  "05": {
+    "position": [0.4, -0.25, 1.3],
+    "rotation": [0, 0.2, 0]
+  },
+  "14": {
+    "position": [-0.35, 0, 1.3],
+    "rotation": [0, -0.15, 0]
+  },
+  "22": {
+    "position": [-0.35, 0.3, 1.3],
+    "rotation": [0, -0.15, 0]
+  },
+  "06": {
+    "position": [-0.35, -0.25, 1.3],
+    "rotation": [0, -0.25, 0]
+  },
+  "13": {
+    "position": [0.4, 0, 1.3],
+    "rotation": [0, 0.27, 0]
+  },
+  "15": {
+    "position": [-1, 0, 0.95],
+    "rotation": [0, -0.9, 0]
+  },
+  "08": {
+    "position": [-1.3, 0, 0.3],
+    "rotation": [0, -1.4, 0]
+  },
+  "00": {
+    "position": [-1.3, -0.25, 0.3],
+    "rotation": [0, -1.4, 0]
+  },
+  "10": {
+    "position": [-0.85, 0, -1.05],
+    "rotation": [0, -2.45, 0]
+  },
+  "16": {
+    "position": [-1.3, 0.3, 0.3],
+    "rotation": [0, -1.4, 0]
+  },
+  "17": {
+    "position": [-1.25, 0.3, -0.5],
+    "rotation": [0, -1.85, 0]
+  },
+  "20": {
+    "position": [1, 0.3, 0.9],
+    "rotation": [0, 0.69, 0]
+  },
+  "12": {
+    "position": [1, 0, 0.9],
+    "rotation": [0, 0.69, 0]
+  },
+  "4": {
+    "position": [1, -0.25, 0.9],
+    "rotation": [0, 0.69, 0]
+  },
+  "21": {
+    "position": [0.4, 0.3, 1.3],
+    "rotation": [0, 0.27, 0]
+  },
+  "23": {
+    "position": [-1, 0.3, 0.95],
+    "rotation": [0, -0.9, 0]
+  },
+  "07": {
+    "position": [-1, -0.25, 0.95],
+    "rotation": [0, -0.9, 0]
+  },
+  "09": {
+    "position": [-1.25, 0, -0.5],
+    "rotation": [0, -1.85, 0]
+  },
+  "01": {
+    "position": [-1.25, -0.25, -0.5],
+    "rotation": [0, -1.85, 0]
+  },
+  "18": {
+    "position": [-0.85, 0.3, -1.05],
+    "rotation": [0, -2.45, 0]
+  },
+  "02": {
+    "position": [-0.85, -0.25, -1.05],
+    "rotation": [0, -2.45, 0]
+  },
+  "03": {
+    "position": [-0.15, -0.25, -1.3],
+    "scale": [0.25, 0.15, 0.25]
+  },
+  "11": {
+    "position": [-0.15, 0, -1.3],
+    "scale": [0.25, 0.15, 0.25]
+  },
+  "19": {
+    "position": [-0.15, 0.3, -1.3],
+    "scale": [0.25, 0.15, 0.25]
+  }
+}

src/resources/blue_orbs.json

@@ -37,14 +37,14 @@
   "5": {
     "position": [0.4, 1.87, 1.3],
     "scale": [0.25, 0.15, 0.25],
-    "rotation": [0, 0.09, 0],
+    "rotation": [0, 0.27, 0],
     "sprite": "Dc",
     "id": "0513"
   },
   "6": {
     "position": [-1, 1.87, 0.95],
     "scale": [0.25, 0.15, 0.25],
-    "rotation": [0, -0.8, 0],
+    "rotation": [0, -0.9, 0],
     "sprite": "Tda",
     "id": "0515"
   },
@@ -70,10 +70,45 @@
     "id": "0517"
   },
   "10": {
-    "position": [-1.25, 2.17, -0.5],
+    "position": [-0.85, 1.87, -1.05],
+    "scale": [0.25, 0.15, 0.25],
+    "rotation": [0, -2.45, 0],
+    "sprite": "Cou",
+    "id": "0510"
+  },
+  "11": {
+    "position": [1, 2.17, 0.9],
+    "scale": [0.25, 0.15, 0.25],
+    "rotation": [0, 0.69, 0],
+    "sprite": "Cou",
+    "id": "0520"
+  },
+  "12": {
+    "position": [-1.3, 0.3, 0.3],
+    "scale": [0.25, 0.15, 0.25],
+    "rotation": [0, -1.4, 0],
+    "sprite": "Cou",
+    "id": "0416"
+  },
+  "13": {
+    "position": [-1.25, 0.3, -0.5],
     "scale": [0.25, 0.15, 0.25],
     "rotation": [0, -1.85, 0],
+    "sprite": "GaTE",
+    "id": "0417"
+  },
+  "14": {
+    "position": [1, 0.3, 0.9],
+    "scale": [0.25, 0.15, 0.25],
+    "rotation": [0, 0.69, 0],
     "sprite": "Tda",
-    "id": "0510"
+    "id": "0420"
+  },
+  "15": {
+    "position": [-0.15, 1.61, -1.3],
+    "scale": [0.25, 0.15, 0.25],
+    "rotation": [0, -2.85, 0],
+    "sprite": "Cou",
+    "id": "0603"
   }
 }