Question

If i want to get a js code like this which compiles from coffeescript:

  var sortableTodos = new Sortables("todo-list", {
constrain: true,
clone: true,
handle: ".todo-content",
onComplete: function(ele){
  sortableTodos.serialize(false, function(element, index){
    todo = Todos.get(element.getProperty("id").replace("todo-", ""));
    todo.save({"order": index});
  });
}
});

I can’t write coffee code like below:

sortableTodos = new Sortables(
"todo-list"
(
    constrain: true
    handle: '.todo-content'
    onComplete:(ele)->
        sortableTodos.serialize false, (element,index)->
                todo = Todos.get(element.getProperty("id")).replace("todo-","")
                todo.save("order":index)

)   
   )

but the following works(it got brackets after onComplete)

sortableTodos = new Sortables(
"todo-list"
(
    constrain: true
    handle: '.todo-content'
    onComplete:((ele)->
        sortableTodos.serialize false, (element,index)->
                todo = Todos.get(element.getProperty("id")).replace("todo-","")
                todo.save("order":index)
               )
)   
  )  

I don’t know why?Is it a bug?

Answer 1

The CoffeeScript parser has many quirks when it comes to splitting function arguments across multiple lines. (See issue 1135.) Multi-line arguments to functions are only allowed for YAML-style objects when you omit parentheses. So while

func
  foo: bar
  x: y

works (compiling to pass a single object to func), other arguments often need to be on the same line as func. Or you can use a \ escape at the end of the line, as in JS, to make multiple lines be treated by the compiler as a single line:

func \
  a  \
  b

The best fix for your case is to move your string to the same line as the function call, ditch the parentheses around the object literal (use curly braces if you like), and be consistent with your indentation:

sortableTodos = new Sortables("todo-list", {
    constrain: true
    handle: '.todo-content'
    onComplete: (ele) ->
        sortableTodos.serialize false, (element,index) ->
            todo = Todos.get(element.getProperty("id")).replace("todo-","")
            todo.save("order":index)
})