npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

connexionjs

v0.7.1

Published

Event emitter library

Downloads

33

Readme

ConnexionJS

Emit and listen for events across different frames and execution contexts. Automatically synchronizes event history if any context is attached or created during runtime.

Installation

In a Browser environment include the instance of the ConnexionJS in every frame that should work with events:

<script src="path/to/connexionjs/dist/connexion.min.js"></script>

Then in the source code use global variable in the context of a frame

connexion.listen('event', function(){})
connexion.emit('event')

In a CommonJS environment first install it from NPM:

$ npm install connexionjs

then in the source code use

	var connexion = require('connexionjs')
	connexion.listen('event', function(){})
	connexion.emit('event')

Usage

Include a library in any window. Start listening and emitting events.

In a main frame

connexion.emit('main-event')
connexion.listen('main-event' , function(eventDetail){
	console.log(eventDetail) //undefined
})
connexion.listen('frame-event' , function(eventDetail){
	console.log(eventDetail) //{a: 1, b: 2}
})

In any child frame

connexion.emit('frame-event', {a: 1, b: 2})
connexion.listen('main-event' , function(eventDetail){
	console.log(eventDetail) //undefined
})
connexion.listen('frame-event' , function(eventDetail){
	console.log(eventDetail) //{a: 1, b: 2}
})

API reference:

connexion.emit(eventType: String, [eventDetail: Object])

Emits event with an object attached to it. An event detail is optional.

connexion.listen(eventType: String, handler: Function)

Listens events that are emitted.

connexion.observe(eventType: String, handler: Function)

Observes events that are emitted. Like connexion.listen() but additionally calls handler in a moment of attachment with the latest data of event. Suitable for handling of events from the past.

connexion.unsubscribe(eventType: String, [handler: Function])

Removes event handler for a given event type. If handler is not provided then all handlers of a given event type are removed.

connexion.version: String

The version of the library. Sinse the version is important for compatibility between different instancies of ConnexionJS this property can be checked programmatically to see if they match. Versions are compatible if "patch" versions match (e.g. 1.1.x)

Use cases

  • Communiation between iframes and main window on any direction even across different origins;
  • Communication between different tabs/windows of the same origin;
  • Communication between different script contexts in browser extensions: background scripts, content scripts, popup scripts;
  • Communication between Node and Webkit context on the Node-Webkit platform;
  • Mediator object in a Browser web application;
  • Mediator object in a NodeJS application.

Compatibility

| Browser | support | |--------------------|:-------:| | self | ✓ | | frames | ✓ | | tabs | ✓ | | workers | |

| Node-webkit <=0.11 | support | |--------------------|:-------:| | self | ✓ | | frames | ✓ | | windows | - | | NodeJS | ✓ |

| NWJS >=0.13 | support | |--------------------|:-------:| | self | ✓ | | frames | ✓ | | windows | ✓ | | NodeJS | - |

| Browser extension | support | |--------------------|:-------:| | self | ✓ | | background | ✓ | | content | ✓ | | popup | ✓ |

| NodeJS >=0.10 | support | |--------------------|:-------:| | self | ✓ | | child processes | - | | parallel processes | - |

Polyfills that may be required for old platforms:

  • Array indexOf() (IE <=8)
  • Function bind() (IE <=8, FF <=3.6, SF <=5.0.5, CH <6, OP <=11.50)
  • Object.keys() (IE <=8, FF <=3.6, SF <=4.0.5, OP <=11.50)