Light weight DI for client side components in CoffeScript..

bindable.coffee

class window.Bindable
  constructor: (context=$('body'), @dataKey='bindable')->
    @bindables = $("[data-#{@dataKey}]", context)
    @instanceKey = "#{@dataKey}-instance"


  bindAll: ->
    @bind(el) for el in @bindables


  getRefs: ->
    $(bindable).data(@instanceKey) for bindable in @bindables


  release: ->
    for bindable in @bindables
      bindable = $(bindable)
      if instance = bindable.data(@instanceKey)
        instance.release() if typeof instance?.release is 'function'
        bindable.data(@instanceKey, null)

    delete @bindables
    @bindables = []


  bind: (el, dataKey=@dataKey) ->
    el = $(el)
    key = el.data(dataKey)
    if _class = @constructor.getClass(key)
      el.data( @instanceKey, new _class(el) )
    else
      console?.error "Bindable for key: #{key} not found in Bindable.registry for instance", el


  @getClass: (key) ->
    @registry[key]?.class


  @register: (key, klass) ->
    @registry ?= {}
    @registry[key] = { class: klass }
    return null

Bindable class

class Example
  constructor: (el) ->
    @el = $(el)
    @bindEvents()

  bindEvents: ->
    @el.on 'click' , @toggle

  toggle: =>
    @el.toggleClass('active')

  release: ->
    @el.off 'click', @toggle
    @el = null

Bindable.register 'example', Example

HTML

<div data-bindable='example'>
</div>

Startup the application

$ ->
  new Bindable().bindAll()

Extending Spine Controllers

class Example extends Spine.Controller
  events:
    'click a': 'toggle'

  constructor: (el)->
    super el: $(el)

  toggle: (e)->
    e.preventDefault()
    $(e.target).toggleClass('active')

Bindable.register 'example', Example

Note Spine.Controller has a default 'release' event handler of removing the bound element @el. To override that functionality you have to unbind release first.

 @unbind 'release'
 @bind 'release', -> console.log 'release'