I am constantly impressed by the degree of excellence I find in working with the YUI3 framework. Things that should just “work” actually do. Recently I was stumped by an issue you yourself might be facing if you use YUI to any degree and have to deal with multiple YUI().use() instances on your page. In fact – after working through this short demo – I hope you have the confidence to do this yourself when the needs of the code warrant it, instead of trying to force everything into a single YUI().use() statement.
If you are aware of how YUI3 works, every YUI().use() statement is a self contained bit of javascript, where the scope of all the variables, functions, etc are nicely hidden and protected from the outside “global” javascript. This is a core feature of YUI and it takes a lot to work around this – which I would advise against by the way. So, you may find yourself with more than one of these YUI().use() blocks in your page. Perhaps you are using another library, or there is some legacy code that you don’t have access to, but still need to communicate with. Normally, such communication is not possible due to how javascript deals with scope, but you can work around this very nicely with two YUI features: Y.Global and YUI Custom Events. Let’s get to the code.
In this page we have to boxes. Each box has had a different YUI instance bound to it. They are self contained and for the most part do not know anything about each other. However in each block of YUI we have set a Y.Global.on() call. This essentially says “Go up to the global space set aside by YUI and listen for this event”. Notice however that the scope of the method call is the one that calls Y.Global.on(). As you can tell by the “theInput” variable. It points to the input box of that particular YUI instance. Any other YUI instance can then call a Y.Global.fire() method call. When they do, they can send along arguments that are scoped from that particular different YUI instance. Note that we had to use the “event-custom” component as well, in order for Y.Global to be available.
Another way of thinking about it is imagine you are sitting in your cube with a bunch of ping pong balls. And all of your cube mates have the same thing. Imagine that you cannot leave your cube, nor can you pop your head up above the walls of the cube. You can however lob ping pong balls over the wall to your cubemate. They never see “you” but you can write messages on your ping pong balls that they can read, and in turn do some action, or even lob one back to you in response.
The analogy breaks down when you have more than two cubes, but imagine when you toss that ball out, it magically splits into however many it needs to in order to drop into everyone else’s cube 
What is nice about this is that you do not have to know a whole lot about the “other” YUI instances. You can safely keep your private methods private, and only provide access to things you want the outside world to know about via the arguments you pass to the fire method. This also is safer than trying to dig your way into another YUI instance directly, because perhaps it hasn’t loaded yet, or it has changed since you wrote this code, and your direct access gets broken.
Anyway, I hope you enjoy this little snippet and I encourage you to check out the YUI docs for Y.Global (API Reference) and Custom Events ( API Reference) .
