Skip to content

W
web-ui
Commit a12024ef by Earvin Paguia
Options

Merge branch 'development-encoding' into 'feature-UI_integration-from-adhoc'

# Conflicts: # WebGde/WebContent/src/captureMetrics/captureMetrics.js # WebGde/WebContent/src/getFields/getFields.js # WebGde/WebContent/src/validateSchema/validateSchema.js
parents a12f99a3 455732f3
Showing with 712 additions and 12 deletions
WebGde/WebContent/config.js
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
// schema with 5 fields and all possible collections // schema with 5 fields and all possible collections
//const SCHEMA_FILE = "./src/sample_schema/5_field_schema.json" //const SCHEMA_FILE = "./src/sample_schema/5_field_schema.json"
var SCHEMA_FILE = "./src/sample_schema/HR Speed Test schema.json" var SCHEMA_FILE = "./src/sample_schema/Speed Test Application Form schema.json"
// const SCHEMA_FILE = "./src/sample_schema/Sample_Schema.json" // const SCHEMA_FILE = "./src/sample_schema/Sample_Schema.json"
......
WebGde/WebContent/src/captureMetrics/captureMetrics.js
<<<<<<< WebGde/WebContent/src/captureMetrics/captureMetrics.js
let global_start_time = 0 let global_start_time = 0
let global_end_time = 0 let global_end_time = 0
let key_strokes = 0 let key_strokes = 0
...@@ -281,4 +282,284 @@ function saveTime(json) { ...@@ -281,4 +282,284 @@ function saveTime(json) {
method: "POST", method: "POST",
body: formData body: formData
}); });
=======
let global_start_time = 0
let global_end_time = 0
let key_strokes = 0
let time_spent = 0
let time_start = 0
let time_pause = 0
let time_pause_spent = 0
let metrics_file_name;
const conflicts = ['F', 'f', 'alphabet', 'alphanumeric']
const shift_shortcuts = ['f', 'F']
const ctrl_shortcuts = ['PageUp', 'PageDown', 'ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', '-', '=']
const ctrl_shift_shortcuts = ['v', 'h', 'V', 'H']
const shortcut_triggers = ['Shift', 'Control']
let shortcut_flag = false
const csv_header = ['record_no', 'filename', 'speed', 'eoe_timestamp', 'avg_speed'];
let temp;
const keyArray = INVALID_KEYS.split(",");
const startMetricCapture = () => {
// reset key strokes
key_strokes = 0
time_start = Date.now()
if (global_start_time == 0) {
global_start_time = new Date().toLocaleString();
}
time_pause_spent = 0
console.log(`Metric Capture Started
Key strokes: ${key_strokes}
Start of encoding time: ${time_start}
Total time spent encoding: ${time_spent}`) // for demonstration purposes
window.onkeyup = (key) => {
const onfocus = document.activeElement
if (shortcut_flag && shortcut_triggers.includes(key.key)) {
if (!key.ctrlKey && !key.shiftKey) { // will disregard key up event on shift or ctrl right after a short cut key combination
console.log('Shortcut trigger lifted') // for demonstration purposes
shortcut_flag = false
}
return
}
if ((key.shiftKey && shift_shortcuts.includes(key.key)) || // shift shortcut
(key.ctrlKey && ctrl_shortcuts.includes(key.key))) { // ctrl shortcut
if (onfocus.nodeName !== 'INPUT' ||
!conflicts.includes(key.key)) { // ignore shortcuts with conflict if triggered inside input field
console.log('Shortcut Triggered') // for demonstration purposes
shortcut_flag = true
return
}
}
if (key.shiftKey && key.ctrlKey && ctrl_shift_shortcuts.includes(key.key)) {
console.log('Shortcut Triggered') // for demonstration purposes
shortcut_flag = true
return
}
if (searchStringInArray(`${key.key}`, keyArray) == true || key.ctrlKey && key.key) {
console.log('key invalid');
} else {
key_strokes++
}
console.log(`key: ${key.key}; key_strokes: ${key_strokes}; time_spent: ${((Date.now() - time_start) / 1000) - time_pause_spent}`) // for demonstration purposes
}
document.getElementById("pause").addEventListener('click',
function() {
pauseMetricCapture();
disableTiffButtons();
}
);
showMetricCapture();
}
function searchStringInArray(str, strArray) {
for (var j = 0; j < strArray.length; j++) {
if (strArray[j] == str) return true;
}
return false;
}
const stopMetricCapture = () => {
const time_end = Date.now()
time_spent = (time_end - time_start) / 1000 // time spend in seconds
const rate = (key_strokes / time_spent) * 3600 // key strokes made per hour
return {
key_strokes,
time_spent,
rate
}
}
let interval = null;
const showMetricCapture = () => {
const obj = document.getElementById("counter");
if (key_strokes != 0) {
let time_spent = ((Date.now() - time_start) / 1000) - time_pause_spent;
let rate = ((key_strokes / time_spent) * 3600).toFixed(0);
rate >= ALLOWED_KPH ? obj.className = "green" : obj.className = "red";
obj.innerHTML = (rate < 0 ? 0 : rate) + " kph"; // immediately apply start value
}
interval = setTimeout(showMetricCapture, 1000);
}
const saveMetrics = async (metrics, eoe_ts) => {
try {
eoe_ts = formatDate(eoe_ts);
let rows = new Array();
if (sessionStorage.getItem('csv') === null) {
rows.push(csv_header);
rows.push([1, escapeCSV(File_Path.replace(/^.*[\\\/]/, '')), metrics.rate, eoe_ts, metrics.rate]);
} else {
rows = JSON.parse(sessionStorage.getItem('csv'));
let size = rows.length - 1;
let last = rows[size];
let avg = last[last.length - 1];
let newAvg = ((avg * size) + metrics.rate) / (size + 1);
rows.push([(size + 1), escapeCSV(File_Path.replace(/^.*[\\\/]/, '')), metrics.rate, eoe_ts, newAvg]);
}
var myFile = new File(
[(rows.map(e => e.join(",")).join("\n"))],
sessionStorage.getItem('user_id') + '_Metrics_' + (new Date()).toISOString().slice(0, 10).replace(/-/g, "") + ".csv",
{ type: "text/plain;charset=utf-8" }
);
let formData = new FormData();
formData.append("file", myFile);
let data = {};
data.metrics_dir = METRIC_FILES;
// sessionStorage.getItem('outputMetricsDir') == null ? data.outputDir = null : data.outputDir = sessionStorage.getItem('outputMetricsDir');
// formData.append("data", JSON.stringify(data));
// const outputMetricsDir = await fetch('./src/captureMetrics/saveMetrics.php', {
// method: "POST",
// body: formData
var myObject = {
"metrics_dir": sessionStorage.getItem("element_file_loc"),
"file_name" : sessionStorage.getItem('user_id') + '_Metrics_' + (new Date()).toISOString().slice(0, 10).replace(/-/g, "") + ".csv",
"metrics_rate" : metrics.rate,
"eoe_ts" : eoe_ts
};
fetch(urlWriteMetrics, {
method: 'POST',
headers: {
'Content-Type':'application/json'
},
body: JSON.stringify(myObject)
});
// sessionStorage.setItem('outputMetricsDir', await outputMetricsDir.text());
// sessionStorage.setItem('csv', JSON.stringify(rows));
} catch (Err) {
console.log("Error: " + Err.description);
}
}
const escapeCSV = (filename) => {
return filename.includes(",") ? '"' + filename + '"' : filename;
}
const pauseMetricCapture = () => {
time_pause = Date.now();
hideImage();
disableForm();
promptPaused();
clearTimeout(interval);
temp = key_strokes;
// unpauseMetricCapture();
// alert("PAUSED");
}
const unpauseMetricCapture = () => {
time_pause_spent += (Date.now() - time_pause) / 1000;
time_pause = 0;
unhideImage();
enableForm();
key_strokes = temp;
showMetricCapture();
}
const hideImage = () => {
var tiffbody = document.getElementById("TiffModalBody");
tiffbody.style.opacity = 0;
}
const unhideImage = () => {
var tiffbody = document.getElementById("TiffModalBody");
tiffbody.style.opacity = 1;
}
function promptPaused() {
var viewer = document.getElementById('viewer');
var promptMain = document.createElement('div');
promptMain.setAttribute("id", "prompt");
promptMain.style.zIndex = 999;
promptMain.style.textAlign = 'center';
promptMain.style.margin = 0 + ' auto';
promptMain.style.position = 'absolute';
promptMain.style.top = '50%';
promptMain.style.left = '50%';
promptMain.style.border = '1px solid gray';
promptMain.style.transform = 'translate(-50%, -50%)';
promptMain.style.backgroundColor = 'gray';
promptMain.style.padding = '10px';
promptMain.style.display = 'block';
var message = document.createElement('p');
message.innerHTML = 'Session Paused';
var okButton = document.createElement('button');
okButton.setAttribute("id", "continue");
okButton.innerHTML = 'continue';
okButton.onclick = function () {
promptMain.style.display = 'none';
unpauseMetricCapture();
enableTiffButtons();
};
promptMain.appendChild(message);
promptMain.appendChild(okButton);
viewer.appendChild(promptMain);
}
function disableForm() {
var pbutton = document.getElementById("pause");
pbutton.disabled = true;
var form = document.getElementById("fields");
var elements = form.elements;
for (var i = 0, len = elements.length; i < len; ++i) {
elements[i].disabled = true;
// elements[i].style.backgroundColor = "gray";
}
}
function enableForm() {
var pbutton = document.getElementById("pause");
pbutton.disabled = false;
var form = document.getElementById("fields");
var elements = form.elements;
for (var i = 0, len = elements.length; i < len; ++i) {
elements[i].disabled = false;
// elements[i].style.backgroundColor = "white";
}
}
const formatDate = (date) => {
return date.replace(",", "");
}
function saveTime(json) {
let formData = new FormData();
formData.append("data", JSON.stringify(json));
fetch('./src/captureMetrics/saveGlobalTime.php', {
method: "POST",
body: formData
});
>>>>>>> WebGde/WebContent/src/captureMetrics/captureMetrics.js
} }
\ No newline at end of file
WebGde/WebContent/src/sample_schema/Speed Test Application Form schema.json 0 → 100644
{
"APPLICATION FORM":
{
"SECTION1":
{
"Date":
{
"fieldLabel": "Date",
"aka": "field2",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*_={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Position Applied For":
{
"fieldLabel": "Pos Applied For",
"aka": "field3",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Surname":
{
"fieldLabel": "Surname",
"aka": "field4",
"validation":
{
"fieldLength": 50,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"First Name":
{
"fieldLabel": "First Name",
"aka": "field5",
"validation":
{
"fieldLength": 50,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Middle Name":
{
"fieldLabel": "Mid Name",
"aka": "field6",
"validation":
{
"fieldLength": 50,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Mother's Maiden Name":
{
"fieldLabel": "Mother's Maiden Name",
"aka": "field7",
"validation":
{
"fieldLength": 100,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Nickname":
{
"fieldLabel": "Nickname",
"aka": "field8",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Email Address":
{
"fieldLabel": "Email",
"aka": "field9",
"validation":
{
"fieldLength": 50,
"collection": "alphanumeric",
"mandatory": true
}
},
"Mobile Number":
{
"fieldLabel": "Mobile No.",
"aka": "field10",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Telephone Number":
{
"fieldLabel": "Tel. No.",
"aka": "field11",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": false
}
},
"Present Address House No":
{
"fieldLabel": "Pres Add House No",
"aka": "field13",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Present Address Street":
{
"fieldLabel": "Pres Add Street",
"aka": "field14",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"mandatory": true
}
},
"Present Address Village/Subd":
{
"fieldLabel": "Pres Add Vill/Subd",
"aka": "field15",
"validation":
{
"fieldLength": 50,
"collection": "alphanumeric",
"invalidchar": "`~!@&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Present Address Municipality/City/Province":
{
"fieldLabel": "Pres Add Mun/City/Prov",
"aka": "field16",
"validation":
{
"fieldLength": 60,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Years of Stay":
{
"fieldLabel": "Yrs of Stay",
"aka": "field17",
"validation":
{
"fieldLength": 3,
"collection": "numeric",
"mandatory": true
}
},
"Provincial Address House No":
{
"fieldLabel": "Prov Add House No",
"aka": "field19",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Provincial Address Street":
{
"fieldLabel": "Prov Add Street",
"aka": "field20",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"mandatory": true
}
},
"Provincial Address Village/Subd":
{
"fieldLabel": "Prov Add Vill/Subd",
"aka": "field21",
"validation":
{
"fieldLength": 50,
"collection": "alphanumeric",
"invalidchar": "`~!@&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Provincial Address Municipality/City/Province":
{
"fieldLabel": "Prov Add Mun/City/Prov",
"aka": "field22",
"validation":
{
"fieldLength": 60,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Religion":
{
"fieldLabel": "Religion",
"aka": "field23",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Place of Birth":
{
"fieldLabel": "Place of Birth",
"aka": "field24",
"validation":
{
"fieldLength": 50,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Date of Birth":
{
"fieldLabel": "Date of Birth",
"aka": "field25",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Age":
{
"fieldLabel": "Age",
"aka": "field26",
"validation":
{
"fieldLength": 3,
"collection": "numeric",
"mandatory": true
}
},
"Gender":
{
"fieldLabel": "Gender",
"aka": "field27",
"validation":
{
"fieldLength": 10,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Civil Status":
{
"fieldLabel": "Civil Status",
"aka": "field28",
"validation":
{
"fieldLength": 10,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Nationality":
{
"fieldLabel": "Nationality",
"aka": "field29",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"SSS Number":
{
"fieldLabel": "SSS No",
"aka": "field30",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": false
}
},
"TIN":
{
"fieldLabel": "TIN",
"aka": "field31",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": false
}
},
"Commmunity Tax Number":
{
"fieldLabel": "Comm Tax No",
"aka": "field32",
"validation":
{
"fieldLength": 20,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": false
}
},
"Place of Issue":
{
"fieldLabel": "Place of Issue",
"aka": "field33",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": false
}
},
"Date of Issue":
{
"fieldLabel": "Date of Issue",
"aka": "field34",
"validation":
{
"fieldLength": 25,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": false
}
},
"Height":
{
"fieldLabel": "Height",
"aka": "field35",
"validation":
{
"fieldLength": 10,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Weight":
{
"fieldLabel": "Weight",
"aka": "field36",
"validation":
{
"fieldLength": 10,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Spoken Languages":
{
"fieldLabel": "Spoken Languages",
"aka": "field38",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
},
"Written Languages":
{
"fieldLabel": "Written Languages",
"aka": "field39",
"validation":
{
"fieldLength": 30,
"collection": "alphanumeric",
"invalidchar": "`~!@#&$%^*={}[]:;/\"|\\<>",
"mandatory": true
}
}
}
}
}
WebGde/WebContent/src/validateInput/validateInput.js
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
* errors - list of errors found during validation * errors - list of errors found during validation
*/ */
// const validateInput = (fieldName, value, schema) => { // const validateInput = (fieldName, value, schema) => {
const validateInput = (fieldID, value, section) => { const validateInput = (fieldID, value) => {
try { try {
const { valid, error } = validateSchema() const { valid, error } = validateSchema()
...@@ -66,17 +66,10 @@ const validateInput = (fieldID, value, section) => { ...@@ -66,17 +66,10 @@ const validateInput = (fieldID, value, section) => {
const getValidation = (fieldID) => { const getValidation = (fieldID) => {
// const { SECTION } = schema // const { SECTION } = schema
const { ACCOUNTING_DOCUMENTS } = schema let section = schema[sessionStorage.getItem("currentDoctype")][sessionStorage.getItem("currentSection")];
const { SECTION1 } = ACCOUNTING_DOCUMENTS
const { BANK_APPLICATION_FORMS } = schema
const { SECTION2 } = BANK_APPLICATION_FORMS
const { HR_FILES } = schema
const { SECTION3 } = HR_FILES
try{ try{
if (Object.keys(SECTION1).includes(fieldID)) return SECTION1[fieldID].validation; if (Object.keys(section).includes(fieldID)) return section[fieldID].validation;
if (Object.keys(SECTION2).includes(fieldID)) return SECTION2[fieldID].validation;
if (Object.keys(SECTION3).includes(fieldID)) return SECTION3[fieldID].validation;
return null; return null;
} catch(err) { } catch(err) {
......
WebGde/WebContent/src/validateSchema/validateSchema.js
const validateSchema = () => { const validateSchema = () => {
const { ACCOUNTING_DOCUMENTS } = schema const validate = schema[sessionStorage.getItem("currentDoctype")]
if(!ACCOUNTING_DOCUMENTS) return { valid: false, error: 'SECTION is missing!' } if(!ACCOUNTING_DOCUMENTS) return { valid: false, error: 'SECTION is missing!' }
return { valid: true } return { valid: true }
......
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