Skip to content

An event controller that allows you to add callbacks to a list and have them fire when the event is dispatched

License

Notifications You must be signed in to change notification settings

mygosity/eventcontrol

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

22 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

eventcontrol

An event controller that allows you to add callbacks to a list and have them fire when the event id is emitted.

npm version npm bundle size MIT license

Usage

Install using

npm i eventcontrol

Import using

import { eventcontrol } from "eventcontrol";

Add an event listener by calling

eventcontrol.add("EVENT_NAME", functionToCall);

functionToCall will fire when eventcontrol is emitted

eventcontrol.emit("EVENT_NAME");

if you need arguments passed from emit you can simply add them by comma separated arguments

eventcontrol.emit("EVENT_NAME", "some string", 123, someObjRef);

remove a listener by invoking remove

eventcontrol.remove("EVENT_NAME", functionToCall);

or call dispose and it will reset all events added

eventcontrol.dispose();

Additional notes:

  • eventcontrol is a singleton
  • if you add the same callback to the same event id, it will replace the last entry with the latest add invocation
  • you can add extra arguments, or extra functions to listen to the same event. Examples are given below:

NodeJS example

//in one class file
const eventcontrol = require("eventcontrol").eventcontrol;
class Example {
  exampleCallback(optional, optional2, arg1, arg2) {
    console.log(
      "exampleCallback fired!",
      this,
      optional,
      optional2,
      arg1,
      arg2
    );
  }
  someOtherFunction() {
    //hook up that callback to this event string 'EVENT_FIRED'
    eventcontrol.add(
      "EVENT_FIRED",
      this.exampleCallback,
      this,
      optional,
      optional2
    );
  }
}
//in another class file
const eventcontrol = require("eventcontrol").eventcontrol;
class SomeOtherClass {
  doingSomething() {
    eventcontrol.emit("EVENT_FIRED", "arg1", "arg2");
  }
}

Using it like this should show you what options you have with regards to passing arguments (which are all optional). Note the order of the arguments received in the exampleCallback.

I've also provided an example from a react project below. This has a nice use case when you need an event to fire without actually changing any props and you don't want to add too much code to hook up something like redux.

ReactJS example

import React from "react";
import { eventcontrol } from "eventcontrol";
import { eventTypes } from "../events";

class SomeComponent extends React.Component {
  someEventCallback(arg1, arg2) {
    console.log("someEventCallback fired!", this, arg1, arg2);
  }
  componentDidMount() {
    eventcontrol.add(eventTypes.SOME_EVENT_NAME, this.someEventCallback, this);
  }
  componentWillUnmount() {
    eventcontrol.remove(eventTypes.SOME_EVENT_NAME, this.someEventCallback);
  }
}
import React from "react";
import { eventcontrol } from "eventcontrol";
import { eventTypes } from "../events";

class OtherComponent extends React.Component {
  someFunction() {
    eventcontrol.emit(eventTypes.SOME_EVENT_NAME, 123, "hello world");
  }
}

About

An event controller that allows you to add callbacks to a list and have them fire when the event is dispatched

Resources

License

Stars

Watchers

Forks

Packages

No packages published