aboutsummaryrefslogtreecommitdiff
path: root/assets
diff options
context:
space:
mode:
Diffstat (limited to 'assets')
-rw-r--r--assets/cargohold.css13
-rw-r--r--assets/cargohold.js105
2 files changed, 118 insertions, 0 deletions
diff --git a/assets/cargohold.css b/assets/cargohold.css
index 1e56769..f3db7e9 100644
--- a/assets/cargohold.css
+++ b/assets/cargohold.css
@@ -9,6 +9,19 @@ html {
background-color: #425;
}
+.queue-entry.errored {
+ background-color: red;
+}
+
+.queue-entry {
+ width: 100%;
+ padding: 0.2em;
+}
+
+.queue-entry > .name {
+ margin-right: 2em;
+}
+
#selector-label {
background-color: #333;
border-radius: 1em;
diff --git a/assets/cargohold.js b/assets/cargohold.js
new file mode 100644
index 0000000..e1278b7
--- /dev/null
+++ b/assets/cargohold.js
@@ -0,0 +1,105 @@
+/*
+ * TODO:
+ * check if files exist
+ * check file sizes
+ */
+
+var running = false;
+var queue = [];
+
+
+function queue_work(){
+ let i = 0;
+ for(; i < queue.length; i++){
+ item = queue[i];
+ if(!item.started){
+ console.log(item);
+ console.log("Starting " + item.file.name);
+ item.started = true;
+
+ let req = new XMLHttpRequest();
+ let data = new FormData();
+ data.append("file", item.file);
+ req.upload.addEventListener("progress", function(evt){
+ if(evt.lengthComputable){
+ console.log("Upload for " + item.file.name + " at " + evt.loaded / evt.total);
+ item.node.childNodes[1].value = evt.loaded;
+ }
+ });
+ req.onloadstart = function(evt){
+ console.log("Upload for " + item.file.name + " started");
+ item.node.childNodes[1].max = item.file.size;
+ item.node.childNodes[1].value = 0;
+ };
+ req.onloadend = function(evt){
+ console.log("Upload for " + item.file.name + " ended");
+ queue_work();
+ };
+ req.onerror = function(evt){
+ console.log("Upload for " + item.file.name + " errored");
+ item.node.className += " errored";
+ };
+ req.onabort = function(evt){
+ console.log("Upload for " + item.file.name + " aborted");
+ item.node.className += "errored";
+ };
+ req.onreadystatechange = function(evt){
+ console.log("Upload for " + item.file.name + " state " + req.readyState);
+ };
+ req.open("POST", 'upload');
+ req.send(data);
+ return;
+ }
+ }
+
+ console.log("Queue run done");
+ running = false;
+}
+
+function queue_run(){
+ if(running || queue.length == 0){
+ return;
+ }
+
+ running = true;
+
+ console.log("Starting queue run");
+ queue_work();
+}
+
+function element(id){
+ return document.getElementById(id);
+}
+
+function node(tag, style, text){
+ let new_node = document.createElement(tag);
+ new_node.className = style;
+ if(text){
+ new_node.textContent = text;
+ }
+ return new_node;
+}
+
+function upload_element(file){
+ let new_node = node("div", "queue-entry");
+ new_node.appendChild(node("span", "name", file.name));
+ new_node.appendChild(node("progress", "progress"));
+ element("queue").appendChild(new_node);
+ return new_node;
+}
+
+function upload_start(element){
+ for(let i = 0; i < element.target.files.length; i++){
+ console.log(element.target.files[i]);
+ queue.push({"file": element.target.files[i], "node": upload_element(element.target.files[i]), "progress": 0, "started": false});
+ }
+ queue_run();
+}
+
+function init(){
+ element("file-submit").style.display = "none";
+ element("files").onchange = upload_start;
+ //setInterval(queue_run, 1000);
+}
+
+window.onload = init;