Avoid passing app to UI elements

[shama]

Currently we are passing app into the UI elements to send events up. But this will create peer dependencies to app and make it harder to split out the UI elements into their own modules.

Instead we should just create a target callback for sending actions up. Such as:

function action (name, params) {
  /* Handle action name */
}
self.views = {
    channels: new Channels({ target: action })
}

and then in the UI element:

function Composer (opts) {
  opts = opts || {}
  this.target = opts.target || function() {}
}

Composer.prototype.render = function () {
  var self = this

  var input = h('input', {
    placeholder: 'Send a message...',
    autofocus: true
  })

  return h('form.composer', {
    onsubmit: function (e) {
      e.preventDefault()
      var input = this.querySelector('input')
      self.target('sendMessage', input.value)
      input.value = ''
    }
  }, input)
}

---

Or get more fancy and have the actions bubble up: https://gist.github.com/shama/33f7aaeb902a001637e8

[ungoldman]

what about each component being an event emitter and app just instantiating them and managing event passing/delegation

[shama]

Yep that would be cool too. Just anything that can pass actions up that isn't another library passed into the constructor. :)

[shama]

Trying out an event emitter approach: 585e155