Renderer draft for Chaplin

renderer.coffee

define ["chaplin", "underscore"], (Chaplin, _) ->
  mediator = Chaplin.mediator

  class Renderer

    constructor: ->
      @initialize arguments...

    # list of screens currently in DOM
    screens: []

    # subscribe to events
    initialize: ->

      # clean up
      mediator.unsubscribe "Renderer#render"
      mediator.unsubscribe "Renderer#dispose"

      mediator.publish "Renderer~beforeInit"

      # subscribe to render event
      mediator.subscribe "Renderer#render", (options) => @render options

      # subscribe to dispose event
      mediator.subscribe "Renderer#dispose", (options) => @dispose options

      mediator.publish "Renderer~afterInit"

    # returns jQuery element of screen
    # create screen if it does not already exist
    getOrCreateScreen: (id) ->

      unless id in @screens
        @screens.push id
        # render screen to DOM
        # TODO: avoid two DOM calls in this case
        $screen = $('<section>').addClass('screen').attr 'id', id
        $('.body').append $screen
      else
        $screen = $(".body ##{id}")

      $screen

    # returns elements by selector or create it
    getOrCreateSelected: ($screen, selector, initHTML) ->

      $selected = $screen.find selector
      unless $selected.length
        # create selected
        $selected = $(initHTML)
        $screen.append $selected
      $selected


    # The Renderer#render event can be used to
    # * render a screen + its html
    # * append html to a screen
    # * insert html into an element of the screen
    #
    # The specified screen is automatically created if it doesn't exist.
    render: (options) ->

      # validation
      unless (typeof options is 'object' and options.screen? and options.html?) then throw new Error "Renderer#render: options have wrong format"
      if options.selector and not options.initHTML then throw new Error "Renderer#render: selector specified but initHTML missing from options"

      mediator.publish "Renderer~beforeRendering", options

      options = _(options).defaults
        method: if options.screen in @screens then 'append' else 'html'

      $screen   = @getOrCreateScreen options.screen

      $selected =
        if options.selector
          @getOrCreateSelected $screen, options.selector, options.initHTML
        else $screen

      # render html using supplied method
      $selected[options.method] options.html

      mediator.publish "Renderer~afterRendering", options

    # removes entire screen or just the selected elements
    dispose: (options) ->

      # remove entire screen
      $el =
        unless options.selector

          # remove from store/array
          @screens.splice @screens.indexOf(options.screen), 1

          # remove from DOM
          $(".body ##{options.screen}").remove()

        else

          $(".body ##{options.screen} #{options.selector}").remove()

      mediator.publish "Renderer~afterDisposal", {$el, screen: options.screen}