Backbone.js setTimeout() loop in CoffeeScript

Question

Seems like every way I try this, it throws some sort of error. Here's what my code looks like now:

runShow: ->
  moments = @model.get('moment_stack_items')
  if inc == moments.length
    inc = 1
    pre = 0
  $("#" + moments[pre].uid).hide("slide", { direction: "left" }, 1000)
  $("#" + moments[inc].uid).show("slide", { direction: "right" }, 1000)

  inc += 1
  pre += 1

  console.log "looping" + inc
  t = setTimeout(this.runShow(),2000);

I call the function in my events. I have inc = 1 and pre = 0 defined outside the Backbone.View.. My current error is "Uncaught TypeError: Object [object DOMWindow] has no method 'runShow'"
BONUS POINTS: how can I reference t from another function (to run my clearTimeout(t))?

Answer 1

You ask the setTimeout function to evaluate "this.runShow()", and setTimeout will do that in the context of window. This means that this is the window object when this code is evaluated.

To avoid this you can create a function and bind it to a the current context, so that everytime the function is called, this is the same as when the function has been created.

In coffee script you can do this with the =>:

func = =>
    this.runShow()

setTimeout(func, 2000)

Or on a single line:

setTimeout((=> this.runShow()), 2000)

how can I reference t from another function?

Make t a property of your object:

class Something
    t: null
    runShow: ->
       ...
       this.t = ...
    otherFunction: ->
       t = this.t