Hi there, well first say am starting to know this soft but i cant found the help what i need.
iam trying to make a ECS component , this component apply to button on the stage, and the effect is when you click the object loaded white the component take a spcecific object 3d on the stage and rotate 5 grades ( in every click), i was triying to helpme whit AI but no one of the codes is runing, am gona leave the last code iam using but this make the screen go to white and i can see nothing:
// This is a component file. You can use this file to define a custom component for your project.
// This component will appear as a custom component in the editor.
import * as ecs from ‘@8thwall/ecs’ // Accedemos a la librería ECS de 8thwall
ecs.registerComponent({
name: ‘click_rotation’,
schema: {
// Aquí se pueden agregar configuraciones personalizables, si es necesario
},
schemaDefaults: {
// Configuración por defecto de los campos, si es necesario
},
data: {
// No necesitamos datos específicos fuera de la configuración para este ejemplo
},
add: (world, component) => {
// Inicializamos la lógica para detectar el clic
const handleClick = (event) => {
const intersectedObject = event.target // El objeto que fue clickeado
if (intersectedObject) {
// Al hacer clic en un objeto, rotamos 5 grados sobre el eje Y
const currentRotation = intersectedObject.rotation.y
intersectedObject.rotation.y = currentRotation + 5 * Math.PI / 180 // 5 grados a radianes
}
}
// Añadimos el detector de clics en el mundo
world.addEventListener('click', handleClick)
},
tick: (world, component) => {
// Si es necesario realizar alguna acción en cada fotograma (frame), lo pondríamos aquí
},
remove: (world, component) => {
// Aquí eliminamos el evento de clic cuando el componente se remueve
// world.removeEventListener(‘click’, handleClick)
},
})
// This is a component file. You can use this file to define a custom component for your project.
// This component will appear as a custom component in the editor.
import * as ecs from '@8thwall/ecs'
ecs.registerComponent({
name: 'click_rotation',
schema: {
// Aquí se pueden agregar configuraciones personalizables, si es necesario
},
schemaDefaults: {
// Configuración por defecto de los campos, si es necesario
},
data: {
// No necesitamos datos específicos fuera de la configuración para este ejemplo
},
add: (world, component) => {
// Inicializamos la lógica para detectar el clic
const handleClick = (event) => {
const intersectedObject = event.target // El objeto que fue clickeado
if (intersectedObject) {
// Al hacer clic en un objeto, rotamos 5 grados sobre el eje Y
const currentRotation = intersectedObject.rotation.y
// @ts-ignore
intersectedObject.rotation.y = currentRotation + 5 * Math.PI / 180 // 5 grados a radianes
}
}
// Añadimos el detector de clics en el mundo
world.events.addListener(component.eid, ecs.input.SCREEN_TOUCH_START, handleClick)
},
tick: (world, component) => {
// Si es necesario realizar alguna acción en cada fotograma (frame), lo pondríamos aquí
},
remove: (world, component) => {
// Aquí eliminamos el evento de clic cuando el componente se remueve
// world.removeEventListener('click', handleClick)
},
})
However, you should use a State Machine as it’s not good practice to leave listeners ‘dangling’ (without a removeListener).
I suggest you check out our sample projects to see how to do that:
