import { Controller } from "./main";
import {LogArray, LogLocalisation} from "./api";

export class LogView {
  private readonly logpanel: HTMLElement;
  private readonly loadLog: HTMLButtonElement;
  loglocale: LogLocalisation | undefined;

  constructor(controller: Controller) {
    (document.getElementById("logview") as HTMLElement).innerHTML = require('./log.html') as string;
    this.logpanel = document.getElementById("logpanel") as HTMLElement
    this.loadLog = document.getElementById("loadLog") as HTMLButtonElement

    this.loadLog.onclick = () => {
      controller.loadLog();
    }
  }

  setLogLocalisation(loglocale: LogLocalisation) {
    this.loglocale = loglocale;
  }

  setLog(logs: LogArray) {
    this.logpanel.textContent = ""
    logs.forEach(entry => {
      let message = this.loglocale!![entry.message_id];
      let template = message.message
      template = template.replace("${number_a}", entry.a.toString());
      template = template.replace("${number_b}", entry.b.toString());
      template = template.replace("${txt_short}", entry.txt_short.toString());
      template = template.replace("${txt_long}", entry.txt_long.toString());

      let ts = new Date(entry.timestamp);

      let div = document.createElement("div")
      let timestampDiv = document.createElement("div")
      let messageDiv = document.createElement("div")
      timestampDiv.innerText = ts.toISOString();
      messageDiv.innerText = template;
      div.appendChild(timestampDiv)
      div.appendChild(messageDiv)
      this.logpanel.appendChild(div)
    }
    )
  }
}