Created

Embed URL

HTTPS clone URL

SSH clone URL

You can clone with HTTPS or SSH.

Download Gist
View gist:2175552
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101
###*
@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
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.