better media code

pull/138/head
Aevann 2023-03-06 20:02:12 +02:00
parent 5e84b0d5ec
commit b83aa1d82c
9 changed files with 24 additions and 10 deletions

View File

@ -143,7 +143,7 @@ function register_new_elements(e) {
});
}
const file_inputs = document.querySelectorAll('input[type="file"]:not(.not-handle-files)')
const file_inputs = document.querySelectorAll('input[multiple="multiple"]')
for (const input of file_inputs) {
input.onchange = () => {handle_files(input, input.files)};
}

View File

@ -166,9 +166,9 @@ function send() {
autoExpand(ta);
document.getElementById("quotes").classList.add("d-none")
document.getElementById('quotes_id').value = null;
document.getElementById("filename").innerHTML = '<i class="fas fa-image" style="font-size:1.3rem!important"></i>'
oldfiles[ta.id] = [];
input.value = null;
input.previousElementSibling.innerHTML = '<i class="fas fa-image" style="font-size:1.3rem!important"></i>'
input.parentElement.nextElementSibling.classList.add('d-none');
box.scrollTo(0, box.scrollHeight);
@ -298,6 +298,20 @@ document.addEventListener('click', function (e) {
}
});
const input = document.getElementById('file')
function handle_files() {
if (!input.files.length) return
input.previousElementSibling.textContent = input.files[0].name.substr(0, 50);
}
input.onchange = handle_files
document.onpaste = function(event) {
input.files = structuredClone(event.clipboardData.files);
handle_files()
}
box.scrollTo(0, box.scrollHeight)
setTimeout(function () {
box.scrollTo(0, box.scrollHeight)

View File

@ -525,7 +525,7 @@ if (file_upload) {
if (file_upload.files)
{
const filename = file_upload.files[0].name
document.getElementById('filename-show').textContent = filename.substr(0, 50);
file_upload.previousElementSibling.textContent = filename.substr(0, 50);
if (IMAGE_FORMATS.some(s => filename.toLowerCase().endsWith(s)))
{
const fileReader = new FileReader();

View File

@ -18,7 +18,7 @@
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid">
<label class="btn btn-secondary m-0" for="file-upload">
<div id="filename-show">Select Image</div>
<div>Select Image</div>
<input autocomplete="off" id="file-upload" accept="image/*" type="file" name="image" {% if g.is_tor %}disabled{% endif %} hidden>
</label>
</div>

View File

@ -115,7 +115,7 @@
<span class="my-auto ml-1">
<label class="btn btn-secondary format mb-0">
<div id="filename" class="mr-3" style="font-size:12px"><i class="fas fa-image" style="font-size:1.3rem!important"></i></div>
<div class="mr-3" style="font-size:12px"><i class="fas fa-image" style="font-size:1.3rem!important"></i></div>
<input autocomplete="off" id="file" accept="image/*" type="file" name="file" {% if g.is_tor %}disabled{% endif %} hidden>
</label>
<button type="button" class="text-danger text-lg font-weight-bold ml-2 remove-files d-none" data-bs-toggle="tooltip" title="Remove Files">X</button>

View File

@ -190,7 +190,7 @@
<form action="/settings/song_change_mp3" method="post" enctype="multipart/form-data">
<input hidden name="formkey" value="{{v|formkey}}">
<label class="btn btn-secondary d-inline-block m-0 mb-3">
<div id="filename-show2"><i class="fas fa-file"></i>
<div><i class="fas fa-file"></i>
{% if v.song and v.song|length in (1,2,3,4,5,17) %}
{{v.song}}.mp3
{% else %}

View File

@ -42,8 +42,8 @@
<img loading="lazy" id="image-preview" style="max-width:50%">
<label class="btn btn-secondary m-0" for="file-upload">
<div id="filename-show">Select File</div>
<input class="not-handle-files" autocomplete="off" id="file-upload" accept="image/*, video/*, audio/*" type="file" name="file-url" {% if g.is_tor %}disabled{% endif %} hidden>
<div>Select File</div>
<input autocomplete="off" id="file-upload" accept="image/*, video/*, audio/*" type="file" name="file-url" {% if g.is_tor %}disabled{% endif %} hidden>
</label>
<small class="form-text text-muted">Optional if you have text.</small>
<small class="form-text text-muted">You can upload images, videos, or audio.</small>

View File

@ -18,7 +18,7 @@
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid">
<label class="btn btn-secondary m-0" for="file-upload">
<div id="filename-show">Select Image</div>
<div>Select Image</div>
<input autocomplete="off" id="file-upload" accept="image/*" type="file" name="image" {% if g.is_tor %}disabled{% endif %} hidden>
</label>
</div>

View File

@ -17,7 +17,7 @@
<img loading="lazy" id="image-preview" class="d-none" style="max-width:50%;border:5px white solid">
<label class="btn btn-secondary m-0" for="file-upload">
<div id="filename-show">Select Image</div>
<div>Select Image</div>
<input autocomplete="off" id="file-upload" accept="image/*" type="file" name="image" {% if g.is_tor %}disabled{% endif %} hidden>
</label>
</div>