Recaman

var visited = {};
var seq = [];
visited[0] = 0;
var i = 0;
var mult = 50;
var r = 150;
var g = 100;
var blu = 200;
var heightDelta = 200;
var alp = 200;

function setup() {
  var canvas = createCanvas(2000, 600);
  canvas.parent('canvas_div');
  recaman(visited, seq, 10000);
  background(220,220,255);
  setFrameRate(2);
}

function draw() {
  fill(255,0,0,10);

  if (i < 1){
    noStroke();
    fill(255,255,0, 175);
    ellipse(250,200, 150,150);
  }
  i++;
  if (i < seq.length -1){
    r++;
    g++;
    if (blu > 20){
      blu=blu-20;
    }
    if (alp > 10){
      alp -= 10;
    }
    stroke(100,15,150,alp);
    var a;
    var b;
    var under = false;
    if (seq[i-1] > seq[i]){
      a = seq[i];
      b = seq[i-1];
      fill(blu,g,r,alp);		
    } else {
      b = seq[i];
      a = seq[i-1];
      fill(r,g,blu,alp);
      under=true;		
    }
    if (i % 5 == 0){
      mult--;
    }
    if (heightDelta > 0){
      heightDelta -= 10;
    }
    a=a*mult;
    b=b*mult;
    if (a > 600){
      translate(-30, 0);
    }
    if (under){
      bezier(a, 300, a + (b-a)/3, heightDelta, 2*(b-a)/3 +a, heightDelta, b, 300); 
    } else {
      bezier(a, 300, a + (b-a)/3, 600-heightDelta, 2*(b-a)/3 +a, 600-heightDelta, b, 300); 	
    }
  }
}

function recaman(visited, seq, upperLimit){
  var i = 0;
  for (var j = 0; j < upperLimit; j++){
    if (i-j > 0 && visited[i-j] == undefined){
      visited[i-j] = j;
      seq[j] = i-j;
      i=i-j;;
    } else {
      visited[i+j] = j;
      seq[j]=i+j;
      i=i+j;
    }	
  }
}