export interface LogEntry {
  render: () => HTMLElement[];
}

export class LogLines implements LogEntry {
  lines: string[]

  constructor (...lines: string[]) {
    this.lines = lines
  }

  render (): HTMLElement[] {
    return this.lines.map(line => {
      const div = document.createElement("div")
      div.innerText = line
      return div
    })
  }
}

export enum FormatOpt {
  Damage = "log-damage"
}

export class FormatText implements LogEntry {
  constructor (private line: string, private opt: FormatOpt) {

  }

  render (): HTMLElement[] {
    const span = document.createElement("span")
    span.innerText = this.line
    span.classList.add(this.opt)
    return [span]
  }
}

export class LogLine implements LogEntry {
  private parts: Array<string|LogEntry>

  constructor (...parts: Array<string|LogEntry>) {
    this.parts = parts
  }

  render (): HTMLElement[] {
    const span = document.createElement("span")

    this.parts.forEach(part => {
      if (typeof part === "string") {
        const partSpan = document.createElement("span")
        partSpan.innerText = part
        span.appendChild(partSpan)
      } else {
        (part as LogEntry).render().forEach(logPart => {
          span.appendChild(logPart)
        })
      }
    })

    return [span]
  }
}

export class FAElem implements LogEntry {
  constructor (private name: string) {

  }

  render (): HTMLElement[] {
    const i = document.createElement("i")
    this.name.split(" ").map(cls => i.classList.add(cls))
    return [i]
  }
}

export class CompositeLog implements LogEntry {
  entries: LogEntry[]

  constructor (...entries: LogEntry[]) {
    this.entries = entries
  }

  render (): HTMLElement[] {
    return this.entries.flatMap(e => e.render())
  }
}