don't action skip when playing

src/js/config.js

@@ -1,7 +1,7 @@
 module.exports = {
     time_step: 60,
     simulation_fps: 60,
-    draw_fps: 60,
+    draw_fps: 30,
     velocity_iterations: 8,
     position_iterations: 3,
     max_zoom_factor: 130,

src/js/game.js

@@ -2,6 +2,9 @@ const config = require('./config')
 const {
   Charts
 } = require('./charts')
+const {
+  tf
+} = require('./ddpg//tf_import')
 const {
   randi
 } = require('./utils')
@@ -12,15 +15,6 @@ const {
   Walker
 } = require('./walker')
 
-if (typeof window !== "undefined")
-  var requestAnimFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (callback) {
-    window.setTimeout(callback, 1000 / 60);
-  };
-else
-  var requestAnimFrame = function (callback) {
-    window.setTimeout(callback, 1000 / 60);
-  };
-
 
 chooseQoute = function () {
   var qoutes = [
@@ -39,7 +33,9 @@ chooseQoute = function () {
     'Eurovision 2050',
     'We must learn to walk before we can run',
     'This is not a disco',
-    'Disco simulator 2100'
+    'Disco simulator 2100',
+    "This is a metaphor for life",
+    "You're driving me up the wall"
   ]
   var qoute = qoutes[randi(0, qoutes.length)]
   document.getElementById('page_quote').innerText = '"' + qoute + '"'
@@ -95,38 +91,38 @@ class HeadlessGame {
   }
 }
 
+var removeCanvasBackground = function (){ 
+  var canvas=document.getElementById('main_screen')
+  canvas.style.background=''
+}
+
 class Game extends HeadlessGame {
   constructor(config) {
     super(config)
 
     this.agent.stop()
-    console.log('../outputs', 'model-ddpg-walker/model')
-    this.agent.restore('../outputs', 'model-ddpg-walker/model')
-    setInterval(() => this.agent.play(), 100)
+    this.agent.restore('./checkpoints', 'model-ddpg-walker-22h/model') // load checkpoint
+    this.agent.restore('../outputs', 'model-ddpg-walker/model') // load latest
+    setInterval(() => {
+      this.play()
+    }, 1000/this.config.draw_fps)
     chooseQoute()
+    removeCanvasBackground()
   }
 
-  displayProgress() {
-    var stats = {
-      'trainingTime': this.step_counter / config.simulation_fps,
-      'meanProgress': this.walkers.map(w => w.last_position).reduce((s, v) => s + v) / this.walkers.length,
-      'meanReward': this.walkers.map(w => w.reward).reduce((s, v) => s + v) / this.walkers.length,
-      'bufferSize': this.agents[0].brain.buffer.size
-    }
-    document.getElementById('stats-prog').innerText = JSON.stringify(stats, null, 2)
-  }
-
-  updateCharts() {
-    var groupN = 100
-    var maxN = 100000
-    if (this.agents[0].infos.length >= groupN) {
-      if (!this.charts) {
-        this.charts = new Charts()
-        this.charts.init(this.agents, groupN)
-      } else {
-        this.charts.update(this.agents, groupN, maxN)
-      }
+  /**
+   * Play one step
+   */
+  play() {
+    // Get the current state
+    const state = this.agent.env.getState();
+    if (this.agent.env.steps % this.config.action_repeat == 0) {
+      // Pick an action, but only on every N'th step (because of action repeat during training)
+      const tfActions = this.agent.ddpg.predict(tf.tensor2d([state]));
+      this.actions = tfActions.buffer().values;
+      tfActions.dispose();      
     }
+    this.agent.env.step(this.actions, 1);
   }
 }
 

src/js/walker.js

@@ -582,20 +582,21 @@ class Walker {
     if (motorSpeeds[3] <= 0) this.right_arm.frictionJoint.maxForce = this.right_arm.frictionJoint.maxTorque
   }
 
-  step(motorSpeeds) {
+  step(motorSpeeds, action_repeat) {
     /*
         Take one step into the environement
         @delta (Float) time since the last update
         @action: (Integer) The action to take (can be null if no action)
     */
+    if (action_repeat===undefined) action_repeat = this.config.action_repeat
 
-    if (Math.random() < 0.005) {
-      this.addBallOnWalker()
-    }
+    // if (Math.random() < 0.0005) {
+    //   this.addBallOnWalker()
+    // }
 
     // repeat actions
     // FIXME I need to delay between drawing each frame. Right now action repeat makes it look like frames are skipping
-    for (let i = 0; i < this.config.action_repeat; i++) {
+    for (let i = 0; i < action_repeat; i++) {
       // TODO add sitcky actions once it's working
       this.world.ClearForces();
       this.simulationPreStep(motorSpeeds)
@@ -653,7 +654,8 @@ class Walker {
       head_height: (this.head.head.GetPosition().y - mean_foot_height),
       center_x: this.torso.upper_torso.GetPosition().x,
       center_y: this.torso.upper_torso.GetPosition().y,
-      mean_foot_height
+      mean_foot_height,
+      date: new Date(),
     }
 
     this.reward = Object.values(this.rewards).reduce((tot, v) => tot + v, 0) / 3