connect things

Any software system or application consists of components, and those components collaborate to do the really useful stuff. Once you've created some things, you will usually want to connect them together in various ways so that they can collaborate.

Similarly to factories used to create things, wire uses plugin facets to apply new behavior to components after they have been created. There are several facets that are used to make connections between components. For example, you can connect a Javascript controller to DOM events on an HTML view.

Wire itself, plus its bundled plugins support 4 types of connections:

1. Injection - The simplest type of "connection". Inject a reference to one component into another so you can call methods on it directly
2. DOM events - As you'd expect, when a DOM event happens, invoke a component's method(s) to handle it
3. Javascript to Javascript "events" - When a method is called on one component, invoke a method on another component
4. Aspect Oriented Programming (AOP) advice - When a method is called on a component, invoke a method on another component before or after it.

Injection

Plugins: None needed

DOM events

Plugins: wire/on, wire/dojo/on (uses dojo/on), wire/jquery/on (uses jQuery.on)

Coming Soon

Javascript to Javascript

Plugin: wire/connect, wire/dojo/events (uses dojo.connect)

Coming Soon

Aspect Oriented Programming (AOP)

Plugin: wire/aop

The wire/aop plugin lets you make Javascript to Javascript connections similar to wire/connect, but provides more connection types. For example, you can have one method called before another, after another method returns, or after another method throws an exception.

define({
	// Include the wire/aop plugin
	plugins: [
	    { module: 'wire/aop' },
	    // other plugins ...
	],

	component1: {
		create: //...
	},

	component2: {
	    create: //...
	    before: {
	        // This will call component1's doSomethingBefore method
	        // before component2's doSomething method.  The parameters passed
	        // to component2.doSomething will be passed to
	        // component1.doSomethingBefore
	        doSomething: 'component1.doSomethingBefore'

	        // Can add multiple methods here
	        doSomethingElse: 'component1.doSomethingElseBefore'
	    }

	    // Similarly for other advice types
	    afterReturning: {
	        // component1.doSomethingAfterReturning will be invoked after
	        // component2.doSomething returns (but not if it throws, see
	        // afterThrowing below).  The return value of component2.doSomething
	        // will be passed to component1.doSomethingAfterReturning
	        doSomething: 'component1.doSomethingAfterReturning'
	    },

	    afterThrowing: {
	        // component1.handleError will be invoked after component1.doSomething,
	        // but only if it throws.  The exception thrown by component2.doSomething
	        // will be passed to component1.handleError
	        doSomething: 'component1.handleError'
	    },

	    after: {
	        // component1.alwaysDoSomethingAfter will be invoked after
	        // component2.doSomething regardless of whether it returns normally
	        // or throw.  The return value OR exception of component2.doSomething
	        // will be passed to component1.alwaysDoSomethingAfter
	        doSomething: 'component1.alwaysDoSomethingAfter'
	    }
	}
})