I have a ChaplinJS project built by someone else, and I'm not fully informed about certain details of the framework. Here's a bit which I'm finding tricky to grok:
listen: {
'change model': 'render',
'home:actionvideo mediator': 'show'
},
This block of code is inside of one of the view JS files. I'm familiar with this style of event-handling, my understanding is the first bit ("home:actionvideo") is the name of an event, the second part ("mediator") is an element selector, and the bit after the colon is the name of a function to run in reponse to the event.
But here in Chaplin-world, I'm thinking "mediator" actually refers to the Chaplin-core Chaplin.mediator
object. Is this correct?
And while I'm at it, does that first line change model
somehow listen to a Chaplin.model
? Which Chaplin.model
?
Yes, this is correct.
chaplinjs is able to listen to the following methods:
var MyView = Chaplin.View.extend({
events: {
// Listen to $ DOM events
'click button': 'methodName',
'change select#myid': 'methodName',
...
},
listen: {
// Listen to Chaplin events
'onAddedToDOM': 'methodName',
...
// Listen to model events
'change:foo model': 'methodName',
// Listen to collection events
'reset collection': 'methodName',
// Custom mediator events (or Chaplin events, like router:route etc.)
'pubSubEvent mediator': 'methodName',
// The value can also be a function.
'eventName': function() {alert('Hello!')}
},
Use the mediator
class, to publish/ or subscribe to direct communication through controlled channels:
this.publishEvent('pubSubEvent', ['Joe', 'Schmoe']);
or outside your view:
require('chaplin');
Chaplin.mediator.publishEvent('pubSubEvent', ['Joe', 'Schmoe']);
You can find the source code for event delegation here: https://github.com/chaplinjs/chaplin/blob/master/src/chaplin/views/view.coffee#L299-308