animation now works

src/Simulation/exampleModels/Custom.jsx

@@ -71,7 +71,6 @@ class Custom extends Model  {
     //}
 
     //convert states to states with distribution and color
-    console.log(newStates);
     //newStates = newStates.map((x) => [x, 1/newStates.length, "#ffffff"]);
     let i = -1;
     newStates = newStates.map((x) =>  {
@@ -81,7 +80,6 @@ class Custom extends Model  {
       }
       return [x, 1/newStates.length, "#ffffff"];
     });
-    console.log(newStates);
 
   
     return {rules: newRules, states: newStates};
@@ -111,7 +109,6 @@ class Custom extends Model  {
     let leftSide = [subString.slice(0, subString.length / 2)];
     let rightSide = [subString.slice(subString.length / 2, subString.length)];
     let out = [leftSide, rightSide, Number(probability)];
-    console.log(out)
     return out;
     //let out = [0,0,0];
     //out[0] = (leftSide);

src/Simulation/visualizations/Chart.jsx

@@ -5,7 +5,6 @@ import '../../css/nv3d.css'
 
 class Chart extends React.Component {
   calculateChartData = () => {
-    console.log(this.props.animationLength)
     for (let i = 0; i < this.props.stateCounts.length; i++) {
       //set color
       this.props.stateCounts[i].color = 

src/Simulation/visualizations/Graph.jsx

@@ -121,7 +121,6 @@ class Graph extends React.Component {
     this.neverPlayed = false;
     //check if we pause the animation
     clearInterval(this.animationId);
-    console.log("new animation started");
     this.setState({playing: false});
     //first we need to normalize the distribution
     this.props.normalize();
@@ -147,9 +146,7 @@ class Graph extends React.Component {
       return;
     }
     if (this.state.step > this.props.animationLength) {
-      console.log("finished animation");
+      this.finishAnimation();
-      clearInterval(this.animationId);
-      this.setState({playing: false});
       return;
       //this.setState({step: 0}, () => {
         //return;
@@ -172,13 +169,22 @@ class Graph extends React.Component {
       this.cy.getElementById(allNodes[i].id()).style('background-color', color); }
 
     if (increment) {
-      this.setState({step: this.state.step + 1});
+      if (this.state.step < this.props.animationLength) {
+        this.setState({step: this.state.step + 1});
+      } else {
+        this.finishAnimation();
+      }
     } else {
       //update
       this.setState({});
     }
   }
 
+  finishAnimation() {
+    clearInterval(this.animationId);
+    this.setState({playing: false, step: this.props.animationLength});
+  }
+
   visualizeSpecificStep = (e) => {
     var val = Number(e.target.value);
     if (val < 0 || val > this.props.animationLength) {

src/SimulationScripts/simulation.js

@@ -49,8 +49,6 @@ function get_next_state(current_labels){
 		edge = graph_as_edgelist[edge];
 		let node1 = edge[0];
 		let node2 = edge[1];
-    if(node2 === 0) {
-    }
 		let current_state1 = current_labels[node1];
 		let current_state2 = current_labels[node2];
 		for(var currentRule in rules){
@@ -59,7 +57,6 @@ function get_next_state(current_labels){
 				//is spont. rule
 				continue
 			}
-      console.log("works")
 			if((current_state1 === currentRule[0][0] && current_state2 === currentRule[0][1]) || (current_state2 === currentRule[0][0] && current_state1 === currentRule[0][1])){
 				let current_fireing_time = randomExponential(currentRule[2]);
 				if(current_fireing_time < fastes_firing_time){