gistfile1.coffee

###*
  @fileoverview Songs view refactored.
  Why such refactoring?
    To separate logic and wiring.
    Then we can test things with logic without wiring mess.
###

goog.provide 'app.songs.View'

goog.require 'goog.ui.Component'
goog.require 'este.mobile.FastButton'

###*
  @param {app.Songs} songs
  @param {Function} fastButtonFactory
  @param {Function} indexFactory
  @constructor
  @extends {goog.ui.Component}
###

app.songs.View = (@songs, @fastButtonFactory) ->

goog.inherits app.songs.View, goog.ui.Component

goog.scope ->
  `var _ = app.songs.View`

  ###*
    @param {app.Songs} songs
  ###
  _.create = (songs) ->
    fastButtonFactory = (el) ->
      new este.mobile.FastButton el
    indexFactory = (el, className) ->
      song = goog.dom.getAncestorByClass el, 'sg-song'
      return -1 if !song
      song.getAttribute 'data-index'
    new _ songs, fastButtonFactory, indexFactory
  
  ###*
    @type {app.Songs}
    @protected
  ###
  _::songs

  ###*
    @type {Function}
  ###
  _::fastButtonFactory

  ###*
    @override
  ###
  _::decorateInternal = (element) ->
    goog.base @, 'decorateInternal', element
    @renderSongs()
    return

  _::enterDocument = ->
    goog.base @, 'enterDocument'
    # instead of
    # @fastButton = new este.mobile.FastButton @getElement()
    # factory is used
    @fastButton = @fastButtonFactory @getElement()
    @getHandler().
      listen(@fastButton, 'click', @onFastButtonClick)
    return

  _::renderSongs = ->
    html = [
      '<div class="sg-new"></div>'
      '<div class="sg-search"></div>'
      '<div class="sg-current-list">to learn hot songs</div>'
    ]
    for song, i in @songs
      html.push "
        <div data-index='#{i}' class='sg-song'>
          <span class='sg-name'>#{song.name}</span>
          <span class='sg-author'>#{song.author}</span>
        </div>"
    @getElement().innerHTML = html.join ''

  _::exitDocument = ->
    goog.base @, 'exitDocument'
    @fastButton.dispose()
    return

  _::onFastButtonClick = (e) ->
    # instead of
    # songEl = @dom_.getAncestorByClass e.target, 'sg-song'
    # return if !songEl
    # index = songEl.getAttribute 'data-index'
    # factory is used
    index = @indexFactory e.target, 'sg-song'
    return if index == -1
    song = @songs[index]
    @dispatchEvent
      type: 'songclick'
      song: song
 
  return