export class Overlay {
  sim = undefined;
  constructor(sim) {
    this.sim = sim;

    // Add info text box
    const infoBox = document.createElement('div');
    this.sim.div.appendChild(infoBox);
    this.infoBox = infoBox;
    infoBox.style.position = 'absolute';
    infoBox.style.top = 0;
    infoBox.style.left = 0;
    infoBox.width = 'fit-content';
    infoBox.style.zIndex = 1;

  }

  renderInfo() {
    this.infoBox.innerHTML = '';
    const table = document.createElement('table');
    for (let [k, v] of Object.entries(this.sim.info)) {
      let row = document.createElement('tr');
      let keyCell = document.createElement('td');
      keyCell.innerHTML = `${k}: `;
      row.appendChild(keyCell);
      let vs = Array.isArray(v) ? v : [v];
      for (let x of vs) {
        let valueCell = document.createElement('td');
        valueCell.innerHTML = x;
        row.appendChild(valueCell);
      }
      table.appendChild(row);
    }
    this.infoBox.appendChild(table);
  }

}