CODEWITHSUNDEEP
coffeescriptdashing
spuder
spuder

Reputation: 18457

Why is this variable not in scope in coffee script?

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: =>

Upvotes: 0

Views: 674

Answers (1)

Jed Schneider
Jed Schneider

Reputation: 14671

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

Upvotes: 1

Related Questions