Question

I am new to coffee scripting..This is my first script and is not working..

html
 head title='hello world'
  css:
   h1{
    color: blue;
    }
  coffee:
     number   = 42
     opposite = true
     saybye = () ->
      alert 'hello'+number
      ''        
body
  h1 
   |hello world
  input type="button" onclick="saybye()" value="sayhello"

scss:
 $blue: #3bbfce;

 h2{
  color: $blue;
 } 

It says saybye is not found and should I always end with some expression which will get return. Is there a way to stop the return call?

Answer 1

I don’t know what Slim does but CoffeeScript usually gets wrapped in a function to avoid namespace pollution. So, your CoffeeScript probably ends up being converted to JavaScript something like this:

(function() {
  var number, opposite, saybye;

  number = 42;

  opposite = true;

  saybye = function() {
    alert('hello' + number);
    return '';
  };
})();

The result is that saybye is not visible to your HTML.

You really shouldn’t be using onclick in 2012, you should be binding to the event through the modern API. If you’re using jQuery, you’d do it like this:

coffee:
  number   = 42
  opposite = true
  saybye = () ->
    alert 'hello'+number
    ''  
  $ -> $('input[type=button]').click saybye

If you’re not using jQuery (or similar), then you’d do it the hard way using addEventListener on the raw DOM object. Alternatively, you could put them in window yourself and bypass scope protection:

coffee:
  window.number   = 42
  window.opposite = true
  window.saybye   = () ->
    alert 'hello' + number

As far as returning something goes, don’t worry about it, return whatever makes sense. Sometimes returning undefined makes sense, sometimes it doesn’t. If there is no obvious return value then just let CoffeeScript do what it wants, go with this:

saybye = () ->
  alert 'hello' + number

and move on to more interesting problems.