Commit d76941cc by Jorem Magcawas

apply pdf viewer

parent 275b82d2
......@@ -26,7 +26,23 @@
<classpathentry kind="con" path="org.eclipse.m2e.MAVEN2_CLASSPATH_CONTAINER">
<attributes>
<attribute name="maven.pomderived" value="true"/>
<attribute name="org.eclipse.jst.component.dependency" value="/WEB-INF/lib"/>
</attributes>
</classpathentry>
<classpathentry kind="src" path="target/generated-sources/annotations">
<attributes>
<attribute name="optional" value="true"/>
<attribute name="maven.pomderived" value="true"/>
<attribute name="ignore_optional_problems" value="true"/>
<attribute name="m2e-apt" value="true"/>
</attributes>
</classpathentry>
<classpathentry kind="src" output="target/test-classes" path="target/generated-test-sources/test-annotations">
<attributes>
<attribute name="optional" value="true"/>
<attribute name="maven.pomderived" value="true"/>
<attribute name="ignore_optional_problems" value="true"/>
<attribute name="m2e-apt" value="true"/>
<attribute name="test" value="true"/>
</attributes>
</classpathentry>
<classpathentry kind="output" path="target/classes"/>
......
......@@ -54,6 +54,8 @@ var ENCODING_PASS = "PASS1"
var NEXT_NODE = "Complete"
var EXCEPTION_NODE = "Exception"
var PDF_EXTENSION = ".pdf"
var REASON_LIST = "Reason1,Reason2,Reason3,Reason4"
//KEYCLOAK CONFIG
......
......@@ -153,6 +153,18 @@
</div>
<div id="TiffModalBody">
<button id = "prev-button">prev</button>
<button id = "next-button">next</button>
<button id="fit-content">Fit-Content</button>
<button id="rotate-right">Rotate Right</button>
<button id="rotate-left">Rotate Left</button>
<button id="zoom-in">Zoom In</button>
<button id="zoom-out">Zoom Out</button>
<button id="flip-vertical">Flip Vertical</button>
<button id="flip-horizontal">Flip Horizontal</button>
<div id="page-info"></div>
<div id="zoom-info"></div>
<div id="pdf-container"></div>
</div>
<div >
......@@ -210,7 +222,7 @@
<script src="./src/validateInput/validateInput.js"></script> <!-- functions for validating inputs -->
<script src="./src/getFields/getFields.js"></script> <!-- display the input fields -->
<script src="./src/accessFile/accessFile.js"></script>
<script src="./src/pdfviewer/pdfv.js"></script>
<script>
const TiffViewer_refresh = document.getElementById("refresh");
......@@ -281,6 +293,14 @@ const rejectIcon = document.createElement("img");
fieldForm.querySelector('input[type="submit"]').click()
}
})
document.addEventListener("keydown", (e) => {
if (e.shiftKey && e.key === "Enter") {
e.preventDefault();
const fieldForm = document.getElementById("fields");
fieldForm.querySelector('input[type="submit"]').click()
}
})
......
......@@ -13,8 +13,8 @@ async function initGetElement() {
const xmlString = await [...xml.data].join('').replace('\t', '');
const lastImage = getXmlLastImage(xmlString);
sessionStorage.setItem('section', getXmlSection(xmlString));
sessionStorage.setItem('doctype', getXmlDocType(xmlString));
/*sessionStorage.setItem('section', getXmlSection(xmlString));
sessionStorage.setItem('doctype', getXmlDocType(xmlString));*/
let dir = await lst.data;
dir = [...dir];
......@@ -198,8 +198,13 @@ async function getFieldData(){
body: JSON.stringify(xmlData)
});
let json = await response.json();
return json;
if (response.status == 200) {
let json = await response.json();
return json;
} else {
return null;
}
}
......
......@@ -2,7 +2,7 @@ async function returnElementBPO(elementId) {
let response = await fetch(getUrlReturnElement(elementId), {method: "POST"});
if (response.status == 200) {
returnSaveXML();
/*returnSaveXML();*/
const indexedDB =
window.indexedDB ||
window.mozIndexedDB ||
......
......@@ -154,8 +154,10 @@ async function accessFile() {
const imageIndex = store.index("image_address");
if(img!=null){
var filename = gfsFileName != null ? gfsFileName : get_file_name(img);
var filename = gfsFileName != null ? gfsFileName : get_file_name(img);
}
var count = store.count();
let totalImages = JSON.parse(sessionStorage.getItem("dir_files")).length;
......@@ -164,7 +166,13 @@ async function accessFile() {
store.put({ id: count.result + 1, address: blob , name:filename, path:img});
url = URL.createObjectURL(blob);
window.addEventListener("load", loadDoc(url, TIFFViewer,filename), false);
if (filename.endsWith(PDF_EXTENSION)) {
displayPdf(img);
} else {
console.log("This is not a pdf file");
window.addEventListener("load", loadDoc(url, TIFFViewer,filename), false);
}
localStorage.setItem("display_counter", 1);
size = size + total;
File_Name = filename;
......@@ -197,14 +205,12 @@ async function accessFile() {
if (localStorage.getItem("prev") == 1) {
localStorage.setItem("prev", "0");
document.getElementById('next').removeAttribute('disabled');
populateFields();
//populateForm(parseInt(localStorage.getItem("sfIndex")));
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) + 1);
} else {
document.getElementById('next').setAttribute('disabled', 'true');
localStorage.setItem("sfIndex", parseInt(localStorage.getItem("sfIndex")) + 1);
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) + 1);
populateFields();
/*var formArray = JSON.parse(sessionStorage.getItem('formArray'));
if (typeof formArray[parseInt(localStorage.getItem("sfIndex")) - 1] !== 'undefined') {
populateForm(parseInt(localStorage.getItem("sfIndex")));
......@@ -237,14 +243,12 @@ async function accessFile() {
document.getElementById('next').removeAttribute('disabled');
// url = URL.createObjectURL(idQuery.result.address);
// window.addEventListener("load", loadDoc(url, TIFFViewer,idQuery.result.name), false);
document.getElementById('prev').removeAttribute('disabled');
File_Name = idQuery.result.name;
File_Path = idQuery.result.path;
populateFields();
localStorage.setItem("submit", "0");
if(localStorage.getItem("prev") == 1){
localStorage.setItem("prev", "0");
populateFields();
//populateForm(parseInt(localStorage.getItem("sfIndex")));
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) + 1); //update how many have been fetched
} else {
......@@ -258,7 +262,6 @@ async function accessFile() {
if(typeof formArray[parseInt(localStorage.getItem("sfIndex")) - 1] !== 'undefined') {
populateForm(parseInt(localStorage.getItem("sfIndex")));
}*/
populateFields();
}
if(parseInt(localStorage.getItem("sfIndex"))<=1){
document.getElementById('prev').setAttribute('disabled','true');
......@@ -290,7 +293,7 @@ async function accessFile() {
if(IS_RETRIEVE_FROM_GFS == "Y"){
const modal = document.getElementById("TiffViewerModal");
modal.style.display = 'none';//hide local modal\
getFolder(FOLDER_URL+sessionStorage.getItem('user_id')+'/element2');
getFolder(FOLDER_URL+sessionStorage.getItem('user_id')+'/element7');
}else{
if((localStorage.length)==0){
if(updated_input_files.length==0){
......@@ -523,7 +526,12 @@ function refreshImage() {
idQuery.onsuccess = function () {
url = URL.createObjectURL(idQuery.result.address);
window.addEventListener("load", loadDoc(url, TIFFViewer,idQuery.result.name), false);
if (idQuery.result.name.endsWith(PDF_EXTENSION)) {
displayPdf(idQuery.result.path);
} else {
console.log("This is not a pdf file");
window.addEventListener("load", loadDoc(url, TIFFViewer,idQuery.result.name), false);
}
File_Name = idQuery.result.name;
File_Path = idQuery.result.path;
};
......
......@@ -67,7 +67,7 @@ function createEndSessionWindow() {
let returnElem = await returnElementLogout(sessionStorage.getItem("element_id"));
if (returnElem == 200) {
returnSaveXML();
/*returnSaveXML();*/
endWindow.style.display = 'none';
localStorage.clear();
sessionStorage.clear();
......
......@@ -91,14 +91,24 @@ const displayFields = async (parentID) => {
}
let underscoredSection = section.replaceAll(" ", "_");
sessionStorage.setItem("currentSection", underscoredSection);
createDocTypeDropdown('DocType', div, schema);
createSection('Section', div, doctypes, underscoredDoctype);
createDocTypeDropdown('DocType', div, schema, doctype);
createSection('Section', div, doctypes, underscoredDoctype, section);
div = deconstruct(doctypes[section], div, underscoredSection)
const submit = document.createElement('input')
submit.classList.add("submitButtons");
submit.classList.add(underscoredSection);
submit.type = 'submit'
div.appendChild(submit)
for (let [k,v] of Object.entries(JSON.parse(sessionStorage.getItem("fields")))) {
for(let key of Object.keys(schema[doctype][section])) {
if(schema[doctype][section][key].aka == k) {
var fieldId = schema[doctype][section][key].fieldLabel;
var currId = fieldId.replace(" ", "_")
document.getElementById(currId).value = v;
}
}
}
}
$(document.body).on("change","#DocType",function(){
......@@ -646,7 +656,7 @@ const deconstruct = (section, div, classAttribute) => {
* @returns
* div with the deconsctructed section
*/
const createDocTypeDropdown = (fieldLabel, div, schema) => {
const createDocTypeDropdown = (fieldLabel, div, schema, doc) => {
try {
const newField = document.createElement('div') // will contain input field and label
......@@ -675,6 +685,9 @@ const createDocTypeDropdown = (fieldLabel, div, schema) => {
newOption = document.createElement("option")
newOption.text = doctype
newOption.value = doctype
if (doctype == doc) {
newOption.selected = 'selected'
}
docTypeDropDown.add(newOption)
}
......@@ -694,7 +707,7 @@ const createDocTypeDropdown = (fieldLabel, div, schema) => {
* @returns
* div with the deconsctructed section
*/
const createSection = (fieldLabel, div, doctype, section) => {
const createSection = (fieldLabel, div, doctype, section, sec) => {
try {
const newField = document.createElement('div') // will contain input field and label
......@@ -723,6 +736,9 @@ const createSection = (fieldLabel, div, doctype, section) => {
newOption = document.createElement("option")
newOption.text = section
newOption.value = section
if (section == sec) {
newOption.selected = 'selected'
}
docTypeDropDown.add(newOption)
}
......@@ -776,42 +792,81 @@ function populateForm(index){
}
async function populateFields(){
var data = [];
data.push(await getFieldData());
sessionStorage.setItem('formArray', JSON.stringify(data));
var formArray = JSON.parse(sessionStorage.getItem('formArray'));
var doctype = formArray[0].DocType;
var section = formArray[0].Section;
if (formArray[0] != null) {
var currForm = formArray[0];
await fetchSchema();
var fields = {};
var resp = [];
resp.push(await getFieldData());
if (resp[0] != null) {
var doctype = resp[0].DocType;
var section = resp[0].Section;
sessionStorage.removeItem("doctype");
sessionStorage.removeItem("section");
if (typeof doctype !== 'undefined' && typeof section !== 'undefined') {
sessionStorage.setItem("doctype", doctype);
sessionStorage.setItem("section", section);
}
var currForm = resp[0];
/*document.querySelector('#DocType').value = doctype;
sessionStorage.setItem("doctype", doctype);
for(let i = 0; i < document.getElementById("DocType").options.length; i++) {
if(document.getElementById("DocType").options[i].value == doctype) {
document.getElementById("DocType").options[i].selected = "selected"
}
}
sessionStorage.setItem("section", section);
document.querySelector('#Section').value = section;
for(let i = 0; i < document.getElementById("Section").options.length; i++) {
if(document.getElementById("Section").options[i].value == section) {
document.getElementById("Section").options[i].selected = "selected"
}
}*/
for (let field in currForm) {
//document.getElementById(field).value = currForm[field];
if(field == "DocType"){
/*if(field == "DocType"){
document.querySelector('#DocType').value = doctype;
sessionStorage.setItem("doctype", doctype);
for(let i = 0; i < document.getElementById("DocType").options.length; i++) {
if(document.getElementById("DocType").options[i].value == doctype) {
document.getElementById("DocType").options[i].selected = "selected"
}
}
const mySelect = document.getElementById(field);
const selectedOption = mySelect.options[mySelect.selectedIndex];
selectedOption.value = doctype;
}
if(field == "Section"){
const mySelect = document.getElementById(field);
const selectedOption = mySelect.options[mySelect.selectedIndex];
selectedOption.value = section;
}
} */
if(field == "fields"){
let fieldsobj = currForm[field];
for (let [k,v] of Object.entries(fieldsobj)) {
for(let key of Object.keys(schema[doctype][section])) {
if(schema[doctype][section][key].aka == "field"+k) {
var fieldId = schema[doctype][section][key].fieldLabel;
var currId = fieldId.replace(" ", "_")
document.getElementById(currId).value = v;
fields["field"+k] = v;
//var fieldId = schema[doctype][section][key].fieldLabel;
//var currId = fieldId.replace(" ", "_")
//document.getElementById(currId).value = v;
}
}
}
}
}
}
}
sessionStorage.setItem('fields', JSON.stringify(fields));
displayFields("fields");
}
const init = () => {
const init = async () => {
let started_flag = false;
displayFields("fields");
accessFile();
window.onkeydown = (key) => {
if (!started_flag) {
if (searchStringInArray(`${key.key}`, keyArray) == true || key.ctrlKey && key.key) {
......
var container = document.getElementById("pdf-container");
// Get the next and previous buttons
var prevButton = document.getElementById('prev-button');
var nextButton = document.getElementById('next-button');
// Fit Content
var fitContentButton = document.getElementById('fit-content');
// Get the rotate left and rotate right buttons
var rotateLeftButton = document.getElementById('rotate-left');
var rotateRightButton = document.getElementById('rotate-right');
// Get the zoom in and zoom out buttons
var zoomInButton = document.getElementById('zoom-in');
var zoomOutButton = document.getElementById('zoom-out');
// Get the flip vertical and flip horizontal buttons
var flipVerticalButton = document.getElementById('flip-vertical');
var flipHorizontalButton = document.getElementById('flip-horizontal');
//info's
var pageInfo = document.getElementById('page-info');
var zoomInfo = document.getElementById('zoom-info');
//canva's
var canvas = document.createElement('canvas');
var displayPdf = function(document) {
// Get the container element
// Load the PDF document
pdfjsLib.getDocument(document).promise.then(function(pdf) {
// Get the first page of the PDF
pdf.getPage(1).then(function(page) {
// Set the viewport scale and size
var scale = 1.3;
var viewport = page.getViewport({scale: scale});
// Create a canvas element to render the page
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
container.appendChild(canvas);
// Render the page on the canvas
var renderContext = {
canvasContext: context,
viewport: viewport
};
page.render(renderContext);
});
// Keep track of the current page, rotation, scale, and flip settings
var currentPage = 1;
var currentRotation = 0;
var currentScale = 1.3;
var flipVertical = false;
var flipHorizontal = false;
var fitScale = 2.0;
// Handle the click event for the previous button
prevButton.addEventListener('click', function() {
if (currentPage > 1) {
currentPage--;
renderPage(currentPage);
}
});
// Handle the click event for the next button
nextButton.addEventListener('click', function() {
if (currentPage < pdf.numPages) {
currentPage++;
renderPage(currentPage);
}
});
fitContentButton.addEventListener('click', function() {
if(currentScale != fitScale){
currentScale = fitScale;
renderPage(currentPage);
}else{
currentScale = 1.3;
renderPage(currentPage);
}
});
// Handle the click event for the rotate left button
rotateLeftButton.addEventListener('click', function() {
currentRotation -= 90;
renderPage(currentPage);
});
// Handle the click event for the rotate right button
rotateRightButton.addEventListener('click', function() {
currentRotation += 90;
renderPage(currentPage);
});
// Handle the click event for the zoom in button
zoomInButton.addEventListener('click', function() {
currentScale += 0.1;
renderPage(currentPage);
});
// Handle the click event for the zoom out button
zoomOutButton.addEventListener('click', function() {
currentScale -= 0.1;
renderPage(currentPage);
});
// Handle the click event for the flip vertical button
flipVerticalButton.addEventListener('click', function() {
// flipVertical = !flipVertical;
// renderPage(currentPage);
container.style.transform = `scaleY(${container.style.transform.includes('scaleY(-1)') ? '1' : '-1'})`;
container.style.float = "left";
});
// Handle the click event for the flip horizontal button
flipHorizontalButton.addEventListener('click', function() {
// flipHorizontal = !flipHorizontal;
// renderPage(currentPage);
container.style.transform = `scaleX(${container.style.transform.includes('scaleX(-1)') ? '1' : '-1'})`;
container.style.float = "left";
});
// Function to render a page
function renderPage(pageNumber) {
pdf.getPage(pageNumber).then(function(page) {
var viewport = page.getViewport({scale: currentScale, rotation: currentRotation});
if (flipVertical || flipHorizontal) {
var transform = [1, 0, 0, 1, 0, 0];
if (flipVertical) {
transform[3] = -1;
transform[5] = viewport.height;
}
if (flipHorizontal) {
transform[0] = -1;
transform[4] = viewport.width;
}
viewport.transform = transform;
}
/*var canvas = document.querySelector('canvas');*/
var context = canvas.getContext('2d');
canvas.height = viewport.height;
canvas.width = viewport.width;
var renderContext = {
canvasContext: context,
viewport: viewport
};
setTimeout(function() {
page.render(renderContext);
}, 100);
// Update the page info element
pageInfo.textContent = 'Page ' + pageNumber + ' of ' + pdf.numPages;
zoomInfo.textContent = 'Zoom ' + currentScale;
});
}
// Render the first page
renderPage(currentPage);
});
};
......@@ -78,7 +78,7 @@ const submitForm = (e) => {
});
document.getElementById("counter").innerHTML = "";
clearTimeout(interval);
/* sessionStorage.removeItem("section");
/*sessionStorage.removeItem("section");
sessionStorage.removeItem("doctype");*/
isCanvasNotCreated = 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