Why is this variable not in scope in coffee script? - coffeescript

Question

I'm using the dashing framework to create a widget. Basically it uses sinatra, batman, and coffee script to create a dashboard.
My code is based off of this widget
I have the following code
coffee script
class Dashing.Countdown extends Dashing.Widget
ready: ->
setInterval(#startCountdown, 500)
startCountdown: =>
color_available
current_timestamp = Math.round(new Date().getTime()/1000)
end_timestamp = Math.round( Date.parse($(#node).find(".more-info").html())/1000 )
seconds_until_end = end_timestamp - current_timestamp
if #get('title') > 'Busy'
# #set('title', 'herpin the derpin')
color_available = true
else
color_available = false
...truncated for readability
#accessor 'isAvailable', ->
true
html
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
<div
data-id="pomodoro"
data-view="Countdown"
data-title="Herp the Derp"
data-end=""
data-addclass-available='isAvailable'>
</div>
</li>
</ul>
</div>
If the accessor 'isAvailable' function returns true, then the 'available' css class is applied which changes the color of the div from red to blue as expected.
However, if I change the accessor function from 'true' to a variable, it says it is undefined.
....
#accessor 'isAvailable', ->
color_available?
From my hours of research on google and stack overflow, It seems like the problem is a scope issue.
I have tried changing every instances of the color_available variable to the global scope with no luck.
#color_available
I've also tried adding color_available to the window
window.color_available = color_available
Can anyone point out why color_available is undefined? I'm brand new to javascript / coffeescript and I"m in a bit over my head.
Resources
How do I define global variables in CoffeeScript?
https://donatstudios.com/CoffeeScript-Madness
Update
I forgot to mention, that I have tried the following approaches to initialize the variable.
startCountdown: =>
color_available
startCountdown: =>
#color_available
color_available
startCountdown: =>
color_available = null
startCountdown: =>

Answer 1

Using #accessor is putting it literally on the prototype object so it would be shared And of course if you add it to every instance of the class, you probably don't want it to be the same for every instance of the class. My guess is that Batman is adding this for you as an instance method, so you should just be able to set it wherever it might make sense to do so:
myInstance = new Dashing.Countdown()
myInstance.isAvailable() #=> true
myInstance.isAvailable = -> false
myInstance.isAvailable() #=> false
maybe? I'd try that. FWIW, you can do do this in pure coffeescript pretty easily without using the #accessor stuff.
class Dashing.Countdown extends Dashing.Widget
constructor: ({#colorAvailable})->
#colorAvailable ?= -> false
isAvailable: #colorAvailable
myInstance = new Dashing.Countdown(colorAvailable: -> true)
myInstance.isAvailable() #=> true
myInstance = new Dashing.Countdown()
myInstance.isAvailable() #=> false