Skip to content

W
web-ui
Commit 43a4b5c9 by Owen Ryan Ang
Options

Image capture implementation changes

parent c326f97f
Showing with 304 additions and 45 deletions
WebGde/WebContent/WebGde-Widgets/DataInputWidget/AndroidInterface/androidInterface.js
......@@ -10,4 +10,8 @@ export function selfieCapture(key) {
export function fingerprintCapture(key){
window.ScannerInterface.scannerTest(key);
}
export async function getLocation(){
await window.LocationHandlerInterface.setupLocation();
}
\ No newline at end of file
WebGde/WebContent/WebGde-Widgets/DataInputWidget/FingerprintCapture/captureFingerprint.js
......@@ -20,6 +20,8 @@ export function processFingerprint(key, filename) {
form.appendChild(hiddenFileContentInput);
img.style.display = 'inline';
img.style.width = '100%'; // Set maximum width to 100% of the container
img.style.height = '100%'; // Set maximum height to a specific value (adjust as needed)
thumb.style.display = 'none';
filenameElement.textContent = filenameString;
......@@ -36,6 +38,7 @@ export function processFingerprint(key, filename) {
x.style.position = 'absolute';
document.getElementById(`${key}_x`).addEventListener('click', () => {
img.style.display = 'none';
img.src = '';
thumb.style.display = 'none';
x.style.display = 'none';
filenameElement.style.display = 'none';
......
WebGde/WebContent/WebGde-Widgets/DataInputWidget/ImageCapture/captureImage.js
export function processCapture(key) {
export function processCapture(key, imgFilename) {
const form = document.getElementById('fields');
const img = document.getElementById(`${key}_zz`);
const thumb = document.getElementById(`${key}_thumbnail`);
const filename = document.getElementById(`${key}_fname`);
const x = document.getElementById(`${key}_x`);
const filenameString = generateMediaFileName(sessionStorage.getItem('user_id'));;
// const filenameString = generateMediaFileName(sessionStorage.getItem('user_id'));
const filenameString = imgFilename;
// Create hidden inputs for fname and file content
const hiddenFnameInput = document.createElement('input');
......@@ -20,6 +21,8 @@ export function processCapture(key) {
form.appendChild(hiddenFileContentInput);
img.style.display = 'inline';
img.style.width = '100%'; // Set maximum width to 100% of the container
img.style.height = '100%'; // Set maximum height to a specific value (adjust as needed)
thumb.style.display = 'none';
filename.textContent = filenameString;
......@@ -36,6 +39,7 @@ export function processCapture(key) {
x.style.position = 'absolute';
document.getElementById(`${key}_x`).addEventListener('click', () => {
img.style.display = 'none';
img.src = '';
thumb.style.display = 'none';
x.style.display = 'none';
filename.style.display = 'none';
......
WebGde/WebContent/WebGde-Widgets/DataInputWidget/ImageCapture/validateImage.js 0 → 100644
import { schema } from "../generateFields.js";
export const validateImage = (fieldID) => {
}
export const getValidation = (fieldID) => {
// const { SECTION } = schema
let section = schema[sessionStorage.getItem("currentDoctype").replaceAll("_"," ")][sessionStorage.getItem("currentSection").replaceAll("_"," ")];
try{
if (Object.keys(section).includes(fieldID)) return section[fieldID].validation;
return null;
} catch(err) {
return null
}
}
\ No newline at end of file
WebGde/WebContent/WebGde-Widgets/DataInputWidget/config.js
//Data Input Field Config
export var SCHEMA_FILE_PATH = "./WebGde-Widgets/sample_schema/demo_schema.json";
export var SCHEMA_FILE_PATH = "./WebGde-Widgets/sample_schema/08-30-test.json";
// export var SCHEMA_FILE_PATH = "./WebGde-Widgets/sample_schema/HR Speed Test schema.json";
//DBLookup Webservice URL
export var DB_URL = "http://localhost:8080/WebGde/svc/gfs-rest/db-lookup"
\ No newline at end of file
WebGde/WebContent/WebGde-Widgets/DataInputWidget/style.css
......@@ -102,7 +102,7 @@ option {
background-color: yellow;
}
.image-capture {
.image-capture, .fingerprint-capture {
display: flex;
flex-direction: column;
width: 100%;
......
WebGde/WebContent/WebGde-Widgets/DataInputWidget/validateInput.js
......@@ -61,6 +61,7 @@ const validateEmail = (validation, value) => {
const PATTERN_EMAIL = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
let errors = []
const { mandatory, fieldLength } = validation
if(!mandatory && value.length===0) return { valid: true, errors: ['Field is empty'] }
if(mandatory && (value.length===0 || !value.match(/\S/g))) return { valid: false, errors: ['Field is empty'] }
if(fieldLength && value.length>fieldLength) errors = [...errors, 'Input exceed maximum characters']
if(!value.match(PATTERN_EMAIL)) errors = [...errors, 'Contain invalid character/s']
......
WebGde/WebContent/WebGde-Widgets/Submit/XMLWriter/XML_Saver.js
......@@ -16,7 +16,7 @@ export async function WriteForm(e,metrics,doctype,section) {
let fields = {};
for (var i=0;i<Nodes.length;i++) {
if (Nodes[i].style.display === 'none') continue
if (Nodes[i].style.display === 'none' && !Nodes[i].classList.contains('hidden')) continue
let fid = Nodes[i].id;
if (fid == 'DocType' || fid == 'Section' || fid == '' || fid == "submitButton") continue
// Skip the textbox in checklist and radiolist
......
WebGde/WebContent/WebGde-Widgets/Submit/submit.js
......@@ -7,7 +7,7 @@ import { createInfoModal } from "../genericPopup/genericPopup.js";
import { Settings } from "./XMLWriter/Global.js";
import { urlGetFile } from "./XMLWriter/WebServices.js";
import { WriteForm } from "./XMLWriter/XML_Saver.js";
import { PROJECT_CODE, TEMPORARY_FOLDER } from "./config.js";
import { GFS_ROOT_FOLDER, GFS_URL, PROJECT_CODE, TEMPORARY_FOLDER } from "./config.js";
export const submitForm = async (e) => {
try {
......@@ -21,11 +21,15 @@ export const submitForm = async (e) => {
// Validate all elements again
for (let element of elements) {
if (element.style.display === 'none') continue
if (element.style.display === 'none' || element.classList.contains('hidden')) {
continue;
}
const { id, value, type, name } = element
// Skip submit, buttons, and files
if (id === 'dependentTB' ) continue;
if(id == 'Geo_Tag' || id === 'Altitude' || id === 'Direction') continue
if (element.classList.contains('geotag') || element.classList.contains('altitude') || element.classList.contains('direction')) {
continue;
}
if (type === 'button') continue
if (type === 'submit') continue
if (type === 'file') continue
......@@ -81,7 +85,7 @@ export const submitForm = async (e) => {
if (error) {
if (errorMsg !== null) {
createInfoModal(null, 'OK', 'errorMsg');
createInfoModal(null, 'OK', errorMsg);
} else {
createInfoModal(null, 'OK', 'Invalid or Missing data on highlighted fields!');
}
......@@ -107,7 +111,7 @@ export const submitForm = async (e) => {
// await uploadTOGFS(await getFile.text(), sessionStorage.getItem("recentlySavedFileName"));
}
saveForm(sessionStorage.getItem("display_counter"));
// saveForm(sessionStorage.getItem("display_counter"));
}
return true
} catch (err) {
......@@ -159,3 +163,71 @@ export async function batchUpload(Form){
}
}
async function uploadTOGFS(stream, filename){
await checkIfFolderExists(GFS_ROOT_FOLDER+"/"+sessionStorage.getItem("user_id"), "uploads");
await checkIfFolderExists(GFS_ROOT_FOLDER+"/"+sessionStorage.getItem("user_id")+"/uploads", PROJECT_CODE);
let xml = new File([stream], filename, {type: "text/plain"});
let formData = new FormData();
formData.append("file", xml);
formData.append("parentPath", GFS_ROOT_FOLDER+"/"+sessionStorage.getItem("user_id")+ "/uploads/"+PROJECT_CODE);
formData.append("extraData", "{}");
// formData.append("remarks", "Non-BPO Upload");
// formData.append("description", "");
formData.append("isSudo", false);
// formData.append("inheritFolderMetadata", "");
// formData.append("hash", "");
// formData.append("isSigned", "");
let response = await fetch(GFS_URL + "add-file", {
method: "PUT",
headers: {
'Authorization': sessionStorage.getItem("token"),
//'Authorization': token,
'Accept-Encoding': "gzip, deflate, utf-8",
'Accept': "*/*"
},
body: formData
});
console.log(response);
}
async function checkIfFolderExists(parentPath, folderName ){
let url = GFS_URL + "check-folder?" + new URLSearchParams({folderPath: parentPath+"/"+folderName , isSudo: false });
let response = await fetch(url, {
method: "GET",
headers: {
'Authorization': sessionStorage.getItem("token"),
},
});
let result = await response.json;
if(result !== null && result.isExists === false){
let createObj = {
"folderName": folderName,
"parentPath": parentPath,
"extraData": "{}",
"isSudo": false,
// "remarks": "Non-BPO Upload",
// "description": "",
// "inheritFolderMetadata":"",
// "hash":"",
// "isSigned": ""
}
await createGFSFolder(createObj);
}
}
async function createGFSFolder(jsonObj){
let response = await fetch(GFS_URL + "add-folder", {
method: "PUT",
headers: {
'Authorization': sessionStorage.getItem("token"),
},
body: jsonObj
});
}
WebGde/WebContent/WebGde-Widgets/config.js
/**
* for testing purposes, below are different files to be used showing
* some possible configurations of the file
*/
// schema with no "SECTION" key
// const SCHEMA_FILE = "./src/sample_schema/no_section.json"
// schema with missing fields (fieldLabel, validation)
// const SCHEMA_FILE = "./src/sample_schema/missing_fields.json"
// schema with 20 fields
// const SCHEMA_FILE = "./src/sample_schema/20_field_schema.json"
// schema with 15 fields
// const SCHEMA_FILE = "./src/sample_schema/15_field_schema.json"
// schema with 10 fields
// const SCHEMA_FILE = "./src/sample_schema/10_field_schema.json"
// schema with 5 fields and all possible collections
//const SCHEMA_FILE = "./src/sample_schema/5_field_schema.json"
/*export const SCHEMA_FILE = "./src/sample_schema/SC Schema.json"*/
export const SCHEMA_FILE = "./src/sample_schema/HR Speed Test schema.json"
//const INPUT_FILES = ["./input/Ong, Mae Janica - Application Form.TIFF","./input/Magalona, Rowell James - Application Form.TIFF","./input/Felizardo, Brylle Theodure - Application Form.TIFF","./input/Laxamana, Conrad John - Application Form.TIFF"] // list of URLs
export const INPUT_FOLDER = "./input/"
export const OUTPUT_FILES = "../../output/"
......@@ -38,7 +10,7 @@ export const HIGH_LIGHT_SCHEMA = "./WebGde-Widgets/sample_schema/dbSchema_anno.
export const ROOT_FOLDER = "/WebGde-Widgets";
//this determines if the images will be retrieved from the gfs
export const DOMAIN = "http://18.204.18.121:8080"
export const DOMAIN = "http://54.157.29.8:8080"
export const CONTEXTROOT = "gfs-explorer-ws"
export const GDE_URL = DOMAIN + "/MobileGde/svc/gfs-rest"
export const FOLDER_URL = DOMAIN + "/" + CONTEXTROOT + "/svc/gfs-rest/get-folder?parentPath=/Users/"
......@@ -63,7 +35,5 @@ export const PNG_EXTENSION = ".png"
export const REASON_LIST = "Reason1,Reason2,Reason3,Reason4"
//KEYCLOAK CONFIG
window.REDIRECT_URL = 'http://auth-server/auth/realms/GFS/protocol/openid-connect/logout?redirect_uri=encodedRedirectUri';
WebGde/WebContent/WebGde-Widgets/documentControlWidget/documentControlWidget.js
import { submitForm } from '../Submit/submit.js';
import { ROOT_FOLDER } from '../config.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';
export class DocumentControlWidget {
......@@ -43,6 +44,7 @@ export class DocumentControlWidget {
if (isSuccessful) {
DISPLAY_FIELD_OBJECT.clearForm();
createInfoModal(null, 'ok', 'Form Submitted.');
}
}
......
WebGde/WebContent/WebGde-Widgets/genericPopup/genericPopup.js
......@@ -45,7 +45,7 @@ export function createModal(okButtonAction, popupTitleText) {
var popupContent = document.createElement("div");
popupContent.id = "popupContent";
var popupTitle = document.createElement("h2");
var popupTitle = document.createElement("p");
popupTitle.textContent = popupTitleText;
popupContent.appendChild(popupTitle);
popupContent.appendChild(okButton);
......@@ -118,7 +118,7 @@ export function createInfoModal(okButtonAction, buttonTxt, popupTitleText) {
var popupContent = document.createElement("div");
popupContent.id = "popupContent";
var popupTitle = document.createElement("h2");
var popupTitle = document.createElement("p");
popupTitle.textContent = popupTitleText;
popupContent.appendChild(popupTitle);
popupContent.appendChild(okButton);
......
WebGde/WebContent/WebGde-Widgets/sample_schema/08-30-test.json 0 → 100644
{
"SAMPLE FIELDS": {
"Doctype 1": {
"Image1":{
"fieldLabel": "Image1",
"aka": "field5",
"validation": {
"collection": "image-capture",
"mandatory": false
}
},
"Checkbox_List": {
"fieldLabel": "Checkbox List",
"aka": "field16",
"source": "s",
"validation": {
"collection": "checklist",
"items": [
"sample-item1",
"sample-item2",
"sample-item3",
"sample-item4",
"sample-item5"
],
"mandatory": false
}
},
"Radio_List": {
"fieldLabel": "Radio List",
"aka": "field4",
"source": "s",
"validation": {
"collection": "radiolist",
"items": [
"sample-item1",
"sample-item2",
"sample-item3",
"sample-item4",
"sample-item5"
],
"mandatory": false
}
},
"Time": {
"fieldLabel": "Time",
"aka": "field5",
"validation": {
"collection": "timepicker",
"mandatory": false
}
},
"Geo_Tag": {
"fieldLabel": "Geo Tag",
"aka": "field40",
"validation": {
"fieldLength": 100,
"collection": "geotag"
},
"hidden":"y"
},
"Altitude": {
"fieldLabel": "Altitude",
"aka": "field6",
"validation": {
"fieldLength": 100,
"collection": "altitude"
},
"hidden":"y"
},
"Direction": {
"fieldLabel": "Direction",
"aka": "field70",
"validation": {
"fieldLength": 100,
"collection": "direction"
},
"hidden":"y"
}
}
}
}
\ No newline at end of file
WebGde/WebContent/WebGde-Widgets/sample_schema/fingerprint.json 0 → 100644
{
"FINGERPRINT": {
"LEFT HAND": {
"Image1":{
"fieldLabel": "Image1",
"aka": "field20",
"validation": {
"collection": "image-capture",
"mandatory": false
}
},
"Left Little": {
"fieldLabel": "Left Little",
"aka": "field1",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
},
"Left Ring": {
"fieldLabel": "Left Ring",
"aka": "field2",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
},
"Left Middle": {
"fieldLabel": "Left Middle",
"aka": "field3",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
},
"Left Index": {
"fieldLabel": "Left Index",
"aka": "field4",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
},
"Left Thumb": {
"fieldLabel": "Left Thumb",
"aka": "field5",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
}
},
"RIGHT HAND": {
"Right Little": {
"fieldLabel": "Right Little",
"aka": "field6",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
},
"Right Ring": {
"fieldLabel": "Right Ring",
"aka": "field7",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
},
"Right Middle": {
"fieldLabel": "Right Middle",
"aka": "field8",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
},
"Right Index": {
"fieldLabel": "Right Index",
"aka": "field9",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
},
"Right Thumb": {
"fieldLabel": "Right Thumb",
"aka": "field10",
"validation": {
"collection": "fingerprint",
"mandatory": false
}
}
}
}
}
WebGde/WebContent/style.css
......@@ -289,7 +289,7 @@ input[type=radio] {
display: none;
}
.image-capture {
.image-capture, .fingerprint-capture {
display: flex;
flex-direction: column;
width: 100%;
......@@ -408,6 +408,7 @@ select {
}
textarea {
width: 100%;
resize: none;
}
......@@ -695,7 +696,7 @@ span#filename {
background-color: yellow;
}
.image-capture {
.image-capture, .fingerprint-capture {
display: flex;
flex-direction: column;
width: 100%;
......
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