Html info

examples/neuroevolution-flappybird/bird.js

@@ -62,7 +62,7 @@ class Bird {
     let closest = null;
     let record = Infinity;
     for (let i = 0; i < pipes.length; i++) {
-      let diff = pipes[i].x - this.x;
+      let diff = pipes[i].x - this.x + pipes[i].w;
       if (diff > 0 && diff < record) {
         record = diff;
         closest = pipes[i];
@@ -111,4 +111,4 @@ class Bird {
     // Every frame it is alive increases the score
     this.score++;
   }
-}
+}

examples/neuroevolution-flappybird/index.html

@@ -19,6 +19,8 @@
     speed: <input id="speedSlider" type="range" min="1" max="10" value="1"> <span id="speed">1</span>
     <br/> high score: <span id="hs">0</span>
     <br/> all time high score: <span id="ahs">0</span>
+    <br/> generation: <span id="gens">0</span>
+    <br/> birds alive: <span id="birdsalive">0</span>
   </p>
   <p>
     <button id="best">run best so far</button>

examples/neuroevolution-flappybird/sketch.js

@@ -25,6 +25,9 @@ let allTimeHighScoreSpan;
 // All time high score
 let highScore = 0;
 
+// Count generations
+let generations = 1
+
 // Training or just showing the current best
 let runBest = false;
 let runBestButton;
@@ -34,6 +37,8 @@ function setup() {
   canvas.parent('canvascontainer');
 
   // Access the interface elements
+  generationText = select('#gens');
+  birdsAlive = select('#birdsalive');
   speedSlider = select('#speedSlider');
   speedSpan = select('#speed');
   highScoreSpan = select('#hs');
@@ -159,6 +164,8 @@ function draw() {
   // Update DOM Elements
   highScoreSpan.html(tempHighScore);
   allTimeHighScoreSpan.html(highScore);
+  generationText.html(generations);
+  birdsAlive.html(activeBirds.length);
 
   // Draw everything!
   for (let i = 0; i < pipes.length; i++) {
@@ -173,7 +180,8 @@ function draw() {
     }
     // If we're out of birds go to the next generation
     if (activeBirds.length == 0) {
+      generations++;
       nextGeneration();
     }
   }
-}
+}