Working with Points, Rects, and the scene graph

Hi,

I'm starting out with pixi.js, and really liking it so far! One thing that has really been puzzling me, however, is how to work with points and the scene graph.

Let's say I have a problem like this, with two containers, and objects within those containers that essentially need to interact across the scene graph.

In theory, the problem is trivial, however what I'm not quite sure of is the 'PIXI way' of doing this. For example, what's the best way to get some arbitrary point and convert its position to a global one? How about getting a DisplayObject's global position? And is there an easy way to transform a point from one local coordinate system to another?

I've looked at the functions toLocal and toGlobal but they don't seem to be working as I'd expect them to. The documentation seems very thin and without usage examples I'm struggling to see how to use them properly. Also, where do WorldTransform and all of these matrix-related methods come into play? I was of the impression that an object's transform in space could be fully qualified with its point, parent, scale and rotation values so I'm having trouble seeing where these matrix operations step into the picture.

On a related note, I'm having trouble working with objects like PIXI.Point and PIXI.Rectangle. For example, say I wanted to make a helper function that adds two points. My first thought would be to do something like

function add(p1, p2) {
  return new PIXI.Point(p1.x + p2.x, p1.y + p2.y);
}

but that's clearly not right, since it's making a heap allocation every time the function is called! In fact, anywhere I find myself working with points, I keep wanting to treat them as value types, and I am not seeing a good way to use these structures conveniently, passing to and from functions, without making constant allocations.

If I could see an example of PIXI code that works with points in one of these ways, I think it would be really helpful.

Thanks!

Daniel