Skip to content

CodeCrunchIO/dispatcher

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Dispatcher (Event Handler and Dispatcher in Javascript)

Install

1. Development

<script type="text/javascript" src="dispatcher.js"></script>

2. Production

<script type="text/javascript" src="dispatcher.min.js"></script>

Basic Usage

Basically the default javascript doesn't have a simple way on listening / handling custom events, it doesn't have a way to bind or put custom parameters for custom usage, Luckily the dispatcher class provides this functionality with custom success and fail handler for async process. Below will show on how simple it is to handle custom events using dispatcher object.

Figure 1. Initialization

var dispatcher = Dispatcher();

Figure 2. Listening to Events

dispatcher.on('test-event', function([params...], success, fail) {
    console.log('Some Test Event');
})

Figure 3. Setting event handler priority

dispatcher.on('test-event', handler, true, [success, fail]);

NOTE Priority Handler will always be placed on top of other current handlers of the given event.

Figure 4. Listening to Events with Success and Fail Handler

dispatcher.on('test-event', function([params...], success, fail){
    setTimeout(function() {
        // call success callback
        success(1, 2, 3);
    }, 1000);
    
    setTimeout(function() {
        // call the fail callback
        fail(1, 2, 3);
    }, 2000);
},
function([params...]) {
    // ... do some stuff
},
function([params...]) {
    // ... do some stuff
});

Figure 5. Removing Event Handler

Remove specific handler by passing handler function:

var handler = function() {};

dispatcher.on('test', handler);

// remove the given handler based on the original
// handler function signature...
dispatcher.off('test', handler);

Removing all handlers for the given event:

dispatcher.off('test');

NOTE Passing the original handler function is required when removing specific handler from the given event, the dispatcher will look for it's matching guid from the list of event handlers given the event name.

Figure 6. Dispatching Events

dispatcher.dispatch('test', [params...]);

Figure 7. Putting it all together

var load = function() {
    console.log('Load Handler');
};

dispatcher
.on('load', load)
.on('request', function(url, success, fail) {
    var request = Request();

    request.get(url)
    .success(function(response) {
        success(response);
    })
    .fail(function(response) {
        fail(response);
    });
},
// success callback
function(response) {
    console.log('Success Response: ' + response);
},
// fail callback
function(response) {
    console.log('Fail Response: ' + response);
})
.on('event-not-useful', function() {
})
.on('event-not-useful', function() {
});

// remove event
dispatcher.off('event-not-useful');

// remove load event by handler
dispatcher.off('load', load);

// dispatch request event
dispatcher.dispatch('request', '/some-url');

License

MIT

About

Event Handler and Dispatcher in Javascript

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published