From 9a607af279a8423cc703654d830ed4d219e98bca Mon Sep 17 00:00:00 2001
From: Art Cancro <ajc@citadel.org>
Date: Tue, 12 Dec 2023 21:10:57 -0500
Subject: [PATCH] "Number of attachments" div name is now variable.

Actually it's an array of strings, and the upload module will
update every div stored in there with the attachment count.
---
 webcit-ng/static/js/upload.js | 30 ++++++++++++++++++++++--------
 1 file changed, 22 insertions(+), 8 deletions(-)

diff --git a/webcit-ng/static/js/upload.js b/webcit-ng/static/js/upload.js
index 257ff7562..54713f5dd 100644
--- a/webcit-ng/static/js/upload.js
+++ b/webcit-ng/static/js/upload.js
@@ -8,7 +8,7 @@
 
 var uploads_in_progress = 0;
 var uploads = [] ;								// everything the user has uploaded
-
+var attachment_counter_divs = [] ;						// list of divs containing attachment counters
 
 // Remove the upload window completely (even if it's hidden)
 function deactivate_uploads() {
@@ -21,10 +21,13 @@ function deactivate_uploads() {
 
 // Turn the specified div into a place where we can upload.  (Note: permanently changes the drag-and-drop behavior of that div.)
 function activate_uploads(parent_div) {
+
+		attachment_counter_divs = [ "num_attachments" ] ;
+
 		document.getElementById(parent_div).innerHTML += `
 			<div class="ctdl-upload" id="ctdl-upload">
 				<div id="ctdl_attachments_title" class="ctdl-compose-attachments-title">
-					<div><h1><i class="fa fa-paperclip" style="color:grey"></i>` + _("Attachments:") + ` <span id="num_attachments">` + uploads.length + `</span></h1></div>
+					<div><h1><i class="fa fa-paperclip" style="color:grey"></i>` + _("Attachments:") + ` <span id="${attachment_counter_divs[0]}">` + uploads.length + `</span></h1></div>
 					<div><h1><i class="fas fa-window-close" style="color:red" onClick="show_or_hide_upload_window()"></i></h1></div>
 				</div>
 				<br>
@@ -74,6 +77,14 @@ function handle_upload_files(files) {
 }
 
 
+// update the attachment counter div(s) with the current number of items
+function update_attachment_count() {
+	for (let i = 0; i < attachment_counter_divs.length; ++i) {
+		document.getElementById(attachment_counter_divs[i]).innerHTML = uploads.length;
+	}
+}
+
+
 // Delete an uploaded item from the list
 delete_upload = async(ref) => {
 
@@ -85,7 +96,8 @@ delete_upload = async(ref) => {
 		var el = document.getElementById(ref);						// ...remove it from the screen...
 		el.parentNode.removeChild(el);
 		uploads = uploads.filter((r) => r.ref != ref);					// ...remove it from the array...
-		document.getElementById("num_attachments").innerHTML = uploads.length;		// ...and update our count
+		update_attachment_count();
+		// document.getElementById(attachment_counter_divs[0]).innerHTML = uploads.length;	// ...and update our count
 	}
 }
 
@@ -118,7 +130,8 @@ function upload_file(file) {
 				// append it to the global list of uploads
 				uploads.push(item);
 			});
-			document.getElementById("num_attachments").innerHTML = uploads.length;
+			update_attachment_count();
+			// document.getElementById(attachment_counter_divs[0]).innerHTML = uploads.length;
 		}
 		else if (xhr.readyState == 4 && xhr.status != 200) {
 			// remove the "uploading in progress" message (there was an error, so just let it disappear)
@@ -145,7 +158,7 @@ function upload_highlight(e) {
 	let dropArea = document.getElementById("ctdl-upload");
 	dropArea.classList.add('highlight')
 
-	document.getElementById("ctdl-upload").style.display = "block";		/* also make it appear */
+	document.getElementById("ctdl-upload").style.display = "block";			// also make it appear
 }
 
 
@@ -160,10 +173,10 @@ function upload_unhighlight(e) {
 function show_or_hide_upload_window() {
 
 	if (document.getElementById("ctdl-upload").style.display == "block") {
-		document.getElementById("ctdl-upload").style.display = "none";		/* turn it off */
+		document.getElementById("ctdl-upload").style.display = "none";		// turn it off
 	}
 	else {
-		document.getElementById("ctdl-upload").style.display = "block";		/* turn it on */
+		document.getElementById("ctdl-upload").style.display = "block";		// turn it on
 	}
 }
 
@@ -190,7 +203,8 @@ function flush_uploads() {
 		flush_one_upload(u.ref);
 	});
         uploads=[];
-	document.getElementById("num_attachments").innerHTML = uploads.length;
+	update_attachment_count();
+	// document.getElementById(attachment_counter_divs[0]).innerHTML = uploads.length;
 
 	deactivate_uploads();	// this makes the window get destroyed too
 }
-- 
2.30.2