How to access methods?

[davidfitzgibbon]

I'm so excited for this project! Thanks so much for all the hard work Rich! Cant wait to see what comes out of this community.

I've been jumping straight in, and have an issue.

I'm trying to recreate this little demo where the is a movingBox who's position is changing, and a watchingBox that's looking at it.

Is it possible to use an Object3D .lookAt() method here? Is this something that needs to be built into SC that I could try to help with? Am I just not getting the declarative way of doing this?

I've made a best (not working) attempt here with the logic I would have expected.

[DefinitelyMaybe]

This one is about what gets attached to bind:this={cube1/2}. It's not the three.js object as you might expect but rather the svelte object. I'm sure this will come up a lot. Something we could try would be exporting the three object as a property but I don't know whether that's a good solution/avenue to go down.

Edit: in the mean time, a quick hack is to look into the movingCube variable.

[davidfitzgibbon]

@DefinitelyMaybe thanks so much for the feedback.

I've tried accessing the data within the movingCube, but dont seem to be able to access that data?

I did get it working though, by creating two empty Object3Ds. That feels a little hacky though. But it works!

I'm very new to working with Three declaratively, I havent tried React Three Fiber or anything. Definitely a learning curve here, but it feels strange not being able to reach for the methods that you get on objects in Three.

You're right though, it's important not to take on anything we shouldnt into the project.

[rrcook]

@davidfitzgibbon In your comments, the "best (not working) attempt" and the "by creating two empty Object3Ds" links point to the same stackblitz. If you did get something working I'd like to see the code snippet, I have need of getting to the underlying three objects to get properties.

[davidfitzgibbon]

@rrcook I never got to the actual ThreeJS functions, and apologies for the bad linking!

My initial attempt was something like this, trying to bind to the 'element' and use the underlying .lookAt() from there, which doesnt work.

This is surprising still to me, that we cant access the ThreeJS functions, BUT, as above I was able to mimic it by running the ThreeJS in the script with two empty Object3Ds, and copying their positions and rotations to the SvelteCubed objects.

Hopefully that's more clear!