selected element behavior change, 'other' field for radio list.

WebGde/WebContent/WebGde-Widgets/DataInputWidget/generateFields.js

@@ -1483,7 +1483,6 @@ const inputRadiolist = (key, validation) => {
 			inputTextBox.id = `dependentTB_${key}`;
 			inputTextBox.classList.add('radioOther');
 			inputTextBox.style.display = 'none';
-			inputTextBox.style.padding = '0px';
 			dropdownContent.appendChild(inputTextBox);
 
 			// Add event listener to the "other" radio button

WebGde/WebContent/WebGde-Widgets/ElementListWidget/ElementListWidget.js

@@ -5,7 +5,7 @@ import { createLoadingModal, removeLoadingModal } from '../LoadingModal/LoadingM
 import { logoutKeycloak } from '../Logout/Logout.js';
 import { ADD_NEW_OPTION, CURRENT_NODE, BPO_URL, DISPLAYED_DETAILS } from '../config.js';
 import { DocumentControlWidget } from "../documentControlWidget/documentControlWidget.js";
-import { createErrorModal } from '../genericPopup/genericPopup.js';
+import { createErrorModal, createInfoModal } from '../genericPopup/genericPopup.js';
 import { INDEXED_DB_STORAGE, HIGHLIGHT_OBJECT, IMAGE_VIEWER_OBJECT, INDEXED_DB_NAME, INDEXED_DB_TBL_NAME, setIndexedDBStorage, setHighlightObject, setImageViewerObject, setBPOObject, BPO_OBJECT, DISPLAY_FIELD_OBJECT, setDisplayFieldObject, activateGDE, setDocumentControlObject, DOCUMENT_CONTROL_OBJECT, IS_GDE_ACTIVATED } from "../globalVariable.js";
 import PullToRefresh from './PullToRefresh.js';
 
@@ -44,14 +44,15 @@ export class ElementListWidget {
 
 		createLoadingModal("Fetching Elements", "Fetching Workers", null, null, null);
 
-		this.global.pullToRefresh = PullToRefresh.init({
-			mainElement: '#element-list',
-			onRefresh: async () => {
-				// Call the init function again
-				await this.reloadElementList(nodeId, workerId);
-			}
-		});
-
+		if (!this.global.pullToRefresh) {
+			this.global.pullToRefresh = PullToRefresh.init({
+				mainElement: '#element-list',
+				onRefresh: async () => {
+					// Call the reloadElementList function again
+					await this.reloadElementList(nodeId, workerId);
+				}
+			});
+		}
 		console.log(`Fetching workers for node ID: ${nodeId}`);
 		const workerResponse = await fetchWorkersForNode(nodeId);
 		console.log("Worker API Response:", workerResponse);
@@ -79,9 +80,17 @@ export class ElementListWidget {
 		/*		console.log("Elements API Response:", elementResponse);*/
 
 		if (elementResponse.successful && Array.isArray(elementResponse.elements)) {
-			this.elements = elementResponse.elements.filter(element =>
-				selectedWorker.queueIndex.includes(element.queueIndex)
-			);
+			if (elementResponse.elements.length === 0) {
+				// No more elements case
+				removeLoadingModal();
+				// createInfoModal(null, "Close", "No more elements available.");
+				createErrorModal(null, "Close", "No more elements available.");
+				return;
+			} else {
+				this.elements = elementResponse.elements.filter(element =>
+					selectedWorker.queueIndex.includes(element.queueIndex)
+				);
+			}
 		} else {
 			this.elements = [];
 			removeLoadingModal();
@@ -120,9 +129,16 @@ export class ElementListWidget {
 		/*		console.log("Elements API Response:", elementResponse);*/
 
 		if (elementResponse.successful && Array.isArray(elementResponse.elements)) {
-			this.elements = elementResponse.elements.filter(element =>
-				selectedWorker.queueIndex.includes(element.queueIndex)
-			);
+			if (elementResponse.elements.length === 0) {
+				// No more elements case
+				// createInfoModal(null, "Close", "No more elements available.");
+				createErrorModal(null, "Close", "No more elements available.");
+				return;
+			} else {
+				this.elements = elementResponse.elements.filter(element =>
+					selectedWorker.queueIndex.includes(element.queueIndex)
+				);
+			}
 		} else {
 			this.elements = [];
 			createErrorModal(null, "Close", `Failed to fetch elements or received malformed data: ${elementResponse}`);
@@ -301,21 +317,25 @@ export class ElementListWidget {
 			elementContainer.appendChild(elementDiv);
 			elementList.appendChild(elementContainer);
 
-			elementArrow.addEventListener("click", () =>{
-				this.showExtraDetails(element, elementContainer);
-			});
+			// elementArrow.addEventListener("click", () =>{
+			// 	this.showExtraDetails(element, elementContainer);
+			// });
 
 			// Click event listener for each element container
 			elementContainer.addEventListener("click", () => {
 				if (elementContainer.classList.contains("selected")) {
+					elementArrow.style.transform = "rotate(180deg)";
 					deselectAll();
 				} else {
 					deselectAll();
 					elementContainer.classList.add("selected");
 					this.global.selectedElement = element;
-					this.global.queueIndex = element.queueIndex; // <-- Update the queueIndex here					
+					this.global.queueIndex = element.queueIndex; // <-- Update the queueIndex here
+					this.showExtraDetails(element, elementContainer);					
 					this.global.encodeButton.disabled = false;
 					this.global.encodeButton.classList.remove("disabled");
+
+					elementArrow.style.transform = "rotate(0deg)";
 				}
 			});
 		});
@@ -372,6 +392,7 @@ export class ElementListWidget {
 
 		// Remove the current container from the DOM
 		this.global.container.remove();
+		this.global.pullToRefresh.destroy();
 
 		// Continue with the original logic
 		await createWebGdeInterface(null);

WebGde/WebContent/WebGde-Widgets/genericPopup/genericPopup.js

@@ -189,10 +189,10 @@ export function createConfirmationModal(okButtonFunction, popupTitleText, warnin
 	document.getElementById("popupContainer").style.display = "flex";
   
 	document.getElementById("yesButtonModal").addEventListener("click", function () {
-	  document.getElementById("backdropContainer").style.display = "none";
 	  if (typeof okButtonFunction === "function") {
 		okButtonFunction();
 	  }
+	  document.getElementById("backdropContainer").remove();
 	  return true;
 	});