coffeescript class noob issue with #var - coffeescript

Question

class FooterPanel
constructor : -> # #footer works fine in the constructor
#gather elements
#footer = $('footer')
#panel = $('ul.panel')
#initalize states
#isPanelUp = false
#userActed = false
#setting
#panelSpeed = 500
#show panel
#panel.filter('#'+run+'Panel').show()
#userAction()
#mobile love
if device.android
#panel.find('a').bind 'touchstart', ->
$(this).click()
if device.mobile
#panel.remove()
return false
if device.is
touchToggle = true
touchTime = null
#footer.find('nav').bind 'touchstart', (e) ->
return true if $(e.target).is('a')
if touchToggle
#userMoveUp()
touchToggle = false
clearTimeout touchTime
touchTime = setTimeout #userMoveDown, 3000
else
#userMoveDown()
clearTimeout touchTime
touchToggle = true
hint : -> # #footer has not problem working here
setTimeout (->
if #isPanelUp and not #userActed
#footer.stop().animate bottom : #panel.outerHeight() * -1, #panelSpeed, ->
#footer.removeAttr 'style'
#isPanelUp = false
), 5000
if not #isPanelUp and not #userActed
#footer.stop().animate bottom : 0, #panelSpeed
#isPanelUp = true
userMoveUp : ->
#userActed = true
#footer.stop().animate bottom : 0, #panelSpeed if not #isPanelUp
#isPanelUp = true
userMoveDown : ->
if #isPanelUp
#footer.stop().animate bottom : #panel.outerHeight() * -1, #panelSpeed, ->
#footer.removeAttr 'style'
#isPanelUp = false
userAction : ->
#footer.hover #userMoveUp, #userMoveDown # this.footer is undefined
On the last line there of my class, I get this.footer is undefined in my log (on hover). How can I make #footer work like it does in the other methods? I am calling like this:
footerPanel = new FooterPanel()
footerPanel.hint()
So apparently I had many fat arrow related needs. I started playing with the fat arrow (I had never used it before) and it seems to fix my issues with scope. Thanks everyone!

Answer 1

Use the fat arrow (=>) to bind the function to its initial context
userMoveUp : =>
#userActed = true
#footer.stop().animate bottom : 0, #panelSpeed if not #isPanelUp
#isPanelUp = true
userMoveDown : =>
if #isPanelUp
#footer.stop().animate bottom : #panel.outerHeight() * -1, #panelSpeed, ->
#footer.removeAttr 'style'
#isPanelUp = false

Answer 2

In your hint method, replace setTimeout (-> with setTimeout (=>. This makes sure that whatever this is when your hint method gets called gets carried into the async setTimeout call.