Bugfixes in the frontend and backend

Backend:
    Now correctly kills the scoreboard thread.
    However, it is not too bad to always have one running to send
    the final scoreboard too, with this you can see newly joined
    players.

Frontend:
    Merged in the snake factory to the grid controller, now
    words are correctly displayed as green or red when the response
    comes from the websocket

    The resize function has been simplified a bit

backend/Main.hs

@@ -161,10 +161,11 @@ main = do
             -- Go from play to score
             True -> do
                 thrd <- atomically $ do
+                    thrd <- notify_thread
                     writeTVar state Nothing
                     scores <- M.toList <$> readTVar db
                     writeTVar scores_var scores
-                    notify_thread
+                    return thrd
                 withJust thrd killThread
                 sendToAll =<< makeScoreMsg
             -- Go from score to play

frontend/app.coffee

@@ -18,3 +18,4 @@ russell_module.factory 'log', () -> (x) -> console.log(x)
 
 russell_module.factory 'address', () -> "192.168.1.66"
 
+

frontend/grid-controller.coffee

@@ -1,4 +1,81 @@
-russell_module.controller 'GridCtrl', ($scope, websocket, snake, make_url) ->
+russell_module.controller 'GridCtrl', ($scope, websocket, $q, $timeout) ->
+
+    # Snake logic
+    # The problem is that the snake logic takes care of the statuses
+    # The division is meant that everything about the snake and the
+    # statuses is in this little "class", and the outside takes
+    # care of interacting with the webpage
+    # This used to be a factory, but the scope needs to be applied
+    # when the result of the websocket is returned. Maybe
+    # this can be solved by submitting via the web socket in the
+    # controller, but it is unclear what would be the simplest
+    Snake = do ->
+
+        snake = []
+
+        $scope.statuses = []
+
+        clear_statuses = ->
+            $scope.statuses = (("" for i in [0..3]) for j in [0..3])
+
+        clear_statuses()
+
+        in_snake = (x,y) -> $scope.statuses[x][y] == "selected"
+
+        neighbour = ([x0,y0],[x1,y1]) ->
+            Math.max(Math.abs(x0 - x1),Math.abs(y0 - y1)) <= 1
+
+        upd_status = (from,to,path) ->
+            for [x,y] in path
+                if $scope.statuses[x][y] == from
+                    $scope.statuses[x][y] = to
+
+        word: (lookup) -> (_.map snake, lookup).join('')
+
+        clear: () ->
+            snake = []
+            clear_statuses()
+
+        submit: () ->
+            for [x,y] in snake
+                $scope.statuses[x][y] = "submitted"
+
+            snake_copy = (x for x in snake)
+
+            snake = []
+
+            answer = $q.defer()
+
+            websocket.send
+                Submit:
+                    snake: snake_copy
+
+            websocket.once "Response", (res) -> $scope.apply ->
+                console.log "Handling", res
+                new_status = if res.correct then "correct" else "wrong"
+                console.log "New status: #{new_status}"
+                upd_status "submitted", new_status, snake_copy
+                answer.resolve _.extend res,
+                    new_status: new_status
+                $timeout (-> upd_status new_status, "", snake_copy), 300
+
+            answer.promise
+
+        push: (coord) ->
+            empty = _.isEmpty snake
+            is_new = not (in_snake coord...)
+            adjacent = empty or neighbour coord, _.last snake
+            if empty or (is_new and adjacent)
+                last_status = "selected"
+                [x,y] = coord
+                $scope.statuses[x][y] = "selected"
+                snake.push coord
+
+    # Grid logic and controller
+    $scope.status = (x,y) ->
+        res = $scope.statuses[x][y]
+        # console.log "Status #{x} #{y} = #{res}"
+        res
 
     $scope.reset = () ->
         $scope.coord = [undefined,undefined]
@@ -10,9 +87,8 @@ russell_module.controller 'GridCtrl', ($scope, websocket, snake, make_url) ->
         $scope.last_status = ""
         $scope.last_word = ""
 
-        snake.erase ""
+        Snake.clear()
 
-        $scope.status = snake.status
         $scope.info = ""
 
     $scope.grid = [[]]
@@ -24,13 +100,13 @@ russell_module.controller 'GridCtrl', ($scope, websocket, snake, make_url) ->
     $scope.down = () ->
         $scope.drawing = true
         $scope.last_status = "selected"
