mirrors
/
treebird
0
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity

Upload and load files 

FossilOrigin-Name: 01177fd25324478b1c826911906f86e4bc34a001c7df0f59b9d8428e03d82f4f
This commit is contained in:
nekobit 2022-07-12 21:54:53 +00:00
parent 95c750b07a
commit 9b66c172d8
2 changed files with 31 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
dist/js/main.js vendored
View File

@ -246,13 +246,14 @@
rightbar_frame.height = rbar_frame_win.document.body.scrollHeight;
}
function construct_file_upload(file)
function construct_file_upload(file, file_content)
{
let container = document.createElement("div");
container.className = "file-upload";
let content = document.createElement("div");
let content = document.createElement("img");
let info = document.createElement("span");
info.className = "upload-info";
content.src = file_content;
content.className = "upload-content";
container.appendChild(content);
container.appendChild(info);
@ -261,22 +262,29 @@
function evt_file_upload(e)
{
let target = e.target;
// TODO do something with this
if (target.classList.contains("used"))
target.id = `id-${state.file.file_counter++}`;
let file_upload_dom = this.closest("form").querySelector(".file-uploads-container");
file_upload_dom.className = "file-uploads-container";
const files = [...this.files];
// let reader = new FileReader();
// reader.onload = (() => {
// return (e) => {
// // do shit
// }
// })(files[0]);
let reader;
// Create file upload
for (let file of files)
{
file_upload_dom.appendChild(construct_file_upload(files));
reader = new FileReader();
reader.onload = (() => {
return (e) => {
file_upload_dom.appendChild(construct_file_upload(files, e.target.result));
}
})(file);
reader.readAsDataURL(file);
}
}

16
dist/treebird.css vendored
View File

@ -2071,19 +2071,29 @@ input[type=checkbox].hidden:not(:checked) + .list-edit-content
.file-uploads-container
{
margin-top: 8px;
white-space: nowrap;
overflow: auto;
}
.file-uploads-container .file-upload
{
overflow: hidden;
display: inline-block;
height: 130px;
margin-left: 4px;
width: 200px;
margin: 2px 4px;
background: linear-gradient(#fff, #f7f7f7);
border: 1px solid #cacaca;
border-radius: 8px;
}
.file-upload .upload-content
{
width: 200px;
height: 130px;
object-fit: cover;
opacity: 0.4;
}
/******************************
* Scrobbles *
******************************/