Download Style Update

2023-06-12 10:02:02 +02:00
parent a8aa121d6f
commit f6c68866bf
32 changed files with 1011 additions and 43 deletions
--- a/app/public/js/download.js
+++ b/app/public/js/download.js
@@ -0,0 +1,127 @@
+function copyToClipboard(button) {
+    input = button.parentElement.getElementsByTagName("input")[0];
+    input.select();
+    input.setSelectionRange(0, 99999);
+    navigator.clipboard.writeText(input.value)
+    temp0.parentElement.getElementsByClassName("copy")[0].classList.add("hidden");
+    temp0.parentElement.getElementsByClassName("checkmark")[1].classList.remove("hidden");
+}
+
+
+
+/*
+<div class="container">
+    <div class="file">
+        <img class="icon" src="/ico/image.svg" alt="" srcset="">
+        <div class="filename">
+            <p>test.svg</p>
+        </div>
+    </div>
+    <div class="button primary">
+        <p>Download</p>
+    </div>
+</div> 
+*/
+class file {
+    constructor(filename, extensions, index=0, hash="") {
+        this.filename = filename;
+        this.index = index;
+        this.hash = hash;
+        this.extensions = extensions;
+    }
+
+    getImage() {
+        var keys = Object.keys(this.extensions);
+        for(var i = 0; i < keys.length; i++) {
+            if (this.filename.endsWith("." + keys[i])) {
+                return "/ico/" + this.extensions[keys[i]][0] + ".svg";
+            };
+        }
+        return "/ico/unknown.svg";
+    }
+
+    getElement() {
+        if (this.hash.length > 0) {
+            var body = document.createElement("a");
+            body.href = document.location.protocol+"//"+document.location.host+"/download/"+this.hash+"/index/"+this.index;
+        } else {
+            var body = document.createElement("div");
+        }
+        
+        body.classList.add("file");
+        var icon = document.createElement("img");
+        icon.classList.add("icon");
+        icon.src = this.getImage();
+        body.appendChild(icon);
+        var fn = document.createElement("div");
+        fn.classList.add("filename");
+        var p = document.createElement("p");
+        p.innerText = this.shortString(this.filename, 15);
+        fn.appendChild(p);
+        body.appendChild(fn);
+        return body;
+    }
+
+    shortString(str, maxlen = 18) {
+        if (str.length > maxlen) {
+            var shortstr = str.slice(0, (maxlen - 3) / 2) + "..." + str.slice(-(maxlen - 3) / 2);
+        } else {
+            shortstr = str;
+        }
+        return shortstr;
+    }
+}
+
+
+
+function loadPage(hash) {
+    fetch('/api/download/' + hash)
+        .then(
+            response => response.json()
+        ).then(jsonResponse => {
+            console.log(jsonResponse);
+
+            if (jsonResponse.code == 200) {
+                var files = jsonResponse.result.files;
+                console.log(files);
+                fetch('/ico/extensions.json')
+                .then(
+                    response=>response.json()
+                ).then(jsonResponse => {
+                    var extensions = jsonResponse;
+                    vc = document.getElementsByClassName("view-container")[0];
+                    if (files.length > 1) {
+                        fc = document.getElementsByClassName("file-container")[0];
+                        for(var i = 0; i < files.length; i++) {
+                            var fo = new file(files[i].filename, extensions, i, hash)
+                            fc.appendChild(fo.getElement());
+                        }
+                        vc.classList.remove("hidden");
+                    } else if (files.length == 1) {
+                        var container = document.createElement("div");
+                        container.classList.add("container");
+                        console.log(extensions);
+                        var fo = new file(files[0].filename, extensions, 0);
+                        container.appendChild(fo.getElement());
+                        container.innerHTML = container.innerHTML+"<a target=\”_blank\” href='"+document.location.protocol+"//"+document.location.host+"/download/"+hash+"/index/"+0+"'><div class=\"button primary\"><p>Download</p></div></a>";
+                        vc.innerHTML = "";
+                        vc.appendChild(container);
+                        vc.classList.remove("hidden");
+                    } else {
+                        document.getElementsByClassName("container")[0].innerHTML = "<h1>Invalid Response</h1>";
+                    }
+                })
+            } else {
+                document.getElementsByClassName("container")[0].innerHTML = "<h1>404 Not Found</h1>";
+            }
+        });
+}
+
+/* 
+<div class="file">
+    <img class="icon" src="/ico/image.svg" alt="" srcset="">
+    <div class="filename">
+        <p>test.svg</p>
+    </div>
+</div> 
+*/