diff --git a/css/style.css b/css/style.css index 7da5a55..21a46bc 100644 --- a/css/style.css +++ b/css/style.css @@ -23,7 +23,7 @@ ul:nth-child(1) { } li:hover { - background-color: blue; + background-color: blue; } li::before { diff --git a/index.php b/index.php index 33a1f56..bc5569b 100644 --- a/index.php +++ b/index.php @@ -11,7 +11,7 @@ - +
- + diff --git a/js/controller.js b/js/controller.js index 7e71962..2fc0133 100644 --- a/js/controller.js +++ b/js/controller.js @@ -3,20 +3,29 @@ class Controller { this.model = model; this.view = view; + this.redrawDirTree(view); - // Initialize isomorphic-git with a file system - window.fs = new LightningFS("fs"); - // I prefer using the Promisified version honestly - window.pfs = window.fs.promises; + var cloneBtn = document.getElementsByClassName("clone")[0]; + var purgeBtn = document.getElementsByClassName("purge")[0]; + cloneBtn.addEventListener("click", function () { + console.log("clone"); + }); + purgeBtn.addEventListener("click", this.purgeFS.bind(this)); + } - window.dir = "/test-clone"; + purgeFS() { + this.model.purgeFS(); + //this.drawDirTree(this.view); + this.redrawDirTree(this.view); + } + redrawDirTree(view) { this.model.dirTree().then( function (value) { - view.showDirTree(value); + view.removeDirTree(); + view.drawDirTree(value); }, function (error) {} - ); + ); } - } diff --git a/js/model.js b/js/model.js index 8057167..eebe089 100644 --- a/js/model.js +++ b/js/model.js @@ -1,26 +1,32 @@ class Model { - constructor() {} + constructor() { + // Initialize isomorphic-git with a file system + window.fs = new LightningFS("fs"); + // I prefer using the Promisified version honestly + window.pfs = window.fs.promises; + + window.dir = "/test-clone"; + } async dirList(dir = "/") { let list = await pfs.readdir(dir); - + for (let u = 0; u < list.length; u++) { let re = /^\..*$/; if (re.test(list[u])) { - list.splice(u, 1) - u-- + list.splice(u, 1); + u--; } } - let dirtree = [dir]; for (let i = 0; i < list.length; i++) { dirtree[i + 1] = list[i]; - let itemStat = await pfs.stat(dirtree[0] + dirtree[i+1]); + let itemStat = await pfs.stat(dirtree[0] + dirtree[i + 1]); if (itemStat.isDirectory()) { - dirtree[i+1] = await this.dirList(dirtree[0] + dirtree[i+1] + "/"); + dirtree[i + 1] = await this.dirList(dirtree[0] + dirtree[i + 1] + "/"); } } @@ -30,7 +36,12 @@ class Model { async dirTree(dir = "/") { var tree = await this.dirList(dir); - console.log(tree); + //console.log(tree); return tree; } + + purgeFS() { + delete window.fs; + window.fs = new LightningFS("fs", { wipe: true }); + } } diff --git a/js/view.js b/js/view.js index 991f57e..167ac06 100644 --- a/js/view.js +++ b/js/view.js @@ -1,10 +1,9 @@ class View { - constructor() { - } + constructor() {} hloubka = 1; - showDirTree(dirtree) { + drawDirTree(dirtree) { var dirtreeul = document.getElementsByTagName("ul"); var tag = document.createElement("li"); var text = document.createTextNode(dirtree[0]); @@ -18,16 +17,22 @@ class View { tag.parentElement.append(newul); for (let i = 1; i < dirtree.length; i++) { if (Array.isArray(dirtree[i])) { - this.showDirTree(dirtree[i]); - - }else{ + this.drawDirTree(dirtree[i]); + } else { var tag = document.createElement("li"); var text = document.createTextNode(dirtree[i]); - tag.appendChild(text) - newul.appendChild(tag) + tag.appendChild(text); + newul.appendChild(tag); } } this.hloubka++; } } + + removeDirTree() { + let mainul = document.getElementsByTagName("ul")[0]; + if (mainul !== undefined) { + mainul.firstChild.remove(); + } + } }