class View {
  constructor() {}

  hloubka = 1;

  drawDirTree(dirtree) {
    var dirtreeul = document.getElementsByTagName("ul");
    var tag = document.createElement("li");
    var text = document.createTextNode(dirtree[0]);
    tag.appendChild(text);
    tag.style.fontWeight = "bold";

    dirtreeul[dirtreeul.length - this.hloubka].appendChild(tag);
    if (dirtree.length > 1) {
      var newul = document.createElement("ul");

      tag.parentElement.append(newul);
      for (let i = 1; i < dirtree.length; i++) {
        if (Array.isArray(dirtree[i])) {
          this.drawDirTree(dirtree[i]);
        } else {
          var tag = document.createElement("li");
          var text = document.createTextNode(dirtree[i]);
          tag.appendChild(text);
          newul.appendChild(tag);
        }
      }
      this.hloubka++;
    }
  }

  removeDirTree() {
    let mainul = document.getElementsByTagName("ul")[0];
    if (mainul !== undefined) {
      mainul.firstChild.remove();
    }
  }
}