import { OVERLAY_INFO_BOX_CLASSNAME } from './config.js';

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.classList.add(OVERLAY_INFO_BOX_CLASSNAME);
  }

  frame() {
    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);
  }
}