Langton's ant

bower.json

@@ -22,8 +22,11 @@
     "github-fork-ribbon-css": "0.1.1",
     "twitter": "http://platform.twitter.com/widgets.js",
     "chance": "0.8.0",
-    "ejs" : "1.0.0",
-    "angulartics" : "0.20.2",
-    "domReady" : "2.0.1"
+    "ejs": "1.0.0",
+    "angulartics": "0.20.2",
+    "domReady": "2.0.1"
+  },
+  "resolutions": {
+    "angular": "1.4.8"
   }
 }

js/samples/catalog.js

@@ -2,6 +2,7 @@ define(
     [
         'text!samples/meteorites/meteorites.js', 'text!samples/meteorites/README.md',
         'text!samples/snake/snake.js', 'text!samples/snake/README.md',
+        'text!samples/langton-ant/langton-ant.js', 'text!samples/langton-ant/README.md',
         'text!samples/rain-using-state/rain-using-state.js', 'text!samples/rain-using-state/README.md',
         'text!samples/rain-using-scan/rain-using-scan.js', 'text!samples/rain-using-scan/README.md',
         'text!samples/rain-using-generate/rain-using-generate.js', 'text!samples/rain-using-generate/README.md',
@@ -13,6 +14,7 @@ define(
     ],
     (meteoritesJS, meteoritesMD,
      snakeJS, snakeMD,
+     langtonAntJS, langtonAntMD,
      rainUsingStateJS, rainUsingStateMD,
      rainUsingScanJS, rainUsingScanMD,
      rainUsingGenerateJS, rainUsingGenerateMD,
@@ -37,6 +39,12 @@ define(
                 code: snakeJS,
                 description: snakeMD
             },
+            {
+                title: 'Langton\'s ant',
+                category: 'full-game',
+                code: langtonAntJS,
+                description: langtonAntMD
+            },
             {
                 title: 'rain-using-state',
                 category: 'snippet',

js/samples/langton-ant/README.md

@@ -0,0 +1,14 @@
+An implementation of [Langton's ant](https://en.wikipedia.org/wiki/Langton%27s_ant)
+using Reactive Extensions.
+
+**How to play**
+
+This game is played differently than the others.
+
+You can:
+
+ - adjust the parameters of the algorithm to see how it behaves
+ - implement an extension, e.g.
+ [multiple colors](https://en.wikipedia.org/wiki/Langton%27s_ant#Extension_to_multiple_colors),
+ [multiple states](https://en.wikipedia.org/wiki/Langton%27s_ant#Extension_to_multiple_states),
+ [multiple ants](https://en.wikipedia.org/wiki/Langton%27s_ant#Extension_to_multiple_ants)

js/samples/langton-ant/langton-ant.js

@@ -0,0 +1,42 @@
+var squareSize = 4, antPulse = 1
+
+api.initGrid({squareSize: squareSize})
+
+var boardLayer = api.addLayer({color: '#337ab7'}), antLayer = api.addLayer({color: '#275b8c'})
+
+// place the ant in the middle of the board
+antLayer.fill({x: api.gameSize / 2, y: api.gameSize / 2})
+
+var pulse = Rx.Observable.interval(antPulse).share()
+
+// is the ant walking on an activated square?
+var probes = pulse.map(() => antLayer.getActiveSquares()[0])
+    .map(antSquare => ({
+            coord: antSquare,
+            active: boardLayer.getActiveSquares()
+                .find(boardSquare => boardSquare.x == antSquare.x && boardSquare.y == antSquare.y)
+        })
+    ).share()
+
+// http://javascript.about.com/od/problemsolving/a/modulobug.htm
+var modulo = (n, m) => ((n % m) + m) % m
+
+// determine next direction
+var directions = probes.scan((acc, step) => modulo(acc + (step.active ? -1 : 1), 4), 0)
+    .map(directionIndex =>
+        [api.directions.Left, api.directions.Up,
+        api.directions.Right, api.directions.Down][directionIndex])
+    .map(direction => direction(antLayer.getActiveSquares()[0]))
+    .share()
+
+// update ant's position
+directions.do(antLayer.fill).subscribe(() => antLayer.clear(antLayer.getActiveSquares()[0]))
+
+// switch color of square left behind
+probes.subscribe(step => (step.active ? boardLayer.clear : boardLayer.fill)(step.coord))
+
+// handle end of 'game'
+directions.where(api.isOffLimits).subscribe(api.gameOver);
+
+// display iterations
+pulse.subscribe(i => api.setText({text: i}));