Skip to content

Commit

Permalink
fix(): rewrite and add docs
Browse files Browse the repository at this point in the history
BREAKING CHANGE: complete rewrite
  • Loading branch information
crobinson42 committed Apr 25, 2017
1 parent e41d799 commit e8cd185
Show file tree
Hide file tree
Showing 14 changed files with 287 additions and 117 deletions.
2 changes: 1 addition & 1 deletion .babelrc
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
{
"presets": ["es2015"]
"presets": ["es2015", "stage-2"]
}
1 change: 1 addition & 0 deletions .eslintrc
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
{
"parser": "babel-eslint",
"extends": "standard",
"rules": {
"comma-dangle": ["error", "always-multiline"],
Expand Down
122 changes: 94 additions & 28 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,49 +2,115 @@

[![js-standard-style](https://img.shields.io/badge/code%20style-standard-brightgreen.svg)](http://standardjs.com)

An event aggregate utility for front-end apps.

When designing front-end apps it's best to keep modules/features loosely coupled. A great method for accomplishing this is events. "Event Sky" was designed to help your apps work without knowing about eachother by utilizing the events with Event Sky.
An event pub-sub aggregate utility for javascript environments.

eventSky is set as a property on the window object by default.
### Usage

The available trigger sequences are 'on', 'before', & 'after'. Each will return an eventId which can optionaly be stored:
`EventSky` is bundled as a UMD (universal module design) and can be used in the following ways:

#### Browser

```
<script src="https://unpkg.com/[email protected]/build.js" />
<script>
EventSky.on('testEvent', console.info)
EventSke.trigger('testEvent', 'It works!')
console.log(EventSky.events)
</script>
```
#### Commonjs - Node/Browserify/Webpack

`npm i -S event-sky` or `yarn add event-sky`
```
var newMessageEventId = eventSky.on('newMessage', function callback(data) { *do something with data* });
eventSky.before('newMessage'...
eventSky.after('newMessage'...
eventSky.once('newMessage'...
const EventSky = require('event-sky')
```
To trigger an event by name or by eventId:

> Note: `EventSky` exports a singleton pattern module. This means it's the same
object across require/import's in your commonjs environment, ie:

```
eventSky.trigger('newMessage', 'this string will get passed to the callback, it can be an object, or whatever you like');
/* file1.js */
const eventSky = require('event-sky')
eventSky.on('testSingleton', (msg) => console.log(msg))
```
OR

```
eventSky.trigger(newMessageEventId, 'more data...');
eventSky.trigger(newMessageEventId, { key : 'value...'});
/* file2.js */
const eventSky = require('event-sky')
eventSky.trigger('testSingleton', 'The singleton pattern works!')
```
To remove an event:


--------------------

## API

### Event Hook Lifecycle

You can add event handlers in different lifecycle hooks, `beforeAll`, `on`, `once`, `afterAll`

```
eventSky.off(newMessageEventId);
eventSky.off([newMessageEventId1, newMessageEventId2, newMessageEventId3]);
eventSky.off({ event : eventId });
const eventSky = require('event-sky')
eventSky.on('newMessage', (data) => { console.log(data) })
eventSky.beforeAll('newMessage'...)
eventSky.afterAll('newMessage'...)
eventSky.once('newMessage'...)
```
For development purposes you can initialize eventSky to see all event activity in the console:

### Trigger Events
```
eventSky.init({ firehose : true }); // firehose=true will console.log all activity for events, helps with debugging
const data = 'some string...'
eventSky.trigger('newMessage', data)
```
ALSO


### Turn Handlers Off
```
console.dir(eventSky.dev);
// by event id
const eventId = eventSky.on('newMessage', (data) => { console.log(data) })
eventSky.off(eventId)
// or by event name and handler
const handler = (data) => { console.log(data) }
eventSky.on('newMessage', handler)
eventSky.off('newMessage', handler)
```
Configurable evnironment
Node.js module:

A convenience method is available to turn all handlers off associated with an event name, ie:

```
GLOBAL.eventSky
eventSky.beforeAll('eventName', () => { /* ... */ })
eventSky.on('eventName`, () => { /* ... */ })
// remove all lifecycle hooks for event name "eventName"
eventSky.off.all('eventName')
```

### Firehose

For development purposes you can initialize eventSky to see all event activity in the console:
```
Client/Browser:
eventSky.config.firehose = true
```
window.eventSky

### Registered Events

You can debug `EventSky` by checking the registered events and lifecycles via:

```
Configurable namespace - at the top of the eventSky.js file, you can config the variable 'namespace' to be whatever you prefer.
console.dir(eventSky.events)
```

2 changes: 1 addition & 1 deletion build.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion build.js.map

Large diffs are not rendered by default.

11 changes: 11 additions & 0 deletions dev/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
## Dev Server

This is a simple dev server to use the event-sky module in a browser
environment, ie: the browser console. The build is a UMD module and
makes itself available under the global namespace `EventSky`.

#### Useing Dev Server

> `node dev/browserSync.js`
Open browser to `http://localhost:3001/dev`
4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"release": {
"branch": "develop"
},
"description": "front-end event pub/sub utility",
"description": "javascript event pub/sub utility",
"main": "build.js",
"scripts": {
"build": "rollup -c",
Expand Down Expand Up @@ -41,13 +41,15 @@
},
"homepage": "https://github.com/crobinson42/event-sky",
"devDependencies": {
"babel-eslint": "^7.2.3",
"babel-jest": "^19.0.0",
"babel-plugin-external-helpers": "^6.22.0",
"babel-plugin-transform-object-rest-spread": "^6.23.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-polyfill": "^6.23.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-es2016": "^6.24.1",
"babel-preset-stage-2": "^6.24.1",
"browser-sync": "^2.18.8",
"eslint": "^3.19.0",
"eslint-config-standard": "^10.2.0",
Expand Down
3 changes: 2 additions & 1 deletion src/.babelrc
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,8 @@
{
"modules": false
}
]
],
"stage-2"
],
"plugins": [
"transform-runtime",
Expand Down
18 changes: 0 additions & 18 deletions src/config.js

This file was deleted.

91 changes: 55 additions & 36 deletions src/main.js
Original file line number Diff line number Diff line change
@@ -1,14 +1,12 @@
import utils from './utils'
import config from './config'

class EventSky {
constructor () {
this.config = {
restrictToExpected: false,
firehose: false,
ignoreDuplicateHandler: false, // warns about duplicate event/handler
}

this._config = config
this._utils = utils

// map of events
Expand Down Expand Up @@ -68,23 +66,20 @@ class EventSky {
* @param eventName {string} the name of the event
* @returns {EventSky}
*/
allOff (eventName) {
delete this.events[eventName]
this._firehose(`.off.all("${eventName}") removed all event handlers`)
allOff (event) {
delete this.events[event]

this.events[eventName] = this._utils.createNewEventMap()
this._firehose(`.off.all("${event}") removed all event handlers`)

this.events[event] = this._utils.createNewEventMap()

return this
}

trigger (event, data) {
if (this.config.restrictToExpected) {
if (!Object.keys(this.events).includes(event)) {
this._firehose(`"${event}" triggered and is not an expected event "restrictToExpected = true"`)
if (!this._utils.validateEventName(this, event)) return this

return this
}
} else if (!this.events[event]) {
if (!this.events[event]) {
this._firehose(`"${event}" triggered with no handlers setup`)

return this
Expand All @@ -94,39 +89,63 @@ class EventSky {

// beforeAll
const beforeAll = this.events[event].beforeAll
try {
Object.keys(beforeAll).forEach(key => beforeAll[key](data))
} catch (e) {
console.error(`EventSky error: ${event} beforeAll handler errored`, { error: e, data: data })
}

Object.keys(beforeAll).forEach(key => {
try {
beforeAll[key](data)
} catch (e) {
if (!beforeAll[key]) { // check if the method exists
console.error(`EventSky error: .beforeAll('${event}', ...) handler does not exist`, { eventId: key, data: data })
} else { // else show the method errored
console.error(`EventSky error: .beforeAll('${event}', ${on[key].name || ('anonymous')}) handler trapped an error`, { error: e, data: data })
}
}
})

// on
const on = this.events[event].on
try {
Object.keys(on).forEach(key => on[key](data))
} catch (e) {
console.error(`EventSky error: ${event} on handler errored`, { error: e, data: data })
}

Object.keys(on).forEach(key => {
try {
on[key](data)
} catch (e) {
if (!on[key]) { // check if the method exists
console.error(`EventSky error: .on('${event}', ...) handler does not exist`, { eventId: key, data: data })
} else { // else show the method errored
console.error(`EventSky error: .on('${event}', ${on[key].name || ('anonymous')}) handler trapped an error`, { error: e, data: data })
}
}
})

// once
const once = this.events[event].once
try {
Object.keys(once).forEach(key => {

Object.keys(once).forEach(key => {
try {
once[key](data)
// remove handler
this.off(event, once[key](data))
})
} catch (e) {
console.error(`EventSky error: ${event} once handler errored`, { error: e, data: data })
}
} catch (e) {
if (!once[key]) { // check if the method exists
console.error(`EventSky error: .once('${event}', ...) handler does not exist`, { eventId: key, data: data })
} else { // else show the method errored
console.error(`EventSky error: .once('${event}', ${on[key].name || ('anonymous')}) handler trapped an error`, { error: e, data: data })
}
}
})

// afterAll
const afterAll = this.events[event].afterAll
try {
Object.keys(afterAll).forEach(key => afterAll[key](data))
} catch (e) {
console.error(`EventSky error: ${event} afterAll handler errored`, { error: e, data: data })
}

Object.keys(afterAll).forEach(key => {
try {
afterAll[key](data)
} catch (e) {
if (!afterAll[key]) { // check if the method exists
console.error(`EventSky error: .afterAll('${event}', ...) handler does not exist`, { eventId: key, data: data })
} else { // else show the method errored
console.error(`EventSky error: .afterAll('${event}', ${on[key].name || ('anonymous')}) handler trapped an error`, { error: e, data: data })
}
}
})

return this
}
Expand Down
Loading

0 comments on commit e8cd185

Please sign in to comment.