Skip to content

2.2 Lunar.createActivator

Caio Vaccaro edited this page Apr 14, 2016 · 1 revision

Lunar(this).createActivator([Array])

Description:

"(...) a Service Activator that connects the messages on the channel to the service being accessed."

So you've created your module and now the next step is to call its functions. When you call them, as usual, you can send arguments and receive responses.

When you call this method, the Lunar function should receive the object that you want to transform in a Activator. And the createActivator method should receive the destination module (that you have previously created with .createModule) or the optional Proxy (if you have one created with .createProxy) -- the result's difference is small.

Example using a Module to create an Activator:

import React from 'react';
import Lunar from 'lunarjs';
import Home from './lunar/home';

class Title extends React.Component {
    constructor() {
        super();
        this.state = { title: '' }
    }
    componentDidMount() {
        Lunar(this).createActivator([Home]);

        this.request[Home.actions.FORMAT_TITLE]('Welcome')
            .then((data) => {
                this.setState({ title: data });
            }, (err) => {
                console.log('Error: ', err);
            }
         );
    }
    render() {
        return (
            React.createElement('h1', null, this.state.title)
        );
    }
}

Example using a Proxy to create an Activator:

import React from 'react';
import Lunar from 'lunarjs';
import Optional from './example-proxy';

class Title extends React.Component {
    constructor() {
        super();
        this.state = { title: '' }
    }
    componentDidMount() {
        Lunar(this).createActivator([Optional]);

        this.request[Optional.Proxy.actions.FORMAT_TITLE]('Welcome')
            .then((data) => {
                this.setState({ title: data });
            }, (err) => {
                console.log('Error: ', err);
            }
         );
    }
    render() {
        return (
            React.createElement('h1', null, this.state.title)
        );
    }
}

Difference between the two:

// When you create an Activator from a Module,
// you can add optional Middlewares right from
// the Activator.
class Title extends React.Component {
    constructor() {...}
    fetchData: {...}
    validateData: {...}
    componentDidMount() {
        Lunar(this).createActivator([Home]);

        this.addMiddleware({
           action: Home.actions.FORMAT_TITLE,
           before: this.fetchData,
           after: this.validateData
        });

        this.request[Home.actions.FORMAT_TITLE]('Welcome')
            .then((data) => {
                this.setState({ title: data });
            }, (err) => {
                console.log('Error: ', err);
            }
         );
    }
    render() {...}
}

// If you already have an optional Proxy,
// Middlewares would be added in the Proxy
// and not in Activator.
class Title extends React.Component {
    constructor() {...}
    componentDidMount() {
        Lunar(this).createActivator([Optional]);

        // Middlewares are in the Proxy, in another file.
        this.request[Optional.Proxy.actions.FORMAT_TITLE]('Welcome')
            .then((data) => {
                this.setState({ title: data });
            }, (err) => {
                console.log('Error: ', err);
            }
         );
    }
    render() {...}
}

Internal Details:

You don't need to worry about this, but if you want to know, internally this method will:

  • Iterate the Array sent
  • Check one by one if the Array item is a Module or a Proxy
  • If it is a Module, create a Proxy from it
  • If it is a Proxy or a Module with a just created Proxy, create the request object
  • Make available the addMiddleware method from the Proxy
  • The request object contains all the "action methods" provided by Proxy (sent or just created)
  • When request[action] is called, it will call the Proxy.doAction internally to handle middlewares and the Mediator