So behaviors are not exactly what I’m looking for. Say I have a box, and when it’s clicked, I want it to execute certain behavior, say console.log("is this box on: " + this.selected)
. I can create this behavior outside the box with the scene.pick
method
window.addEventListener("click", function() {
if (scene.pick(scene.pointerX, scene.pointerY).hit) {
const selected = scene.pick(scene.pointerX, scene.pointerY).pickedMesh.selected;
console.log("is this box on: " + this.selected")
}
}
But say I want the behavior to be particular to the particular box. One box will console log, another will do another thing, etc. In this example I basically want to add a custom “click listener” to each box.
Above is a better statement of the problem I’m trying to solve.
What I thought I could do was use Object.assign
to merge the instantiated box, with an instance of my custom Mesh extension:
class SectionBox extends BABYLON.Mesh {
selected:boolean
constructor() {
super()
this.selected = false
}
}
let box = BABYLON.MeshBuilder.CreateBox(name);
let sectionBox = new SectionBox();
box = Object.assign(sectionBox, box);
console.log(box.selected)
// false
The idea is all the properties in sectionBox are overridden by the properties in box, and the selected
property remains. It appears to work, the box is rendered, but when I get the Mesh from the scene it does not have the selected property anymore.
One thing to note, the client code about, instantiating the two Meshes, is actually in a static method on the SectionBox. This is for convenience, and I don’t think it matters, I return the instance to the actual client code, where it does have access to the property.