Inter-Controller Communication in Spine.js

Question

Is it possible to have two controllers within the same Spine.js: Apartments and Map. Is there a way to call get the Map do do something when an Apartment is selected?

# Apartments
class Show extends Spine.Controller
  events:
    'click [data-type=edit]': 'edit'
    'click [data-type=back]': 'back'

  constructor: ->
    super
    @active (params) ->
      @change(params.id)

  change: (id) ->
    @item = Apartment.find(id)
    @render()

  render: ->
    @html @view('apartments/show')(@item)
    # also update the map here.

Answer 1

I guess you have few options

Using Routes

Use the Spine's routing to navigate to the apartment url and update the map. You can see an example on Spine's Contacts example.

On your index.coffee define the /apartment routes:

@routes
      '/apartment/:id': (params) ->
        @apartmentList.active(params)
        @map.show.active(params)

On your sidebar/apartment list controller use the @navigate to change state

  change: (item) =>
    @navigate '/apartment', apartment.id

Finally catch the active event on your map controller (like here) and update the map

Using events

When selecting an apartment fire event

Spine.trigger 'selectApartment', item.id

and then catch this event on the Map controller:

Spine.bind 'selectApartment', onSelectAparmtnet