-        snake.push($scope.coord)
+        Snake.push($scope.coord)
 
     $scope.up = () ->
         $scope.drawing = false
         $scope.last_word = $scope.word()
         $scope.last_status = "submitted"
-        snake.erase().then (res) -> $scope.$apply ->
+        Snake.submit().then (res) -> $scope.$apply ->
             $scope.last_status = res.new_status
             if res.correct
                 $scope.score += res.score
@@ -49,12 +125,12 @@ russell_module.controller 'GridCtrl', ($scope, websocket, snake, make_url) ->
             y = Number(y_str)
             $scope.coord = [x,y]
             if $scope.drawing
-                snake.push($scope.coord)
+                Snake.push($scope.coord)
 
     $scope.lookup = (x,y) -> $scope.grid[y][x]
 
     $scope.word = () ->
-        snake.word((w) -> $scope.lookup w...) or $scope.last_word
+        Snake.word((w) -> $scope.lookup w...) or $scope.last_word
 
     websocket.on "Grid", (data) -> $scope.$apply ->
         $scope.reset()

frontend/index.html

@@ -10,12 +10,11 @@
     <script src="js/websocket.js" type="text/javascript"></script>
 
     <!--
-    <script src="js/mock_scoreboard.js" type="text/javascript"></script>
     <script src="js/mock_grid.js" type="text/javascript"></script>
+    <script src="js/mock_scoreboard.js" type="text/javascript"></script>
     -->
 
     <script src="js/resize.js" type="text/javascript"></script>
-    <script src="js/snake.js" type="text/javascript"></script>
     <script src="js/grid-controller.js" type="text/javascript"></script>
     <script src="js/user-controller.js" type="text/javascript"></script>
     <script src="js/summary-controller.js" type="text/javascript"></script>

frontend/resize.coffee

@@ -1,7 +1,7 @@
 
-window.russell_module.factory 'resize', () ->
+russell_module.factory 'resize', () ->
 
-    recalc: (set_css) ->
+    recalc: () ->
 
         h = $(window).height()
         w = $(window).width()
@@ -48,37 +48,36 @@ window.russell_module.factory 'resize', () ->
         char_size = Math.floor(inner * 0.84)
         score_size = Math.floor(inner * 0.2)
 
-        set_css
-            tile:
-                width: inner_r
-                height: inner_r
-                margin: margin_r
-                'border-width': border_r
-            char:
-                'font-size': char_size
-            score:
-                'font-size': score_size
-            shadow_score:
-                'font-size': score_size
-            top:
-                height: top
-                'font-size': Math.round(top * 0.9)
-            bottom:
-                height: bottom
-                'font-size': Math.round(bottom * 0.9)
-            top_space:
-                height: space
-            bottom_space:
-                height: space
-            row:
-                width: Math.floor(w * 0.9)
-                'font-size': Math.round(bottom * 0.8)
-            row_ident:
-                'margin-left': Math.floor(w * 0.1)
-                'font-size': Math.round(bottom * 0.5)
-            one_third:
-                width: Math.floor((w * 0.9) / 3)
-            container:
-                width: Math.floor center
-                height: Math.floor h
+        tile:
+            width: inner_r
+            height: inner_r
+            margin: margin_r
+            'border-width': border_r
+        char:
+            'font-size': char_size
+        score:
+            'font-size': score_size
+        shadow_score:
+            'font-size': score_size
+        top:
+            height: top
+            'font-size': Math.round(top * 0.9)
+        bottom:
+            height: bottom
+            'font-size': Math.round(bottom * 0.9)
+        top_space:
+            height: space
+        bottom_space:
+            height: space
+        row:
+            width: Math.floor(w * 0.9)
+            'font-size': Math.round(bottom * 0.8)
+        row_ident:
+            'margin-left': Math.floor(w * 0.1)
+            'font-size': Math.round(bottom * 0.5)
+        one_third:
+            width: Math.floor((w * 0.9) / 3)
+        container:
+            width: Math.floor center
+            height: Math.floor h
 

frontend/user-controller.coffee

@@ -16,8 +16,10 @@ russell_module.controller 'UserCtrl', ($scope, websocket, make_url, resize) ->
         $scope.logged_in = true
 
     $scope.css = {}
-    resize.recalc (new_css) -> $scope.css = new_css
+
+    $scope.css = resize.recalc()
 
     # is this in AngularJS?
-    $(window).resize -> resize.recalc (new_css) -> $scope.css = new_css
+    $(window).resize -> $scope.$apply ->
+        $scope.css = resize.recalc()