much more intuitive upload flow

files/assets/js/bottom.js

@@ -185,9 +185,6 @@ document.addEventListener("click", function (e) {
 	else if (element.classList.contains('showmore')) {
 		showmore(element)
 	}
-	else if (element.classList.contains('remove-files')) {
-		cancel_files(element)
-	}
 	else if (element.dataset.url) {
 		if (element.dataset.nonce != nonce) {
 			console.log("Nonce check failed!")

files/assets/js/core.js

@@ -454,6 +454,8 @@ function insertText(input, text) {
 		}, 1);
 	else
 		input.setSelectionRange(newPos, newPos);
+
+	input.selectionStart = newPos;
 }
 
 
@@ -484,23 +486,17 @@ function handle_files(input, newfiles) {
 		oldfiles[ta.id] = []
 	}
 
-	const span = input.previousElementSibling
 	if (input.files.length > 20)
 	{
 		alert("You can't upload more than 20 files at one time!")
 		input.value = null
 		input.parentElement.nextElementSibling.classList.add('d-none');
-		span.innerHTML = ''
 		oldfiles[ta.id] = []
 		return
 	}
 
-	if (!span.textContent) span.textContent = ' '
-
 	for (const file of newfiles) {
 		oldfiles[ta.id].push(file)
-		if (span.innerHTML != ' ') span.innerHTML += ', '
-		span.innerHTML += file.name.substr(0, 25);
 		if (location.pathname != '/chat' && location.pathname != '/old_chat')
 			insertText(ta, `[${file.name}]`);
 		}
@@ -574,31 +570,6 @@ document.onpaste = function(event) {
 	handle_files(input, files);
 }
 
-function cancel_files(element) {
-	const input = element.previousElementSibling.querySelector('input[type="file"]');
-	const span = input.previousElementSibling;
-	const ta = input.parentElement.parentElement.parentElement.parentElement.querySelector('textarea.file-ta');
-
-	for (const file of input.files) {
-		ta.value = ta.value.replaceAll(`[${file.name}]`, "");
-	}
-	ta.value = ta.value.trim();
-
-	span.innerHTML = '';
-
-	input.value = null;
-
-	input.parentElement.nextElementSibling.classList.add('d-none');
-
-	oldfiles[ta.id] = [];
-
-	element.classList.add('d-none');
-
-	ta.focus();
-
-	if (typeof checkForRequired === "function") checkForRequired();
-}
-
 function handleUploadProgress(e, upload_prog) {
 	const bar = upload_prog.firstElementChild;
 	const percentIndicator = upload_prog.lastElementChild;

files/helpers/media.py

@@ -45,7 +45,7 @@ def process_files(files, v, body, is_dm=False, dm_user=None):
 
 	for file in files:
 		if f'[{file.filename}]' not in body:
-			body += f'\n[{file.filename}]'
+			continue
 
 		if file.content_type.startswith('image/'):
 			name = f'/images/{time.time()}'.replace('.','') + '.webp'

files/routes/comments.py

@@ -166,7 +166,7 @@ def comment(v:User):
 
 		for file in files:
 			if f'[{file.filename}]' not in body:
-				body += f'\n[{file.filename}]'
+				continue
 
 			if file.content_type.startswith('image/'):
 				oldname = f'/images/{time.time()}'.replace('.','') + '.webp'

files/templates/util/macros.html

@@ -105,10 +105,9 @@
 
 {% macro file_input(id, image_only, disabled) %}
 <label class="btn btn-secondary format m-0 ml-2" for="{{id}}" {% if g.is_tor or disabled %}disabled{% endif %}>
-	<i class="fas fa-{% if image_only %}image{% else %}file{% endif %}"></i><span></span>
+	<i class="fas fa-{% if image_only %}image{% else %}file{% endif %}"></i>
 	<input autocomplete="off" id="{{id}}" accept="image/*{% if not image_only %}, video/*, audio/*{% endif %}" type="file" multiple="multiple" name="file" {% if g.is_tor or disabled %}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>
 {% endmacro %}
 
 {% macro comment_reply_box(target_fullname, html_id, wrapper_css_classes="", subwrapper_css_classes="", hide="", allow_file_upload=true, enable_cancel_button=true) %}
@@ -321,7 +320,6 @@
                 <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>
         </span>
 
         <textarea id="input-text" minlength="1" maxlength="{% if SITE == 'rdrama.net' %}200{% else %}1000{% endif %}" {% if g.browser in ("iphone","mac") %}style="font-size:16px!important"{% endif %} class="file-ta form-control" placeholder="Message" autocomplete="off" autofocus rows="1"></textarea>