diff --git a/static/css/create.css b/static/css/create.css index e4d0fe7..10f088f 100644 --- a/static/css/create.css +++ b/static/css/create.css @@ -99,10 +99,34 @@ body { } .detectedFiles { - max-height: 100px; + max-height: 300px; overflow: auto; } +.detectedFiles div.dir .content { + padding-left: 10px; +} + +.detectedFiles div.dir .label { + cursor: pointer; +} + +.detectedFiles div.file .label { + cursor: text; +} + +.detectedFiles div.dir .label.closed::before { + content: "📁 "; +} + +.detectedFiles div.dir .label.opened::before { + content: "📂"; +} + +.detectedFiles div.file .label::before { + content: "🗎 "; +} + .detectedInfos h5,p { display: inline; } diff --git a/static/js/create.js b/static/js/create.js index ec0729d..175c658 100644 --- a/static/js/create.js +++ b/static/js/create.js @@ -18,8 +18,9 @@ function sortCategories(categories) { function fillDetectedFilelist(file) { var reader = new FileReader(); - fileList = document.querySelectorAll(".detectedFiles ul")[0] - fileList.innerHTML = "" + fileList = document.querySelectorAll(".detectedFiles")[0] + fileList.querySelector(".label").innerHTML = "" + fileList.querySelector(".content").innerHTML = "" reader.onload = function() { autodetectSuccess = false b = new bencode() @@ -54,13 +55,14 @@ function fillDetectedFilelist(file) { } filesGroup = document.querySelectorAll(".filesGroup")[0] - if(torrentObject.info.files.length > 0) { + if(torrentObject["info"]["files"] != undefined && torrentObject["info"]["files"].length > 0) { autodetectSuccess = true + rootElement = document.createElement("div") for(var fileIndex = 0; fileIndex < torrentObject.info.files.length; fileIndex++){ - newListElement = document.createElement("li") - newListElement.innerHTML = torrentObject.info.files[fileIndex].path[0] - fileList.appendChild(newListElement) + path = torrentObject["info"]["files"][fileIndex]["path"] + renderFile(getRoot(), path.reverse()) } + } var detectInfosGroup = document.querySelectorAll(".detectedInfosGroup")[0] @@ -73,6 +75,68 @@ function fillDetectedFilelist(file) { reader.readAsArrayBuffer(file) } +function renderFile(root, path) { + if(path.length == 0){ + return 0 + } else { + nextElement = path.pop() + folderName = "" + for(var i = 0; i < nextElement.length; i++) { + code = nextElement.charCodeAt(i) + if((code >= 97 && code <= 122) || (code >= 65 && code <= 90)) { + folderName = folderName + nextElement[i] + } + } + type = path.length > 0 ? "dir" : "file" + newRoot = getOrCreate(root, folderName, nextElement, type) + renderFile(newRoot, path) + } +} + +function getOrCreate(root, foldername, displayname, type) { + var obj = root.querySelector("div." + type + "." + foldername) + + if(obj == undefined || obj.length == 0){ + element = document.createElement("div") + element.classList.add(type) + element.classList.add(foldername) + label = document.createElement("div") + label.classList.add("label") + label.innerHTML = displayname + element.appendChild(label) + + if(type == "dir") { + label.classList.add("closed") + label.onclick = function() { + if(this.classList.contains("closed")) { + this.classList.remove("closed") + this.classList.add("opened") + } else if(this.classList.contains("opened")) { + this.classList.remove("opened") + this.classList.add("closed") + } + content = this.parentElement.querySelector(".content") + content.hidden = !content.hidden + } + content = document.createElement("div") + content.classList.add("content") + content.hidden = true + element.appendChild(content) + } + foobar = root + root = root.querySelector(".content") + root.appendChild(element) + return element + } else { + return obj + } +} + +function getRoot() { + rootElement = document.querySelectorAll(".detectedFiles.fileRoot")[0] + return rootElement +} + function fillSubcategory(value) { var subSelect = $('#subcategory') var selText = $(':first-child', subSelect).text() diff --git a/templates/create.html b/templates/create.html index eee096e..c29f19a 100644 --- a/templates/create.html +++ b/templates/create.html @@ -45,9 +45,9 @@ vim: ts=2 noexpandtab
{{ _("Detected files") }}:
-
- +
+
+