将事件侦听器附加到 Paper.js 中图层上的所有项目

Question

In jQuery, I can attach an event to all elements like a paragraph, using $("p") . Does something similar exist for Paper.js. I tried using project.activeLayer.children.onMouseEnter but that did not work.

I was thinking about looping over all the children inside the onFrame function but that seems wrong. It will probably attach multiple event listeners to the same item. So, all items will have many event listeners attached to them but I am not sure.

What is the best way to attach event listeners to all current and future items in a project layer in Paper.js?

Link: http://paperjs.org/reference/item/#onmouseenter

Answer 1

You just have to attack an event listener to the Tool .
The event argument that will be passed to the listener will then have an item property which is the event target item.
Here is a simple sketch demonstrating this.

tool.onMouseDown = (event) => console.log(event.item && event.item.name);

let id = 0;

drawRandomCircle();
setInterval(drawRandomCircle, 2000);

new PointText({
    content: 'Click on a circle to log its name',
    point: view.center + [0, -80],
    justification: 'center'
});

function drawRandomCircle() {
    new Path.Circle({
        center: Point.random() * view.size,
        radius: 50,
        fillColor: Color.random(),
        name: `item ${++id}`
    });
}