let newIndices = [0, 1];

const functions = {

  //'fib': (x) => x <= 1 ? [1] : ['+', 'fib', '-', x, 1, 'fib', '-', x, 2],

  'fib': (x) => x <= 1 ? [1] : ['+', 'fib', x-1, 'fib', x-2],

  '+': (x, y) => [x + y],

  '-': (x, y) => [x - y],

}

​

const arity = f => f.length;

​

const isFn = x => functions[x] !== undefined;

​

function setup() {

  createCanvas(1200, 600);

  frameRate(15);

}

​

function draw() {

  background(220);

  ellipseMode(CENTER);

  rectMode(CENTER);

  textAlign(CENTER, CENTER);

  drawChain(state);

  state = update(state);

}

​

function drawChain(state) {

  let r = 40;

  let l = 10;

  for (let i = 0; i < state.length; i++) {

    const y = height / 2.0;

    fill(255);

    strokeWeight(1);

    stroke(0)

    line(i * (r + l) + r / 2, y, (i + 1) * (r + l), y)

    if(newIndices.includes(i)) {

      stroke(200, 0, 0);

      strokeWeight(1);

    }

    if (isFn(state[i])) {

      if (i === evalIndex(state))

        fill(255, 200, 200);

      rect((i + 1) * (r + l), y, r, r);

    } else {

      if (argIndices(state).includes(i))

        fill(200, 255, 200);

      circle((i + 1) * (r + l), y, r);

    }

    fill(0);

    stroke(0)

    strokeWeight(1);

    text(state[i], (i + 1) * (r + l), y);

  }

}

​

function update(state) {

  //console.log(state);

  if (state.length <= 1) {

    noLoop();

    return state;

  }

  for (let i = state.length - 1; i >= 0; i--) {

    if (isFn([state[i]])) {

      let fn = functions[state[i]];

      let arity = fn.length;

      let args = state.slice(i + 1, i + arity + 1);

      let result = fn(...args);

      //console.log(state[i], args, state.slice(i + argCount + 1, state.length));

      newState = [...state.slice(0, i), ...result, ...state.slice(i + arity + 1, state.length)];

      newIndices = range(i, i + result.length - 1);

      return newState;

    }

  }

}

​

function evalIndex(state) {

  for (let i = state.length - 1; i >= 0; i--) {

    if (isFn([state[i]])) {

      return i;

    }

  }

  return null;

}

​

function argIndices(state) {

  let index = evalIndex(state);

  if (!index) return [];

  let fn = functions[state[index]];

  let arity = fn.length;

  let indices = range(index + 1, index + arity);

  return indices;

}

​

function range(start, end) {

  return Array(end - start + 1).fill().map((_, idx) => start + idx)

}