This JavaScript class will allow you to create a custom event listener tied directly to a named custom event. For example, you can set the page to display an alert every time an image loads on the page. First, specify your listener:
Simple enough. This creates an anonymous function that the EventBus names as “functionNickName” and will call whenever the “customEvent” event is triggered. You can use a system like jQuery to fire the new event whenever an image loads like so:
JDM.EventBus.Broadcast('customEvent');
});
This code snipped adds the custom event trigger to the load() event of every <img> tag on the page. Now, you’ll see a custom alert whenever an image finishes loading … and if you’re using AJAX to dynamically load images you’ll see the event then as well.
Wiring a custom alert to an image load is a trivial example of this system’s power. In reality, you can now add custom events to the entire lifecycle of your page, your AJAX calls, and any partial postbacks your page makes during typical use. This allows you to tie functions in one object to functions in another without the two objects knowing anything about one another.
Can’t see how that could be useful? Take this illustration for example:
You build a website that has a standard DOM setup and uses several jQuery-dependent functions to control an animated menu at the top of the page. The thing is, you have a second menu in your sidebar, and clicking elements in one should change the display of elements in the other. The old way of doing things was to tie mouseclick events in the sidebar directly to the display functions of the top menu. But let’s say, for some reason, you decide to remove your top navigation menu on one page to display a special movie.
Your site breaks, chaos ensues, and no one’s happy.
With an event bus, both menu systems are 100% isolated. Your sidebar menu publishes events, and your top-level navigation menu listens for events. If the events aren’t there, no one cares. Nothing breaks, the world keeps spinning, and you can now add or subtract your menus at will without breaking anything.
For anyone who wants to use this script in their own systems, please remember that it is copyrighted material and must be accompanied by this notice:
* JDM EventBus Library
*
* Copyright 2010, Eric Mann
*
* Permission is hereby granted, free of charge, to any person obtaining
* a copy of this software and associated documentation files (the
* "Software"), to deal in the Software without restriction, including
* without limitation the rights to use, copy, modify, merge, publish,
* distribute, sublicense, and/or sell copies of the Software, and to
* permit persons to whom the Software is furnished to do so, subject to
* the following conditions:
*
* The above copyright notice and this permission notice shall be
* included in all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
* MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
* LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
* OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
* WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
Pages: 1 2
