From bf226250ed9cc25a05b46d89bf8816f36bdef210 Mon Sep 17 00:00:00 2001
From: blek <me@blek.codes>
Date: Sat, 30 Sep 2023 12:06:28 +1000
Subject: [PATCH] try to assign file to the input element

---
 filed/static/dragndrop-form.js | 21 +++++++++++++--------
 filed/static/paint.css         |  7 +++++++
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/filed/static/dragndrop-form.js b/filed/static/dragndrop-form.js
index 9bb2d98..6b3a527 100644
--- a/filed/static/dragndrop-form.js
+++ b/filed/static/dragndrop-form.js
@@ -10,6 +10,9 @@
         const drag_rop = document.getElementsByClassName('file-drag-n-drop-inside')[0];
         const dr_rop_t = document.getElementsByClassName('file-drag-n-drop-inside-text')[0];
 
+        /** @type {HTMLInputElement} */
+        const input_el = document.getElementById('bfile-formupload-file');
+
         function drag_end() {
             root_drag_rop.style.background = 'var(--header-sec-color)'
             drag_rop.style.borderColor = '#656565';
@@ -31,14 +34,16 @@
             if (!drdrop_enabled) return;
 
             if (e.dataTransfer.items) {
-                for (let i = 0; i != e.dataTransfer.items.length; i++) {
-                    let file = e.dataTransfer.items[i].getAsFile();
-                    text.innerText = 'Processing...';
-                    drdrop_enabled = false;
-                    await fill_bg();
-                    drdrop_enabled = true;
-                    text.innerText = `Selected file: ${file.name.substring(0,16)}${file.name.length > 16 ? '...' : ''}\nYou can drop another file to replace this one`;
-                }
+                let file = e.dataTransfer.items[0].getAsFile();
+                text.innerText = 'Processing...';
+                drdrop_enabled = false;
+                await fill_bg();
+                drdrop_enabled = true;
+                text.innerText = `Selected file: ${file.name.substring(0,16)}${file.name.length > 16 ? '...' : ''}\nYou can drop another file to replace this one`;
+
+                const transfer = new DataTransfer();
+                transfer.items.add(file);
+                input_el.files = transfer.files;
             }
         });
         drag_rop.addEventListener('dragover', e => {
diff --git a/filed/static/paint.css b/filed/static/paint.css
index f674091..5741338 100644
--- a/filed/static/paint.css
+++ b/filed/static/paint.css
@@ -101,6 +101,13 @@ p {
     background: var(--header-color);
     border: 1px solid var(--header-sec-color);
     border-radius: 12px;
+    width: fit-content;
+    transition: 250ms ease;
+}
+@media (max-width:667px) {
+    .card {
+        width: 100%;
+    }
 }
 .card-title {
     border-radius: 12px 12px 0 0;