evtmgr
v0.1.0
Published
Helper for managing event handlers
Downloads
3
Readme
evtmgr
Helper for managing event handlers
Installing
$ npm install evtmgr
# or
$ bower install evtmgr
Overview
Can be used with anything that emits an event:
addEventListener
addListener
attachEvent
addEvent
Specifically useful when:
- Adding/removing handlers on a lifecycle hook
- Adding handlers that use
bind
, and need to be removed - Conveniently remove all added handlers
Example
React provides a good use case.
import React, { Component } from 'react';
import EventManager from 'evtmgr';
class Menu extends Component {
constructor(props) {
super(props);
this.state = {
pinned: false
};
this.evtmgr = new EventManager();
this.evtmgr.register(window, 'scroll', this.handleWindowScroll.bind(this));
}
componentDidMount() {
this.evtmgr.attach();
}
componentWillUnmount() {
this.evtmgr.detach();
}
handleWindowScroll() {
this.setState({
pinned = document.body.scrollTop >= 100
});
}
render() {
var style = {};
if (this.state.pinned) {
style.position = 'fixed';
style.top = 0;
} else {
style.position = 'absolute';
style.top = 100;
}
return (
<menu style={style}>
{/*...*/}
</menu>
);
}
}
API
register(obj, type, handler)
Register an event handler
obj
An object that emits an event
type
The event type
handler
The function that handles the event
Example
var EventEmitter = require('events').EventEmitter;
var EventManager = require('evtmgr');
var emitter = new EventEmitter();
var manager = new EventManager();
// Register a single handler
manager.register(emitter, 'someEvent', (e) => {
console.log('someEvent was fired');
});
// Register handlers for multiple events
manager.register(emitter, {
insert: (e) => {
console.log('insert fired');
},
update: (e) => {
console.log('update fired');
},
delete: (e) => {
console.log('delete fired');
}
});
unregister(obj, type, handler)
Unregister an event handler
obj
An object that emits an event
type
The event type
handler
The function that handles the event
Example
var EventEmitter = require('events').EventEmitter;
var EventManager = require('evtmgr');
var emitter = new EventEmitter();
var manager = new EventManager();
function handleFoo() {}
function handleBar() {}
// Register handlers
manager.register(emitter, {
foo: handleFoo,
bar: handleBar
});
// Actually, don't want to handle bar
manager.unregister(emitter, 'bar', handleBar);
attach
Attach registered event handlers to the objects for which they handle events
Attaching can only be done once, so subsequent calls will have no effect,
unless detach
is called.
Example
// Registration does nothing until attach is called
manager.register(el, 'click', function () {/*...*/});
manager.attach();
// Now el.click() will be handled
detach
Detach registered event handlers from the objects for which they handle events
Example
// Attach all the event handlers
manager.attach();
// Once handlers are no longer wanted
manager.detach();
License
MIT