More file upload info
FossilOrigin-Name: 31096b2a5f627274d407d26ff417f63c038b27c6c5eb96d5553fd39b69e4ce38
This commit is contained in:
parent
15849c03d5
commit
e3b0eebe7d
2 changed files with 48 additions and 8 deletions
23
dist/js/main.js
vendored
23
dist/js/main.js
vendored
|
@ -246,16 +246,33 @@
|
|||
rightbar_frame.height = rbar_frame_win.document.body.scrollHeight;
|
||||
}
|
||||
|
||||
function filesize_to_str(bs)
|
||||
{
|
||||
const val = bs === 0 ? 0 : Math.floor(Math.log(bs) / Math.log(1024));
|
||||
return (bs / 1024**val).toFixed(1) * 1 + ['B', 'kB', 'MB', 'GB', 'TB'][val];
|
||||
}
|
||||
|
||||
function html_encode(str)
|
||||
{
|
||||
let en = document.createElement("span");
|
||||
en.textContent = str;
|
||||
return en.innerHTML;
|
||||
}
|
||||
|
||||
function construct_file_upload(id, file, file_content)
|
||||
{
|
||||
let container = document.createElement("div");
|
||||
container.className = "file-upload";
|
||||
container.id = "file-id-" + id;
|
||||
let content = document.createElement("img");
|
||||
let info = document.createElement("span");
|
||||
container.className = "file-upload";
|
||||
container.id = "file-id-" + id;
|
||||
|
||||
info.className = "upload-info";
|
||||
info.innerHTML = `<span class="filesize">${filesize_to_str(file.size)}</span> • <span class="filename">${html_encode(file.name)}</span>`;
|
||||
|
||||
content.src = file_content;
|
||||
content.className = "upload-content";
|
||||
|
||||
container.appendChild(content);
|
||||
container.appendChild(info);
|
||||
return container;
|
||||
|
@ -313,7 +330,7 @@
|
|||
return (e) => {
|
||||
let file_id = filepicker_add(id, file);
|
||||
|
||||
file_upload_dom.appendChild(construct_file_upload(file_id, files, e.target.result));
|
||||
file_upload_dom.appendChild(construct_file_upload(file_id, file, e.target.result));
|
||||
}
|
||||
})(file);
|
||||
reader.readAsDataURL(file);
|
||||
|
|
33
dist/treebird.css
vendored
33
dist/treebird.css
vendored
|
@ -1694,13 +1694,18 @@ input[type=radio].hidden:not(:checked) + .emoji-picker-emojos
|
|||
}
|
||||
|
||||
/* Attachments */
|
||||
.attachments img
|
||||
{
|
||||
min-width: 100px;
|
||||
}
|
||||
/* .attachments img */
|
||||
/* { */
|
||||
/* display: block; */
|
||||
/* width: 487px; */
|
||||
/* min-height: 700px; */
|
||||
/* } */
|
||||
|
||||
.attachments
|
||||
{
|
||||
display: block;
|
||||
width: 487px;
|
||||
min-height: 700px;
|
||||
margin: 10px 0 3px 0;
|
||||
}
|
||||
|
||||
|
@ -2079,10 +2084,11 @@ input[type=checkbox].hidden:not(:checked) + .list-edit-content
|
|||
{
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
width: 200px;
|
||||
margin: 2px 4px;
|
||||
background: linear-gradient(#fff, #f7f7f7);
|
||||
border: 1px solid #cacaca;
|
||||
border-radius: 8px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.file-upload .upload-content
|
||||
|
@ -2091,8 +2097,25 @@ input[type=checkbox].hidden:not(:checked) + .list-edit-content
|
|||
height: 130px;
|
||||
object-fit: cover;
|
||||
opacity: 0.4;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.file-upload .upload-info
|
||||
{
|
||||
background: linear-gradient(#fbfbfb, #f0f0f4);
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
padding: 4px;
|
||||
border-top: 1px solid #bfbfc4;
|
||||
font-size: 0.9rem;
|
||||
color: #505050;
|
||||
}
|
||||
|
||||
.upload-info .filesize
|
||||
{
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/******************************
|
||||
* Scrobbles *
|
||||
|
|
Loading…
Reference in a new issue