AngularJS sample : game of life

HTML

<div ng-controller="GameOfLifeCntl">
    
  <h1>AngularJS Game of Life</h1>
  Height: <input type="text" ng-model="height"/>
  Width: <input type="text" ng-model="width"/>
  <button ng-click="newGame()">New</button>
  <button ng-click="next()">Next</button>
  <button ng-click="play()" ng-hide="playing">Play</button>
  <button ng-click="stop()" ng-show="playing">Stop</button>

  <p>
    Click and drag to draw
  </p>

  <table id="board" 
    ng-mousedown="mousedown()" 
    ng-mouseup="mouseup()"
    >
      <tr ng-repeat="row in board">
          <td ng-repeat="cell in row" ng-click="toggle($parent.$index, $index)"
              ng-mousemove="mouseenter($parent.$index, $index)"
              class="no_selection {{cellClasses[$parent.$index][$index]}}">
             <span ng-show="cell">O</span>
          </td>
      </tr>
  </table>
    
</div>

CSS

h1 {
    font-size: 1.3em;
    color: #844;
    font-style: bold;    
}
table#board td {
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    vertical-align: middle;
    border: solid 1px #ddd;
}
table#board td.new {
    background-color: #efe;
}
table#board td.die {
    background-color: #fee;
}

.history {
    color: #777;
}
table.history td {
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    vertical-align: middle;
    border: solid 1px #eee;
}

.no_selection {
    -webkit-user-select: none; // webkit (safari, chrome) browsers
    -moz-user-select: none; // mozilla browsers
    -khtml-user-select: none; // webkit (konqueror) browsers
}

CoffeeScript

@GameOfLifeCntl = ($scope, $http, $timeout) ->
  init = (height, width) ->
    for h in [0..height-1]
      ( false for w in [0..width-1] )

  ############################
  # Game of Life Rules
  computeNext = (board) ->
    next = for r in [0..board.length-1]
      for c in [0..board[r].length-1]
        willLive(board, r, c) or newCell(board, r, c)

    for r in [0..board.length-1]
      for c in [0..board[r].length-1]
        board[r][c]=next[r][c]
        

  willLive = (board, row, cell) ->
    cellAt(board, row, cell) and 3 >= neighbours(board, row, cell) >= 2

  willDie = (board, row, cell) ->
    cellAt(board, row, cell) and 2 > neighbours(board, row, cell) > 3

  newCell = (board, row, cell) ->
    not cellAt(board, row, cell) and neighbours(board, row, cell) is 3

  neighbours = (board, row, cell) ->
    n = 0
    for r in [-1..1]
      for c in [-1..1]
        if r !=0 or c!=0
          n+= 1 if cellAt(board, row + r, cell + c)
    n

  cellAt = (board, row, cell) ->
    board.length > row >= 0 and
      board[row].length > cell >= 0 and
      board[row][cell]
  #
  ############################

  ############################
  # Play Controls
  $scope.playing = false
  $scope.play = ->
    $scope.playing = true

  $scope.stop= ->
    $scope.playing = false

  $scope.newGame = ->
    $scope.board = init($scope.height, $scope.width)

  $scope.$watch "playing", (playing, o)->
    fn = ->
      if $scope.playing    
          $scope.next()
          $timeout fn, 100 if $scope.playing

    fn()

  $scope.next = ->
    computeNext($scope.board)
    $scope.classes = $scope.computeClasses()
  #
  ############################

  ############################
  # Drawing Event Handling
  $scope.mousedown = ->
    $scope.playing = false
    $scope.drawing = true

  $scope.mouseup = ->
    $scope.drawing = false

  $scope.mouseenter = (row, cell)->
    if $scope.drawing
      $scope.draw(row, cell)
  #
  ############################


  $scope.draw = (row, cell)...