Hello,
I am running into an issue. I have this basic script that detects when my head rotates left or right and on tik fires events for each side. that portion works fine.
I also set up a global event listening to tapping on the screen. I can set up and receive the event that part works fine.
The part that I am having trouble is trying to set the values inside of data. I have this line
“component.data.touchTriggeredLeft = true” but the value never seems to be set to true. inside the tik it never registers as being true. I tested that I can call the methods directly but even if I try to set the data from within the function it does not work.
I must be missing something that connects the component.data to the one object that set up and received the listeners. I tried printing the eid before and the numbers matched.
I would appreciate any help
//Code
import * as ecs from ‘@8thwall/ecs’
// Function to handle logic for the right side
function handleRightSide(world, component) {
console.log(handleRightSide
)
}
// Function to handle logic for the left side
function handleLeftSide(world, component) {
console.log(handleLeftSide
)
}
const faceTracking = ecs.registerComponent({
name: ‘faceTracking’,
schema: {
},
data: {
touchTriggeredLeft: ecs.boolean,
touchTriggeredRight: ecs.boolean,
},
add: (world, component) => {
const { eid } = component
const { scoreDisplay } = component.schema
component.data.touchTriggeredLeft = false
component.data.touchTriggeredRight = false
// Dispatch global events on touch
world.events.addListener(world.events.globalId, ecs.input.SCREEN_TOUCH_START, (event) => {
const touchX = event.data?.position?.x
console.log(`Touch Event Received: X=${component.eid}`)
if (touchX < 0.5) {
console.log("Dispatching 'touchLeft' event")
world.events.dispatch(component.eid, 'touchLeft')
} else {
console.log("Dispatching 'touchRight' event")
world.events.dispatch(world.events.globalId, 'touchRight')
}
})
// Listen for global touch events within this component
world.events.addListener(component.eid, 'touchLeft', () => {
console.log(`Touch Left Event Received X=${component.eid}`)
component.data.touchTriggeredLeft = true
})
world.events.addListener(world.events.globalId, 'touchRight', () => {
console.log(`Touch Right Event Received X=${component.eid}`)
component.data.touchTriggeredRight = true
})
},
tick: (world, component) => {
const { killerArea } = component.schema
const rotation = ecs.Quaternion.get(world, component.eid)
if (rotation) {
const { z } = rotation
// Handle right-side logic
if (z > 0.20) {
handleRightSide(world, component)
} else if (z < -0.20) {
handleLeftSide(world, component)
} else {
// Reset state when head returns to neutral
}
}
// Handle touch-triggered logic
if (component.data.touchTriggeredRight) {
console.log("Tick handling right touch")
handleRightSide(world, component)
component.data.touchTriggeredRight = false
}
if (component.data.touchTriggeredLeft) {
console.log("Tick handling left touch")
handleLeftSide(world, component)
component.data.touchTriggeredLeft = false
}
},
remove: () => {
// No specific cleanup required
},
})
export { faceTracking }