fix stuff

src/components/BubbleComponent.ts

@@ -1,8 +1,11 @@
-import { defineComponent, getComponent, useComponent } from "@etherealengine/engine/src/ecs/functions/ComponentFunctions"
-import { useEntityContext } from "@etherealengine/engine/src/ecs/functions/EntityFunctions"
+import { defineComponent, getComponent, setComponent, useComponent } from "@etherealengine/engine/src/ecs/functions/ComponentFunctions"
+import { createEntity, useEntityContext } from "@etherealengine/engine/src/ecs/functions/EntityFunctions"
 import { Color, Mesh, MeshStandardMaterial, SphereGeometry, Vector3 } from "three"
 import { useEffect } from "react"
 import { addObjectToGroup } from "@etherealengine/engine/src/scene/components/GroupComponent"
+import { createNewEditorNode } from "@etherealengine/engine/src/scene/systems/SceneLoadingSystem"
+import { Entity } from "@etherealengine/engine/src/ecs/classes/Entity"
+import { NameComponent } from "@etherealengine/engine/src/scene/components/NameComponent"
 
 export const BubbleComponent = defineComponent({
   //name: The human-readable label for the component. This will be displayed in the editor and debugging tools.
@@ -15,8 +18,9 @@ export const BubbleComponent = defineComponent({
     return {
       color: new Color(0xFFFFFF),
       direction: new Vector3(0, 1, 0),
-      speed: 1,
-      bubble: null as Mesh | null
+      speed: .1,
+      bubble: null as Mesh | null,
+      bubbleEntity: null as Entity | null
     }
   },
   //onSet: Set function that is called whenever the component's data is updated via the setComponent function. This is where deserialize logic should
@@ -46,9 +50,12 @@ export const BubbleComponent = defineComponent({
 
     //a useEffect with no dependencies will only run once, when the component is first initialized
     useEffect(() => {
+      bubbleComponent.bubbleEntity.set(createEntity())
+      createNewEditorNode(bubbleComponent.bubbleEntity.value!,[],entity)
+      setComponent(bubbleComponent.bubbleEntity.value!, NameComponent, "Bubble")
       const bubbleMesh = new Mesh(new SphereGeometry(), new MeshStandardMaterial())
       bubbleMesh.material.color = bubbleComponent.color.value
-      addObjectToGroup(entity, bubbleMesh)
+      addObjectToGroup(bubbleComponent.bubbleEntity.value!, bubbleMesh)
       bubbleComponent.bubble.set(bubbleMesh)
     }, [])
 

src/editors/BubbleComponentNodeEditor.tsx

@@ -6,6 +6,7 @@ import { BubbleComponent } from '../components/BubbleComponent'
 import NodeEditor from '@etherealengine/editor/src/components/properties/NodeEditor'
 import InputGroup from '@etherealengine/editor/src/components/inputs/InputGroup'
 import { ColorInput } from '@etherealengine/editor/src/components/inputs/ColorInput'
+import AlbumIcon from '@mui/icons-material/Album';
 
 
 export const BubbleNodeEditor: EditorComponentType = (props) => {
@@ -19,4 +20,5 @@ export const BubbleNodeEditor: EditorComponentType = (props) => {
         />
       </InputGroup>
     </NodeEditor>
-}
+}
+BubbleNodeEditor.iconComponent = AlbumIcon

src/systems/BubbleSystem.ts

@@ -1,17 +1,33 @@
-import { defineQuery, getComponent } from "@etherealengine/engine/src/ecs/functions/ComponentFunctions";
+import { defineQuery, getComponent, getMutableComponent } from "@etherealengine/engine/src/ecs/functions/ComponentFunctions";
 import { defineSystem } from "@etherealengine/engine/src/ecs/functions/SystemFunctions";
 import { BubbleComponent } from "../components/BubbleComponent";
 import { LocalTransformComponent } from "@etherealengine/engine/src/transform/components/TransformComponent";
+import { NO_PROXY, getState } from "@etherealengine/hyperflux";
+import { EngineState } from "@etherealengine/engine/src/ecs/classes/EngineState";
+import { Vector3 } from "three";
 
 const bubbleQuery = defineQuery([BubbleComponent])
 
+let collectedtime = 0 //Assign out of system so scope persists
+const tempvector = new Vector3(0,0,0)
+
 export const BubbleSystem = defineSystem({
   uuid: "BubbleSystem",
   execute: () => {
+    const { elapsedSeconds, deltaSeconds } = getState(EngineState)
     for (const entity of bubbleQuery()) {
       const bubbleComponent = getComponent(entity, BubbleComponent)
-      const localTransform = getComponent(entity, LocalTransformComponent)
-      localTransform.position.add(bubbleComponent.direction.clone().multiplyScalar(bubbleComponent.speed))
+      const localTransform = getMutableComponent(bubbleComponent.bubbleEntity!, LocalTransformComponent)
+      tempvector.addVectors(localTransform.position.value, bubbleComponent.direction.clone().multiplyScalar(bubbleComponent.speed))
+      localTransform?.position.set(tempvector)
+
+      if(collectedtime >= 5) { //Reset Position and collectedTime
+        tempvector.set(0,0,0)
+        localTransform.position.set(tempvector)
+        collectedtime = 0
+      } else {
+        collectedtime += deltaSeconds //CollectElapsed seconds since System has been ran
+      }
     }
   }
 })