Skip to content

W
web-ui
Commit 37cbdd37 by Owen Ryan Ang
Options

Merge branch 'feature-Sprint-WebGDEII-Tres' into 'development-mobile'

Feature sprint web gdeii tres See merge request !73
parents d6146918 95796502
Showing with 465 additions and 367 deletions
WebGde/WebContent/WebGde-Widgets/BPO/rejectElement.js
import { createLoadingScreen, resetGDE } from "../../script.js"; import { createLoadingScreen, removeLoadingScreen, resetGDE } from "../../script.js";
import { SCHEMA_FILE_PATH } from "../DataInputWidget/config.js"; import { SCHEMA_FILE_PATH } from "../DataInputWidget/config.js";
import { validateInput } from "../DataInputWidget/validateInput.js"; import { validateInput } from "../DataInputWidget/validateInput.js";
import { goBackToElementListViewer } from "../ElementListWidget/ElementListWidget.js";
import { PROJECT_CODE } from "../Submit/config.js"; import { PROJECT_CODE } from "../Submit/config.js";
import { ENCODING_PASS, REASON_LIST } from "../config.js"; import { ENCODING_PASS, REASON_LIST } from "../config.js";
import { createInfoModal, createModal } from "../genericPopup/genericPopup.js"; import { createInfoModal, createModal } from "../genericPopup/genericPopup.js";
...@@ -37,11 +38,11 @@ async function rejectElement() { ...@@ -37,11 +38,11 @@ async function rejectElement() {
async function successfulReturn() { async function successfulReturn() {
document.getElementById("backdropContainer").remove(); document.getElementById("backdropContainer").remove();
createLoadingScreen(); createLoadingScreen();
if(await BPO_OBJECT.getRandomWaitingElement()){ if(goBackToElementListViewer()){
resetGDE(); resetGDE();
}; };
} }
createInfoModal(await successfulReturn, 'OK', "Element rejected"); createInfoModal(successfulReturn, 'OK', "Element rejected");
...@@ -333,11 +334,11 @@ function saveExceptionToXml(){ ...@@ -333,11 +334,11 @@ function saveExceptionToXml(){
"userId": sessionStorage.getItem("user_id"), "userId": sessionStorage.getItem("user_id"),
"elementId": elementId, "elementId": elementId,
"schema": SCHEMA_FILE_PATH, "schema": SCHEMA_FILE_PATH,
"totalRec":"0", "totalRec": 0,
"maxRec": "1", "maxRec": "1",
"totalKeystroke": "", "totalKeystroke": 0,
"procTime": "", "procTime": "",
"procDuration": "", "procDuration": 0,
"eob": "", "eob": "",
"exceptionRemark": selected, "exceptionRemark": selected,
"recordNo": "0", "recordNo": "0",
......
WebGde/WebContent/WebGde-Widgets/BPO/returnElement.js
import { createLoadingScreen, removeLoadingScreen, resetGDE } from "../../script.js"; import { createLoadingScreen, removeLoadingScreen, resetGDE } from "../../script.js";
import { SCHEMA_FILE_PATH } from "../DataInputWidget/config.js"; import { SCHEMA_FILE_PATH } from "../DataInputWidget/config.js";
import { validateInput } from "../DataInputWidget/validateInput.js"; import { validateInput } from "../DataInputWidget/validateInput.js";
import { goBackToElementListViewer } from "../ElementListWidget/ElementListWidget.js";
import { removePrompt, showPrompt } from "../LogInWidget/LogInPrompt.js";
import { PROJECT_CODE } from "../Submit/config.js"; import { PROJECT_CODE } from "../Submit/config.js";
import { interval } from "../captureMetrics/captureMetrics.js"; import { interval } from "../captureMetrics/captureMetrics.js";
import { createInfoModal, createModal } from "../genericPopup/genericPopup.js"; import { createInfoModal, createModal } from "../genericPopup/genericPopup.js";
...@@ -84,81 +86,62 @@ function returnSaveXML(){ ...@@ -84,81 +86,62 @@ function returnSaveXML(){
} }
export function createReturnWindow() { export function createReturnWindow() {
let overlay = document.createElement("div"); let popUpDisplay = document.createElement("div");
overlay.classList.add("genericPopup"); popUpDisplay.id = "returnWindow";
popUpDisplay.classList.add("modal-container")
let endWindow = document.createElement('div'); let screenMain = document.createElement('div');
endWindow.id = 'end_window'; screenMain.id = 'parent_Window';
endWindow.classList.add("parent_Window") screenMain.classList.add('return-modal');
document.body.appendChild(screenMain);
let endBodyDiv = document.createElement('div');
endBodyDiv.id = 'endBodyDiv'; let returnLabel = document.createElement("div");
let endLabel = document.createElement('p'); returnLabel.textContent = "Return Element?";
endLabel.innerText = "Current Element will be Returned."; returnLabel.classList.add("headerLabel");
let endContinue = document.createElement('p'); screenMain.appendChild(returnLabel);
endContinue.innerText = "Continue Y/N?";
let buttonPanel = document.createElement("div");
let endOkCnclDiv = document.createElement('div'); buttonPanel.classList.add("floatingButtonPanel");
endOkCnclDiv.id = 'endOkCnclCont';
let cancelButton = createButtonElem("normalButton", "Cancel");
let okEnd = document.createElement('button'); let okButton = createButtonElem("emphasizeButton", "Ok");
okEnd.classList.add("emphasizeButton");
okEnd.innerHTML = 'ok'; buttonPanel.append(cancelButton);
okEnd.id = 'okEndButtn'; buttonPanel.append(okButton);
okEnd.onclick = async function() { screenMain.appendChild(buttonPanel);
createLoadingScreen();
okButton.onclick = async function() {
showPrompt("Returning Element", "Please wait...", null, null, null);
let response = await returnElementBPO(sessionStorage.getItem("element_id")); let response = await returnElementBPO(sessionStorage.getItem("element_id"));
if (response.status == 200) { if (response.status == 200) {
document.getElementById("counter").innerHTML = "";
clearTimeout(interval);
sessionStorage.removeItem("section"); sessionStorage.removeItem("section");
sessionStorage.removeItem("doctype"); sessionStorage.removeItem("doctype");
localStorage.clear(); removePrompt();
document.getElementById("returnWindow").remove();
function successfulReturn() { goBackToElementListViewer();
document.getElementById("backdropContainer").remove();
}
createInfoModal(successfulReturn, 'OK', "Element Returned");
if(await BPO_OBJECT.getRandomWaitingElement()){
resetGDE();
};
}else{ }else{
//PROMPT.createInfoPrompt(`Error ${response.status}: Returning element`); function errorReturn(){
function successfulReturn() { removePrompt();
logoutKeycloak();
} }
removeLoadingScreen(); createInfoModal(errorReturn, 'Error', "Error ${response.status}: Returning element");
createInfoModal(successfulReturn, 'Log out', "Error ${response.status}: Returning element");
} }
overlay.remove();
} }
let cancelEnd = document.createElement('button'); cancelButton.addEventListener("click", function() {
cancelEnd.classList.add("normalButton"); document.getElementById("returnWindow").remove();
cancelEnd.innerHTML = 'cancel';
cancelEnd.id = 'cnclEndButton';
endOkCnclDiv.appendChild(okEnd);
endOkCnclDiv.appendChild(cancelEnd);
endBodyDiv.appendChild(endLabel);
endBodyDiv.appendChild(endContinue);
endBodyDiv.appendChild(endOkCnclDiv);
endWindow.appendChild(endBodyDiv);
cancelEnd.addEventListener("click", function() {
overlay.remove();
}); });
popUpDisplay.append(screenMain);
popUpDisplay.style.display = "block";
document.body.append(popUpDisplay);
}
function createButtonElem(className, buttonName, icon) {
overlay.append(endWindow); /* let buttonElem = document.createElement("button"); */
document.body.append(overlay); let buttonElem;
buttonElem = document.createElement("button");
buttonElem.classList.add(className);
buttonElem.textContent = buttonName;
return buttonElem;
} }
\ No newline at end of file
WebGde/WebContent/WebGde-Widgets/ElementListWidget/ElementListWidget.js
import { createWebGdeInterface } from '../../script.js'; import { createWebGdeInterface, removeLoadingScreen } from '../../script.js';
import { ADD_NEW_OPTION, CURRENT_NODE, DOMAIN } from '../config.js';
import { DocumentControlWidget } from "../documentControlWidget/documentControlWidget.js"; import { DocumentControlWidget } from "../documentControlWidget/documentControlWidget.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 { 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";
const API_ROOT = `${DOMAIN}bpo/req`;
const API_ROOT = "http://52.207.220.74:8080/bpo/req";
export class ElementListWidget { export class ElementListWidget {
global = { global = {
...@@ -11,7 +11,9 @@ export class ElementListWidget { ...@@ -11,7 +11,9 @@ export class ElementListWidget {
newButton: null, newButton: null,
encodeButton: null, encodeButton: null,
selectedElement: null, selectedElement: null,
workers: [] workers: [],
queueIndex: null,
workerId: null
}; };
constructor(nodeId, containerId) { constructor(nodeId, containerId) {
...@@ -24,8 +26,8 @@ export class ElementListWidget { ...@@ -24,8 +26,8 @@ export class ElementListWidget {
document.body.appendChild(this.global.container); document.body.appendChild(this.global.container);
} }
this.workerId = sessionStorage.getItem("user_id"); this.global.workerId = sessionStorage.getItem("user_id");
this.init(nodeId, this.workerId); this.init(nodeId, this.global.workerId);
} }
async init(nodeId, workerId) { async init(nodeId, workerId) {
...@@ -110,6 +112,7 @@ export class ElementListWidget { ...@@ -110,6 +112,7 @@ export class ElementListWidget {
deselectAll(); deselectAll();
elementContainer.classList.add("selected"); elementContainer.classList.add("selected");
this.global.selectedElement = element; this.global.selectedElement = element;
this.global.queueIndex = element.queueIndex; // <-- Update the queueIndex here
this.showExtraDetails(element, elementContainer); this.showExtraDetails(element, elementContainer);
this.global.encodeButton.disabled = false; this.global.encodeButton.disabled = false;
this.global.encodeButton.classList.remove("disabled"); this.global.encodeButton.classList.remove("disabled");
...@@ -136,14 +139,18 @@ export class ElementListWidget { ...@@ -136,14 +139,18 @@ export class ElementListWidget {
buttonContainer.appendChild(this.global.encodeButton); buttonContainer.appendChild(this.global.encodeButton);
const newButton = document.createElement("button"); if (ADD_NEW_OPTION === 'Y'){
newButton.id = "new-btn"; const newButton = document.createElement("button");
newButton.textContent = "NEW"; newButton.id = "new-btn";
newButton.addEventListener("click", () => this.handleNewClick()); newButton.textContent = "NEW";
buttonContainer.appendChild(newButton); newButton.addEventListener("click", () => this.handleNewClick());
buttonContainer.appendChild(newButton);
this.global.newButton = newButton;
}
this.global.container.appendChild(buttonContainer); this.global.container.appendChild(buttonContainer);
this.global.newButton = newButton;
} }
...@@ -195,6 +202,7 @@ export class ElementListWidget { ...@@ -195,6 +202,7 @@ export class ElementListWidget {
if (this.global.selectedElement) { if (this.global.selectedElement) {
sessionStorage.setItem('selectedElementId', this.global.selectedElement.elementId); sessionStorage.setItem('selectedElementId', this.global.selectedElement.elementId);
sessionStorage.setItem('selectedElementExtraDetails', JSON.stringify(this.global.selectedElement.extraDetails)); sessionStorage.setItem('selectedElementExtraDetails', JSON.stringify(this.global.selectedElement.extraDetails));
sessionStorage.setItem('element_file_loc', this.global.selectedElement.fileLocation)
} }
// Remove the current container from the DOM // Remove the current container from the DOM
...@@ -209,6 +217,7 @@ export class ElementListWidget { ...@@ -209,6 +217,7 @@ export class ElementListWidget {
// Retrieve and display the selected element's ID // Retrieve and display the selected element's ID
const elementId = sessionStorage.getItem('selectedElementId'); const elementId = sessionStorage.getItem('selectedElementId');
sessionStorage.setItem("element_id", elementId);
const elementIdDiv = document.createElement('div'); const elementIdDiv = document.createElement('div');
elementIdDiv.textContent = `Element ID: ${elementId}`; elementIdDiv.textContent = `Element ID: ${elementId}`;
elementIdDiv.classList.add('element-id'); elementIdDiv.classList.add('element-id');
...@@ -230,10 +239,14 @@ export class ElementListWidget { ...@@ -230,10 +239,14 @@ export class ElementListWidget {
// Append the DocumentControlWidget // Append the DocumentControlWidget
setDocumentControlObject(new DocumentControlWidget()); setDocumentControlObject(new DocumentControlWidget());
inputContainer.appendChild(DOCUMENT_CONTROL_OBJECT.getWidget()); inputContainer.appendChild(DOCUMENT_CONTROL_OBJECT.getWidget());
}
// Call assignElementToWorker to assign the selected element to the current worker
const assignResponse = await assignElementToWorker(this.global.workerId, this.nodeId, this.global.queueIndex, elementId);
if (!assignResponse.successful) {
console.error('Failed to assign element to worker:', assignResponse);
return;
}
}
} }
async function fetchWorkersForNode(nodeId) { async function fetchWorkersForNode(nodeId) {
...@@ -246,9 +259,25 @@ async function fetchElementsForNode(nodeId) { ...@@ -246,9 +259,25 @@ async function fetchElementsForNode(nodeId) {
return await response.json(); return await response.json();
} }
/*await createWebGdeInterface(null); async function assignElementToWorker(workerId, nodeId, queueIndex, elementId) {
setDocumentControlObject(new DocumentControlWidget()); const response = await fetch(`${API_ROOT}/workers/${workerId}/nodes/${nodeId}/elements/${queueIndex}/${elementId}`);
document.getElementById("input-field-container").appendChild(DOCUMENT_CONTROL_OBJECT.getWidget());*/ return await response.json();
}
export function goBackToElementListViewer() {
const webGdeElement = document.querySelector('.web-gde-container');
if (webGdeElement) {
webGdeElement.remove(); // This will remove the element and its children
} else {
console.warn("Element with class 'web-gde-container' not found.");
return false;
}
// Reinstantiate and reinitialize the ElementListWidget
new ElementListWidget(CURRENT_NODE, 'containerId');
removeLoadingScreen();
return true;
}
......
WebGde/WebContent/WebGde-Widgets/LogInWidget/LoginJavaInterface.js 0 → 100644
import { initializeWebpage } from "../../startup.js";
import { initializeConfig } from "../config.js";
export function loginGde(token){
sessionStorage.setItem("token", token);
var decodedToken = parseJwt(token);
// Check if the decodedToken contains the desired properties
if (decodedToken) {
const { preferred_username, domain, node } = decodedToken;
// Now you can use these variables as needed
console.log("Preferred Username:", preferred_username);
sessionStorage.setItem("user_id", preferred_username);
console.log("Domain:", domain);
console.log("Node:", node);
initializeConfig(domain, node);
initializeWebpage();
// You can return these values or perform any other actions with them here
} else {
// Handle the case where the token couldn't be decoded or doesn't contain the expected properties
console.error("Invalid token or missing properties.");
}
}
export function fallbackLogin(user_id, domain, node){
sessionStorage.setItem("user_id", user_id);
initializeConfig(domain, node);
initializeWebpage();
}
function parseJwt (token) {
var base64Url = token.split('.')[1];
var base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
var jsonPayload = decodeURIComponent(window.atob(base64).split('').map(function(c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
return JSON.parse(jsonPayload);
}
\ No newline at end of file
WebGde/WebContent/WebGde-Widgets/config.js
...@@ -4,36 +4,49 @@ export const INPUT_FOLDER = "./input/" ...@@ -4,36 +4,49 @@ export const INPUT_FOLDER = "./input/"
export const OUTPUT_FILES = "../../output/" export const OUTPUT_FILES = "../../output/"
export const METRIC_FILES = "../../metrics/" export const METRIC_FILES = "../../metrics/"
export const HIGH_LIGHT_SCHEMA = "./WebGde-Widgets/sample_schema/dbSchema_anno.xlsx" export const HIGH_LIGHT_SCHEMA = "./WebGde-Widgets/sample_schema/dbSchema_anno.xlsx"
export const ROOT_FOLDER = "/WebGde-Widgets"; export const ROOT_FOLDER = "/WebGde-Widgets";
//this determines if the images will be retrieved from the gfs //this determines if the images will be retrieved from the gfs
export const DOMAIN = "http://52.207.220.74:8080" // export const DOMAIN = "http://3.83.246.74:8080"
export const CONTEXTROOT = "gfs-explorer-ws" export var DOMAIN = ""
export const GDE_URL = DOMAIN + "/MobileGdeDev/svc/gfs-rest" export const CONTEXTROOT = "gfs-explorer-ws"
export const FOLDER_URL = DOMAIN + "/" + CONTEXTROOT + "/svc/gfs-rest/get-folder?parentPath=/Users/" export let GDE_URL = DOMAIN + "/MobileGdeDev/svc/gfs-rest"
export const DOWNLOAD_URL = DOMAIN + "/" + CONTEXTROOT + "/svc/gfs-rest/get-download-link" export let FOLDER_URL = DOMAIN + "/" + CONTEXTROOT + "/svc/gfs-rest/get-folder?parentPath=/Users/"
export const IS_RETRIEVE_FROM_GFS = "N" export let DOWNLOAD_URL = DOMAIN + "/" + CONTEXTROOT + "/svc/gfs-rest/get-download-link"
export const IS_RETRIEVE_FROM_GFS = "N"
export const INVALID_KEYS = "F1,F2,F3,F4,F5,F6,F7,F8,F9,F10,F11,F12,PrintScreen,ScrollLock,Pause,PageUp,PageDown,Insert,Delete,Control" export const INVALID_KEYS = "F1,F2,F3,F4,F5,F6,F7,F8,F9,F10,F11,F12,PrintScreen,ScrollLock,Pause,PageUp,PageDown,Insert,Delete,Control"
//BPO CONFIG //BPO CONFIG
export const IS_RETRIEVE_FROM_BPO = "N" export const IS_RETRIEVE_FROM_BPO = "Y"
// export const BPO_URL = "http://35.171.20.94:8080/bpo-sqa/" // export const BPO_URL = "http://35.171.20.94:8080/bpo-sqa/"
// export const CURRENT_NODE = "Web GDE" // export const CURRENT_NODE = "Web GDE"
export const BPO_URL = DOMAIN + "/bpo/"; export let BPO_URL = DOMAIN + "bpo/";
export const CURRENT_NODE = "Mobile_GDE_DEV" // export const CURRENT_NODE = "Web_GDE_DEV"
export const ENCODING_PASS = "PASS1" export let CURRENT_NODE = ""
export const NEXT_NODE = "Complete" export const ENCODING_PASS = "PASS1"
export const EXCEPTION_NODE = "Exception" export const NEXT_NODE = "Complete"
export const EXCEPTION_NODE = "Exception"
export const SHOW_ELEMENT_LIST_VIEWER = "Y"
export const ADD_NEW_OPTION = "Y"
export const PDF_EXTENSION = ".pdf" export const PDF_EXTENSION = ".pdf"
export const JPG_EXTENSION = ".jpg" export const JPG_EXTENSION = ".jpg"
export const PNG_EXTENSION = ".png" export const PNG_EXTENSION = ".png"
export const REASON_LIST = "Reason1,Reason2,Reason3,Reason4" export const REASON_LIST = "Reason1,Reason2,Reason3,Reason4"
//KEYCLOAK CONFIG //KEYCLOAK CONFIG
window.REDIRECT_URL = 'http://auth-server/auth/realms/GFS/protocol/openid-connect/logout?redirect_uri=encodedRedirectUri'; window.REDIRECT_URL = 'http://auth-server/auth/realms/GFS/protocol/openid-connect/logout?redirect_uri=encodedRedirectUri';
export function initializeConfig(domain, node){
DOMAIN = domain;
CURRENT_NODE = node;
GDE_URL = DOMAIN + "MobileGdeDev/svc/gfs-rest"
FOLDER_URL = DOMAIN + CONTEXTROOT + "/svc/gfs-rest/get-folder?parentPath=/Users/"
DOWNLOAD_URL = DOMAIN + CONTEXTROOT + "/svc/gfs-rest/get-download-link"
BPO_URL = DOMAIN + "bpo/";
}
WebGde/WebContent/WebGde-Widgets/documentControlWidget/documentControlWidget.js
import { createRejectWindow } from '../BPO/rejectElement.js'; import { createRejectWindow } from '../BPO/rejectElement.js';
import { createReturnWindow } from '../BPO/returnElement.js'; import { createReturnWindow } from '../BPO/returnElement.js';
import { goBackToElementListViewer } from '../ElementListWidget/ElementListWidget.js';
import { completeToNextNode, submitForm } from '../Submit/submit.js'; import { completeToNextNode, submitForm } from '../Submit/submit.js';
import { IS_RETRIEVE_FROM_BPO, ROOT_FOLDER } from '../config.js'; import { IS_RETRIEVE_FROM_BPO, ROOT_FOLDER, SHOW_ELEMENT_LIST_VIEWER } from '../config.js';
import { createInfoModal } from '../genericPopup/genericPopup.js'; import { createInfoModal } from '../genericPopup/genericPopup.js';
import { BPO_OBJECT, DISPLAY_FIELD_OBJECT, DOCUMENT_CONTROL_OBJECT, IMAGE_VIEWER_OBJECT, INDEXED_DB_STORAGE } from '../globalVariable.js'; import { BPO_OBJECT, DISPLAY_FIELD_OBJECT, DOCUMENT_CONTROL_OBJECT, IMAGE_VIEWER_OBJECT, INDEXED_DB_STORAGE } from '../globalVariable.js';
export class DocumentControlWidget { export class DocumentControlWidget {
global = { global = {
container: null, container: null,
submitBtn: null, submitBtn: null,
returnBtn: null, returnBtn: null,
rejectBtn: null rejectBtn: null
} }
constructor() { constructor() {
this.init(); this.init();
} }
init() { init() {
this.global.container = document.createElement("div"); this.global.container = document.createElement("div");
this.global.container.id = "TiffButtonRight"; this.global.container.id = "TiffButtonRight";
this.global.container.classList.add("ctrl-buttons") this.global.container.classList.add("ctrl-buttons")
this.global.submitBtn = document.createElement("div"); this.global.submitBtn = document.createElement("div");
this.global.submitBtn.title = "Submit"; this.global.submitBtn.title = "Submit";
this.global.submitBtn.classList.add("buttonRightClass"); this.global.submitBtn.classList.add("buttonRightClass");
const submitIcon = document.createElement("img"); const submitIcon = document.createElement("img");
submitIcon.classList.add("tiffViewerIcons"); submitIcon.classList.add("tiffViewerIcons");
submitIcon.src = "." + ROOT_FOLDER + "/documentControlWidget/assets/submit.png"; submitIcon.src = "." + ROOT_FOLDER + "/documentControlWidget/assets/submit.png";
submitIcon.alt = "Submit"; submitIcon.alt = "Submit";
submitIcon.height = "32"; submitIcon.height = "32";
submitIcon.width = "32"; submitIcon.width = "32";
this.global.returnBtn = document.createElement("div"); this.global.returnBtn = document.createElement("div");
this.global.returnBtn.title = "Return"; this.global.returnBtn.title = "Return";
this.global.returnBtn.classList.add("buttonRightClass"); this.global.returnBtn.classList.add("buttonRightClass");
const returnIcon = document.createElement("img"); const returnIcon = document.createElement("img");
returnIcon.classList.add("tiffViewerIcons"); returnIcon.classList.add("tiffViewerIcons");
returnIcon.src = "." + ROOT_FOLDER + "/documentControlWidget/assets/return_icon.png"; returnIcon.src = "." + ROOT_FOLDER + "/documentControlWidget/assets/return_icon.png";
returnIcon.alt = "Return"; returnIcon.alt = "Return";
returnIcon.height = "32"; returnIcon.height = "32";
returnIcon.width = "32"; returnIcon.width = "32";
this.global.rejectBtn = document.createElement("div"); this.global.rejectBtn = document.createElement("div");
this.global.rejectBtn.title = "Reject"; this.global.rejectBtn.title = "Reject";
this.global.rejectBtn.classList.add("buttonRightClass"); this.global.rejectBtn.classList.add("buttonRightClass");
const rejectIcon = document.createElement("img"); const rejectIcon = document.createElement("img");
rejectIcon.classList.add("tiffViewerIcons"); rejectIcon.classList.add("tiffViewerIcons");
rejectIcon.src = "." + ROOT_FOLDER + "/documentControlWidget/assets/reject_icon.png"; rejectIcon.src = "." + ROOT_FOLDER + "/documentControlWidget/assets/reject_icon.png";
rejectIcon.alt = "Reject"; rejectIcon.alt = "Reject";
rejectIcon.height = "32"; rejectIcon.height = "32";
rejectIcon.width = "32"; rejectIcon.width = "32";
this.global.submitBtn.append(submitIcon); this.global.submitBtn.append(submitIcon);
this.global.returnBtn.append(returnIcon); this.global.returnBtn.append(returnIcon);
this.global.rejectBtn.append(rejectIcon); this.global.rejectBtn.append(rejectIcon);
if(IS_RETRIEVE_FROM_BPO === "Y"){ if (IS_RETRIEVE_FROM_BPO === "Y") {
this.global.container.appendChild(this.global.submitBtn); this.global.container.appendChild(this.global.submitBtn);
this.global.container.appendChild(this.global.returnBtn); this.global.container.appendChild(this.global.returnBtn);
this.global.container.appendChild(this.global.rejectBtn); this.global.container.appendChild(this.global.rejectBtn);
} else { } else {
this.global.container.appendChild(this.global.submitBtn); this.global.container.appendChild(this.global.submitBtn);
} }
this.addEvenListeners(); this.addEvenListeners();
} }
addEvenListeners() { addEvenListeners() {
this.global.submitBtn.onclick = async (e) => { this.global.submitBtn.onclick = async (e) => {
let isSuccessful = await submitForm(e); let isSuccessful = await submitForm(e);
if (isSuccessful) { if (isSuccessful) {
DISPLAY_FIELD_OBJECT.clearForm(); DISPLAY_FIELD_OBJECT.clearForm();
createInfoModal(null, 'ok', 'Form Submitted.');
if (IS_RETRIEVE_FROM_BPO === "Y"){ if (SHOW_ELEMENT_LIST_VIEWER === "Y") {
let response = await completeToNextNode(sessionStorage.getItem("element_id")); console.log("PUMASOK DITO");
} createInfoModal(goBackToElementListViewer, 'ok', 'Form Submitted.');
} } else {
} createInfoModal(null, 'ok', 'Form Submitted.');
}
this.global.returnBtn.onclick = (e) => {
createReturnWindow(); if (IS_RETRIEVE_FROM_BPO === "Y") {
} let response = await completeToNextNode(sessionStorage.getItem("element_id"));
}
this.global.rejectBtn.onclick = (e) => { }
createRejectWindow(); }
}
this.global.returnBtn.onclick = (e) => {
} createReturnWindow();
}
getWidget() {
return this.global.container; this.global.rejectBtn.onclick = (e) => {
} createRejectWindow();
}
getSubmitBtn(){
return this.global.submitBtn; }
}
getWidget() {
getReturnBtn() { return this.global.container;
return this.global.returnBtn; }
}
getSubmitBtn() {
getRejectBtn() { return this.global.submitBtn;
return this.global.rejectBtn; }
}
getReturnBtn() {
return this.global.returnBtn;
}
getRejectBtn() {
return this.global.rejectBtn;
}
} }
WebGde/WebContent/WebGde-Widgets/genericPopup/genericPopup.js
export function createModal(okButtonAction, popupTitleText) { export function createModal(okButtonAction, popupTitleText) {
var okButton = document.createElement("button"); var okButton = document.createElement("button");
okButton.id = "okButton"; okButton.id = "okButton";
okButton.textContent = "OK"; okButton.textContent = "OK";
okButton.style.width = "80px"; okButton.style.width = "80px";
okButton.style.height = "30px"; okButton.style.height = "30px";
okButton.style.marginRight = "10px"; okButton.style.marginRight = "10px";
var cancelButton = document.createElement("button"); var cancelButton = document.createElement("button");
cancelButton.id = "cancelButton"; cancelButton.id = "cancelButton";
cancelButton.textContent = "Cancel"; cancelButton.textContent = "Cancel";
cancelButton.style.width = "80px"; cancelButton.style.width = "80px";
cancelButton.style.height = "30px"; cancelButton.style.height = "30px";
var backdropContainer = document.getElementById("backdropContainer"); var backdropContainer = document.getElementById("backdropContainer");
if (backdropContainer) { if (backdropContainer) {
backdropContainer.remove(); backdropContainer.remove();
} }
backdropContainer = document.createElement("div"); backdropContainer = document.createElement("div");
backdropContainer.id = "backdropContainer"; backdropContainer.id = "backdropContainer";
backdropContainer.style.backgroundColor = "#000000a1"; backdropContainer.style.backgroundColor = "#000000a1";
backdropContainer.style.display = "-webkit-inline-box"; backdropContainer.style.display = "-webkit-inline-box";
backdropContainer.style.width = "100%"; backdropContainer.style.width = "100%";
backdropContainer.style.height = "100%"; backdropContainer.style.height = "100%";
backdropContainer.style.position = "absolute"; backdropContainer.style.position = "absolute";
backdropContainer.style.top = "0"; backdropContainer.style.top = "0";
backdropContainer.style.zIndex = "50"; backdropContainer.style.zIndex = "50";
backdropContainer.style.backdropFilter = "blur(4px)"; backdropContainer.style.backdropFilter = "blur(4px)";
var popupContainer = document.createElement("div"); var popupContainer = document.createElement("div");
popupContainer.id = "popupContainer"; popupContainer.id = "popupContainer";
popupContainer.style.display = "none"; popupContainer.style.display = "none";
popupContainer.style.position = "fixed"; popupContainer.style.position = "fixed";
popupContainer.style.top = "50%"; popupContainer.style.top = "50%";
popupContainer.style.left = "50%"; popupContainer.style.left = "50%";
popupContainer.style.transform = "translate(-50%, -50%)"; popupContainer.style.transform = "translate(-50%, -50%)";
popupContainer.style.border = "1px solid gray"; popupContainer.style.border = "1px solid gray";
popupContainer.style.background = "white"; popupContainer.style.background = "white";
popupContainer.style.padding = "20px"; popupContainer.style.padding = "20px";
popupContainer.style.textAlign = "center"; popupContainer.style.textAlign = "center";
popupContainer.style.zIndex = "999"; popupContainer.style.zIndex = "999";
var popupContent = document.createElement("div"); var popupContent = document.createElement("div");
popupContent.id = "popupContent"; popupContent.id = "popupContent";
var popupTitle = document.createElement("p"); var popupTitle = document.createElement("p");
popupTitle.textContent = popupTitleText; popupTitle.textContent = popupTitleText;
popupContent.appendChild(popupTitle); popupContent.appendChild(popupTitle);
popupContent.appendChild(okButton); popupContent.appendChild(okButton);
popupContent.appendChild(cancelButton); popupContent.appendChild(cancelButton);
popupContainer.appendChild(popupContent); popupContainer.appendChild(popupContent);
backdropContainer.appendChild(popupContainer); backdropContainer.appendChild(popupContainer);
document.body.appendChild(backdropContainer); document.body.appendChild(backdropContainer);
document.getElementById("popupContainer").style.display = "block"; document.getElementById("popupContainer").style.display = "block";
document.getElementById("okButton").addEventListener("click", function () { document.getElementById("okButton").addEventListener("click", function() {
document.getElementById("backdropContainer").style.display = "none"; document.getElementById("backdropContainer").style.display = "none";
if (typeof okButtonAction === "function") { if (typeof okButtonAction === "function") {
okButtonAction(); okButtonAction();
} }
}); });
document.getElementById("cancelButton").addEventListener("click", function () { document.getElementById("cancelButton").addEventListener("click", function() {
document.getElementById("backdropContainer").remove(); document.getElementById("backdropContainer").remove();
}); });
} }
function handleOK() { function handleOK() {
console.log("OK button pressed!"); console.log("OK button pressed!");
} }
/*createModal(handleOK, "Hello World!!!");*/ /*createModal(handleOK, "Hello World!!!");*/
export function createInfoModal(okButtonAction, buttonTxt, popupTitleText) { export function createInfoModal(okButtonAction, buttonTxt, popupTitleText) {
var okButton = document.createElement("button"); var okButton = document.createElement("button");
okButton.id = "okButton"; okButton.id = "okButton";
okButton.textContent = buttonTxt; okButton.textContent = buttonTxt;
okButton.style.width = "80px"; okButton.style.width = "80px";
okButton.style.height = "30px"; okButton.style.height = "30px";
okButton.style.marginRight = "10px"; okButton.style.marginRight = "10px";
// var cancelButton = document.createElement("button"); // var cancelButton = document.createElement("button");
// cancelButton.id = "cancelButton"; // cancelButton.id = "cancelButton";
// cancelButton.textContent = "Cancel"; // cancelButton.textContent = "Cancel";
// cancelButton.style.width = "80px"; // cancelButton.style.width = "80px";
// cancelButton.style.height = "30px"; // cancelButton.style.height = "30px";
var backdropContainer = document.getElementById("backdropContainer"); var backdropContainer = document.getElementById("backdropContainer");
if (backdropContainer) { if (backdropContainer) {
backdropContainer.remove(); backdropContainer.remove();
} }
backdropContainer = document.createElement("div"); backdropContainer = document.createElement("div");
backdropContainer.id = "backdropContainer"; backdropContainer.id = "backdropContainer";
backdropContainer.style.backgroundColor = "#000000a1"; backdropContainer.style.backgroundColor = "#000000a1";
backdropContainer.style.display = "-webkit-inline-box"; backdropContainer.style.display = "-webkit-inline-box";
backdropContainer.style.width = "100%"; backdropContainer.style.width = "100%";
backdropContainer.style.height = "100%"; backdropContainer.style.height = "100%";
backdropContainer.style.position = "absolute"; backdropContainer.style.position = "absolute";
backdropContainer.style.top = "0"; backdropContainer.style.top = "0";
backdropContainer.style.zIndex = "50"; backdropContainer.style.zIndex = "50";
backdropContainer.style.backdropFilter = "blur(4px)"; backdropContainer.style.backdropFilter = "blur(4px)";
var popupContainer = document.createElement("div"); var popupContainer = document.createElement("div");
popupContainer.id = "popupContainer"; popupContainer.id = "popupContainer";
popupContainer.style.display = "none"; popupContainer.style.display = "none";
popupContainer.style.position = "fixed"; popupContainer.style.position = "fixed";
popupContainer.style.top = "50%"; popupContainer.style.top = "50%";
popupContainer.style.left = "50%"; popupContainer.style.left = "50%";
popupContainer.style.transform = "translate(-50%, -50%)"; popupContainer.style.transform = "translate(-50%, -50%)";
popupContainer.style.border = "1px solid gray"; popupContainer.style.border = "1px solid gray";
popupContainer.style.background = "white"; popupContainer.style.background = "white";
popupContainer.style.padding = "20px"; popupContainer.style.padding = "20px";
popupContainer.style.textAlign = "center"; popupContainer.style.textAlign = "center";
popupContainer.style.zIndex = "999"; popupContainer.style.zIndex = "999";
var popupContent = document.createElement("div"); var popupContent = document.createElement("div");
popupContent.id = "popupContent"; popupContent.id = "popupContent";
var popupTitle = document.createElement("p"); var popupTitle = document.createElement("p");
popupTitle.textContent = popupTitleText; popupTitle.textContent = popupTitleText;
popupContent.appendChild(popupTitle); popupContent.appendChild(popupTitle);
popupContent.appendChild(okButton); popupContent.appendChild(okButton);
popupContainer.appendChild(popupContent); popupContainer.appendChild(popupContent);
backdropContainer.appendChild(popupContainer); backdropContainer.appendChild(popupContainer);
document.body.appendChild(backdropContainer); document.body.appendChild(backdropContainer);
document.getElementById("popupContainer").style.display = "block"; document.getElementById("popupContainer").style.display = "block";
document.getElementById("okButton").addEventListener("click", function () { document.getElementById("okButton").addEventListener("click", function() {
document.getElementById("backdropContainer").style.display = "none"; console.log("OK Button clicked!"); // This will let you know the button was clicked
if (typeof okButtonAction === "function") { document.getElementById("backdropContainer").style.display = "none";
okButtonAction(); if (typeof okButtonAction === "function") {
} console.log("YES");
}); okButtonAction();
}
});
} }
\ No newline at end of file
WebGde/WebContent/index.html
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<link rel="stylesheet" href="./WebGde-Widgets/ImageViewerWidget/modules/imageViewer/imageViewer.css"> <link rel="stylesheet" href="./WebGde-Widgets/ImageViewerWidget/modules/imageViewer/imageViewer.css">
<link rel="stylesheet" href="./WebGde-Widgets/ElementListWidget/ElementListWidget.css"> <link rel="stylesheet" href="./WebGde-Widgets/ElementListWidget/ElementListWidget.css">
<link id="loginStylesheet" rel="stylesheet" href="./WebGde-Widgets/LogInWidget/LoginStyle.css"> <link id="loginStylesheet" rel="stylesheet" href="./WebGde-Widgets/LogInWidget/LoginStyle.css">
<script type="module" src="./script.js"></script> <script type="module" src="./startup.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" <script src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" /> <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
......
WebGde/WebContent/script.js
...@@ -6,12 +6,15 @@ import { DocumentControlWidget } from "./WebGde-Widgets/documentControlWidget/do ...@@ -6,12 +6,15 @@ import { DocumentControlWidget } from "./WebGde-Widgets/documentControlWidget/do
import { ElementListWidget } from "./WebGde-Widgets/ElementListWidget/ElementListWidget.js"; import { ElementListWidget } from "./WebGde-Widgets/ElementListWidget/ElementListWidget.js";
// import { DocumentControlWidget } from "./WebGde-Widgets/documentControlWidget/documentControlWidget.js"; // import { DocumentControlWidget } from "./WebGde-Widgets/documentControlWidget/documentControlWidget.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 "./WebGde-Widgets/globalVariable.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 "./WebGde-Widgets/globalVariable.js";
import { SHOW_ELEMENT_LIST_VIEWER, CURRENT_NODE } from "./WebGde-Widgets/config.js";
import { fallbackLogin } from "./WebGde-Widgets/LogInWidget/LoginJavaInterface.js";
document.addEventListener("DOMContentLoaded", function() { document.addEventListener("DOMContentLoaded", function() {
const LOG_IN_COMPONENT = new LogInClass(startApplication); startApplication();
LOG_IN_COMPONENT.establishEventListeners();
}); });
startApplication();
export async function startApplication() { export async function startApplication() {
createLoadingScreen(); createLoadingScreen();
await initializeWebGDE(); await initializeWebGDE();
...@@ -44,24 +47,28 @@ async function initializeWebGDE() { ...@@ -44,24 +47,28 @@ async function initializeWebGDE() {
// UNCOMMENTED BY ADAM 9/25/2023 // UNCOMMENTED BY ADAM 9/25/2023
sessionStorage.setItem("element_id","element1");
<<<<<<< WebGde/WebContent/script.js
/* await createWebGdeInterface(null);*/
setDocumentControlObject(new DocumentControlWidget());
/* document.getElementById("input-field-container").appendChild(DOCUMENT_CONTROL_OBJECT.getWidget());*/
=======
await createWebGdeInterface(null);
setDocumentControlObject(new DocumentControlWidget());
document.getElementById("input-field-container").appendChild(DOCUMENT_CONTROL_OBJECT.getWidget());
>>>>>>> WebGde/WebContent/script.js
var mainLogInScreenContainer = document.getElementById("logInMainContainer"); if (SHOW_ELEMENT_LIST_VIEWER === "Y") {
mainLogInScreenContainer.remove(); setDocumentControlObject(new DocumentControlWidget());
removeLoadingScreen();
var mainLogInScreenContainer = document.getElementById("logInMainContainer");
if(mainLogInScreenContainer){
mainLogInScreenContainer.remove();
}
removeLoadingScreen();
// new ElementListWidget('Web_GDE_DEV', 'containerId'); new ElementListWidget(CURRENT_NODE, 'containerId');
} else {
await createWebGdeInterface(null);
setDocumentControlObject(new DocumentControlWidget());
document.getElementById("input-field-container").appendChild(DOCUMENT_CONTROL_OBJECT.getWidget());
var mainLogInScreenContainer = document.getElementById("logInMainContainer");
if(mainLogInScreenContainer){
mainLogInScreenContainer.remove();
}
removeLoadingScreen();
}
} }
export async function createWebGdeInterface(GDEContainer) { export async function createWebGdeInterface(GDEContainer) {
...@@ -142,21 +149,12 @@ export function removeLoadingScreen() { ...@@ -142,21 +149,12 @@ export function removeLoadingScreen() {
} }
<<<<<<< WebGde/WebContent/script.js
export async function resetGDE() { export async function resetGDE() {
// TO-DO // TO-DO
} }
function init() { function init() {
console.log("Application Started"); console.log("Application Started");
=======
export async function resetGDE(){
// TO-DO
}
function init(){
console.log("Application Started");
>>>>>>> WebGde/WebContent/script.js
} }
......
WebGde/WebContent/startup.js 0 → 100644
import { fallbackLogin, loginGde } from "./WebGde-Widgets/LogInWidget/LoginJavaInterface.js";
const scriptElement = document.createElement("script");
scriptElement.type = "module";
scriptElement.src = "script.js";
document.addEventListener("DOMContentLoaded", function() {
window.fallbackLogin = fallbackLogin;
window.loginGde = loginGde;
// const LOG_IN_COMPONENT = new LogInClass(startApplication);
// LOG_IN_COMPONENT.establishEventListeners();
});
export function initializeWebpage(){
document.head.appendChild(scriptElement);
}
\ No newline at end of file
WebGde/WebContent/style.css
...@@ -290,7 +290,8 @@ input[type=radio] { ...@@ -290,7 +290,8 @@ input[type=radio] {
} }
.image-capture, .image-capture,
.fingerprint-capture { .fingerprint-capture,
.file-upload {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
...@@ -714,7 +715,8 @@ span#filename { ...@@ -714,7 +715,8 @@ span#filename {
} }
.image-capture, .image-capture,
.fingerprint-capture { .fingerprint-capture,
.file-upload {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
...@@ -978,7 +980,7 @@ span#filename { ...@@ -978,7 +980,7 @@ span#filename {
margin: 2px; margin: 2px;
} }
.reject-modal { .reject-modal, .return-modal {
overflow: auto; overflow: auto;
background-color: #fff; background-color: #fff;
position: absolute; position: absolute;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment