Skip to content

W
web-ui
Commit 12948cf6 by Daniel Bawag
Options

WG-227 - Modified PDF viewer to accept blob

parent a4a5ea70
Showing with 684 additions and 742 deletions
WebGde/WebContent/src/BPO/rejectElement.js
......@@ -121,12 +121,26 @@ function createRejectWindow(){
setRadioHandler('MssgBox');
okButton.onclick = function () {
saveExceptionToXml();//save xml
rejectElement();//reject on bpo
screenMain.style.display = 'none';
rejectButton.disabled = false;
popUpDisplay.remove();
okButton.onclick = function () {
if (document.querySelector('input[name="rejectRadio"]:checked').value != null) {
if (document.querySelector('input[name="rejectRadio"]:checked').value.trim().length != 0) {
saveExceptionToXml();//save xml
rejectElement();//reject on bpo
screenMain.style.display = 'none';
rejectButton.disabled = false;
popUpDisplay.remove();
var fileName = sessionStorage.getItem("file_Name");
if(fileName !== null && fileName !== undefined){
document.getElementById("controlsContainer").outerHTML="";
}else{
document.getElementById("TiffViewer_ButtonContainer").outerHTML="";
}
return;
}
}
document.getElementById('MssgBox').value = "";
document.getElementById('rejectSubmit').click();
}
cancelButton.onclick = function () {
......@@ -298,19 +312,28 @@ function saveExceptionToXml(){
}
function createMessageBox(id){
let form = document.createElement('form');
var mssgBox = document.createElement('textarea');
mssgBox.id = id;
mssgBox.name = "rejectRadio";
mssgBox.maxLength = "1000";
mssgBox.cols = "20";
mssgBox.rows = "5";
mssgBox.rows = "5";
mssgBox.required = true;
mssgBox.disabled = true;
mssgBox.onkeyup = function () {
let radioFive = document.getElementById('check5');
radioFive.value = mssgBox.value;
}
return mssgBox;
let submit = document.createElement('input');
submit.id = 'rejectSubmit';
submit.type = 'submit';
submit.style.visibility = 'hidden';
form.appendChild(mssgBox);
form.appendChild(submit);
return form;
}
......
WebGde/WebContent/src/BPO/returnElement.js
......@@ -67,14 +67,28 @@ async function returnElementLogout(elementId) {
}
var returnButton = document.getElementById('return');
returnButton.addEventListener("click", function () {
returnElementBPO(sessionStorage.getItem("element_id"));
var fileName = sessionStorage.getItem("file_Name");
if(fileName !== null && fileName !== undefined){
document.getElementById("controlsContainer").outerHTML="";
}else{
document.getElementById("TiffViewer_ButtonContainer").outerHTML="";
}
});
window.addEventListener('keydown', function(e) {
if (e.altKey == true && e.keyCode == 85){
returnElementBPO(sessionStorage.getItem("element_id"));
returnElementBPO(sessionStorage.getItem("element_id"));
var fileName = sessionStorage.getItem("file_Name");
if(fileName !== null && fileName !== undefined){
document.getElementById("controlsContainer").outerHTML="";
}else{
document.getElementById("TiffViewer_ButtonContainer").outerHTML="";
}
}
});
......
WebGde/WebContent/src/accessFile/accessFile.js
......@@ -40,538 +40,471 @@ async function accessFile() {
store.createIndex("image_address", ["address"], { unique: false });
};
async function main(img) {
const request = indexedDB.open("ImageDatabase", 1);
request.onsuccess = async function() {
// console.log("Database opened successfully " + val );
const db = request.result;
const transaction = db.transaction("image", "readwrite");
const store = transaction.objectStore("image");
const imageIndex = store.index("image_address");
if (img != null) {
var filename = get_file_name(img);
}
var count = store.count();
let totalImages = JSON.parse(sessionStorage.getItem("dir_files")).length;
count.onsuccess = function() {
if (totalImages != (parseInt(localStorage.getItem("sfIndex")))) {
if (img == null && count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1) { //if only one file left
const idQuery = store.get(parseInt(localStorage.getItem("display_counter")));
idQuery.onsuccess = function() {
url = URL.createObjectURL(idQuery.result.address);
if (idQuery.result.name.endsWith(PDF_EXTENSION)) {
sessionStorage.setItem("file_Name", idQuery.result.name);
const TiffViewer_Header = document.getElementById("TiffModalHeader");
const TiffViewer_filedetail = document.createElement("div");
TiffViewer_filedetail.id = "TiffViewerImageName";
TiffViewer_filedetail.textContent = "Filename: " + idQuery.result.name;
TiffViewer_filedetail.title = "Filename: " + idQuery.result.name;
TiffViewer_Header.append(TiffViewer_filedetail);
var ctrlTiff = document.getElementById("TiffViewer_ButtonContainer");
if (ctrlTiff) {
ctrlTiff.outerHTML="";
}
displayPdf(idQuery.result.path);
} else {
var ctrlPdf = document.getElementById("controlsContainer");
if (ctrlPdf) {
ctrlPdf.outerHTML="";
}
console.log("This is not a pdf file");
window.addEventListener("load", loadDoc(url, TIFFViewer, idQuery.result.name), false);
}
async function main(img) {
const request = indexedDB.open("ImageDatabase", 1);
request.onsuccess = async function () {
// console.log("Database opened successfully " + val );
const db = request.result;
const transaction = db.transaction("image", "readwrite");
const store = transaction.objectStore("image");
const imageIndex = store.index("image_address");
if(img!=null){
var filename = get_file_name(img);
}
};
} else if (count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1) {
const idQuery = store.get(parseInt(localStorage.getItem("display_counter")));
idQuery.onsuccess = function() {
url = URL.createObjectURL(idQuery.result.address);
if (idQuery.result.name.endsWith(PDF_EXTENSION)) {
sessionStorage.setItem("file_Name", idQuery.result.name);
const TiffViewer_Header = document.getElementById("TiffModalHeader");
const TiffViewer_filedetail = document.createElement("div");
TiffViewer_filedetail.id = "TiffViewerImageName";
TiffViewer_filedetail.textContent = "Filename: " + idQuery.result.name;
TiffViewer_filedetail.title = "Filename: " + idQuery.result.name;
TiffViewer_Header.append(TiffViewer_filedetail);
var ctrlTiff = document.getElementById("TiffViewer_ButtonContainer");
if (ctrlTiff) {
ctrlTiff.outerHTML="";
}
displayPdf(idQuery.result.path);
} else {
var ctrlPdf = document.getElementById("controlsContainer");
if (ctrlPdf) {
ctrlPdf.outerHTML="";
var count = store.count();
let totalImages = JSON.parse(sessionStorage.getItem("dir_files")).length;
count.onsuccess = function() {
if (totalImages != (parseInt(localStorage.getItem("sfIndex")))) {
if (img == null && count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1) { //if only one file left
const idQuery = store.get(parseInt(localStorage.getItem("display_counter")));
idQuery.onsuccess = function() {
url = URL.createObjectURL(idQuery.result.address);
if (idQuery.result.name.endsWith(PDF_EXTENSION)) {
sessionStorage.setItem("file_Name", idQuery.result.name);
const TiffViewer_Header = document.getElementById("TiffModalHeader");
const TiffViewer_filedetail = document.createElement("div");
TiffViewer_filedetail.id = "TiffViewerImageName";
TiffViewer_filedetail.textContent = "Filename: " + idQuery.result.name;
TiffViewer_filedetail.title = "Filename: " + idQuery.result.name;
TiffViewer_Header.append(TiffViewer_filedetail);
// displayPdf(idQuery.result.path);
displayPdf(url);
} else {
console.log("This is not a pdf file");
window.addEventListener("load", loadDoc(url, TIFFViewer, idQuery.result.name), false);
}
};
} else if (count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1) {
const idQuery = store.get(parseInt(localStorage.getItem("display_counter")));
idQuery.onsuccess = function() {
url = URL.createObjectURL(idQuery.result.address);
if (idQuery.result.name.endsWith(PDF_EXTENSION)) {
sessionStorage.setItem("file_Name", idQuery.result.name);
const TiffViewer_Header = document.getElementById("TiffModalHeader");
const TiffViewer_filedetail = document.createElement("div");
TiffViewer_filedetail.id = "TiffViewerImageName";
TiffViewer_filedetail.textContent = "Filename: " + idQuery.result.name;
TiffViewer_filedetail.title = "Filename: " + idQuery.result.name;
TiffViewer_Header.append(TiffViewer_filedetail);
// displayPdf(idQuery.result.path);
displayPdf(url);
} else {
console.log("This is not a pdf file");
window.addEventListener("load", loadDoc(url, TIFFViewer, idQuery.result.name), false);
}
};
}
console.log("This is not a pdf file");
window.addEventListener("load", loadDoc(url, TIFFViewer, idQuery.result.name), false);
}
}
}
transaction.oncomplete = function () {
db.close();
};
}
}
};
status('downloading ...');
var image_info=[];
}
transaction.oncomplete = function() {
db.close();
};
};
status('downloading ...');
var image_info = [];
let response;
if (IS_RETRIEVE_FROM_BPO == "Y") {
if (img != null ? img.startsWith("http") : false) {
response = await fetch(img);
gfsFileName = getGfsFileName(response.headers.get("content-disposition"));
} else {
let formData = new FormData();
formData.append("data", JSON.stringify({
"dir": img
}));
response = await fetch('./src/accessFile/getImage.php', {
method: "POST",
body: formData,
});
}
} else {
response = await fetch(img);
}
const contentLength = response.headers.get('content-length');
var total = (parseInt(contentLength, 10));
let loaded = 0;
const res = new Response(new ReadableStream({
async start(controller) {
const reader = response.body.getReader();
for (;;) {
const {
done,
value
} = await reader.read();
if (done) break;
loaded += (value.byteLength);
// console.log(loaded);
progress({
loaded,
total
});
controller.enqueue(value);
}
controller.close();
},
}));
var blob = await res.blob();
status('download completed');
[...document.getElementsByClassName("bar")].forEach(el => {
el.style.display = "none";
});
const request2 = indexedDB.open("ImageDatabase", 1);
request2.onsuccess = async function() {
// console.log("Database opened successfully " + val );
const db = request2.result;
const transaction = db.transaction("image", "readwrite");
const store = transaction.objectStore("image");
var filename;
if (img != null) {
filename = gfsFileName != null ? gfsFileName : get_file_name(img);
}
var count = store.count();
let totalImages = JSON.parse(sessionStorage.getItem("dir_files")).length;
count.onsuccess = async function() {
if (count.result == 0 && (localStorage.length) == 0) {
store.put({
id: count.result + 1,
address: blob,
name: filename,
path: img
});
url = URL.createObjectURL(blob);
if (filename.endsWith(PDF_EXTENSION)) {
sessionStorage.setItem("file_Name", filename);
const TiffViewer_Header = document.getElementById("TiffModalHeader");
const TiffViewer_filedetail = document.createElement("div");
TiffViewer_filedetail.id = "TiffViewerImageName";
TiffViewer_filedetail.textContent = "Filename: " + filename;
TiffViewer_filedetail.title = "Filename: " + filename;
TiffViewer_Header.append(TiffViewer_filedetail);
var ctrlTiff = document.getElementById("TiffViewer_ButtonContainer");
if (ctrlTiff) {
ctrlTiff.outerHTML="";
}
displayPdf(img);
} else {
var ctrlPdf = document.getElementById("controlsContainer");
if (ctrlPdf) {
ctrlPdf.outerHTML="";
}
window.addEventListener("load", loadDoc(url, TIFFViewer, filename), false);
}
let response;
localStorage.setItem("display_counter", 1);
size = size + total;
File_Name = filename;
File_Path = img;
populateFields();
} else if (count.result == 1 && (localStorage.length) == 1) {
document.getElementById('prev').setAttribute('disabled', 'true');
document.getElementById('next').removeAttribute('disabled');
store.put({
id: count.result + 1,
address: blob,
name: filename,
path: img
});
localStorage.setItem("submit", "0");
localStorage.setItem("display_counter", 2);
localStorage.setItem("sfIndex", 1);
size = size + total;
} else if (totalImages != (parseInt(localStorage.getItem("sfIndex"))) && img == null && count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1) { //if only one file left
const idQuery = store.get(parseInt(localStorage.getItem("display_counter")));
document.getElementById('prev').removeAttribute('disabled');
idQuery.onsuccess = async function() {
//url = URL.createObjectURL(idQuery.result.address);
//window.addEventListener("load", loadDoc(url, TIFFViewer,idQuery.result.name), false);
File_Name = idQuery.result.name;
File_Path = idQuery.result.path;
populateFields();
localStorage.setItem("submit", "0");
if (localStorage.getItem("prev") == 1) {
localStorage.setItem("prev", "0");
document.getElementById('next').removeAttribute('disabled');
//populateForm(parseInt(localStorage.getItem("sfIndex")));
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) + 1);
if (IS_RETRIEVE_FROM_BPO == "Y") {
if (img != null ? img.startsWith("http") : false) {
response = await fetch(img);
gfsFileName = getGfsFileName(response.headers.get("content-disposition"));
} 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);
/*var formArray = JSON.parse(sessionStorage.getItem('formArray'));
if (typeof formArray[parseInt(localStorage.getItem("sfIndex")) - 1] !== 'undefined') {
populateForm(parseInt(localStorage.getItem("sfIndex")));
}*/
//store.clear();
//localStorage.setItem("nofilesleft", "1");
//promptNoFilesLeft();
let formData = new FormData();
formData.append("data", JSON.stringify({ "dir": img }));
response = await fetch('./src/accessFile/getImage.php', {
method: "POST",
body: formData,
});
}
};
} else if (img == null && count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1) { //no files left
// alert("No Files Left");
if (IS_RETRIEVE_FROM_GFS != 'Y') {
const json = {
"start_time": formatDate(global_start_time),
"end_time": formatDate(global_end_time),
"metrics_dir": METRIC_FILES + "/" + metrics_file_name
}
localStorage.setItem("complete", "1");
saveTime(json);
store.clear();
// disableForm();
// promptNoFilesLeft();
} else {
response = await fetch(img);
}
} else if (count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1) {
const idQuery = store.get(parseInt(localStorage.getItem("display_counter")));
idQuery.onsuccess = async function() {
document.getElementById('prev').removeAttribute('disabled');
document.getElementById('next').removeAttribute('disabled');
// url = URL.createObjectURL(idQuery.result.address);
// window.addEventListener("load", loadDoc(url, TIFFViewer,idQuery.result.name), false);
File_Name = idQuery.result.name;
File_Path = idQuery.result.path;
populateFields();
localStorage.setItem("submit", "0");
if (localStorage.getItem("prev") == 1) {
localStorage.setItem("prev", "0");
//populateForm(parseInt(localStorage.getItem("sfIndex")));
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) + 1); //update how many have been fetched
} else {
//store.delete(parseInt(localStorage.getItem("display_counter")) - 1);
store.put({
id: parseInt(localStorage.getItem("display_counter")) + 1,
address: blob,
name: filename,
path: img
});
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) + 1); //update how many have been fetched
localStorage.setItem("sfIndex", parseInt(localStorage.getItem("sfIndex")) + 1);
//var file = new File([blob], filename + ".TIFF", {type: "img"}); //uplaod to uploadimgfolder //scanned images
/*var formArray = JSON.parse(sessionStorage.getItem('formArray'));
if(typeof formArray[parseInt(localStorage.getItem("sfIndex")) - 1] !== 'undefined') {
populateForm(parseInt(localStorage.getItem("sfIndex")));
}*/
const contentLength = response.headers.get('content-length');
var total = (parseInt(contentLength, 10));
let loaded = 0;
const res = new Response(new ReadableStream({
async start(controller) {
const reader = response.body.getReader();
for (;;) {
const {done, value} = await reader.read();
if (done) break;
loaded += (value.byteLength);
// console.log(loaded);
progress({loaded, total});
controller.enqueue(value);
}
controller.close();
},
}));
var blob = await res.blob();
status('download completed');
[...document.getElementsByClassName("bar")].forEach(el => {
el.style.display = "none";
});
const request2 = indexedDB.open("ImageDatabase", 1);
request2.onsuccess = async function () {
// console.log("Database opened successfully " + val );
const db = request2.result;
const transaction = db.transaction("image", "readwrite");
const store = transaction.objectStore("image");
var filename;
if(img!=null){
filename = gfsFileName != null ? gfsFileName : get_file_name(img);
}
if (parseInt(localStorage.getItem("sfIndex")) <= 1) {
document.getElementById('prev').setAttribute('disabled', 'true');
var count = store.count();
let totalImages = JSON.parse(sessionStorage.getItem("dir_files")).length;
count.onsuccess = async function() {
if (count.result == 0 && (localStorage.length) == 0) {
store.put({ id: count.result + 1, address: blob , name:filename, path:img});
url = URL.createObjectURL(blob);
if (filename.endsWith(PDF_EXTENSION)) {
sessionStorage.setItem("file_Name", filename);
const TiffViewer_Header = document.getElementById("TiffModalHeader");
const TiffViewer_filedetail = document.createElement("div");
TiffViewer_filedetail.id = "TiffViewerImageName";
TiffViewer_filedetail.textContent = "Filename: " + filename;
TiffViewer_filedetail.title = "Filename: " + filename;
TiffViewer_Header.append(TiffViewer_filedetail);
// displayPdf(img);
displayPdf(url);
} else {
window.addEventListener("load", loadDoc(url, TIFFViewer,filename), false);
}
localStorage.setItem("display_counter", 1);
size = size + total;
File_Name = filename;
File_Path = img;
populateFields();
} else if (count.result == 1 && (localStorage.length) == 1) {
document.getElementById('prev').setAttribute('disabled','true');
document.getElementById('next').removeAttribute('disabled');
store.put({ id: count.result + 1, address: blob , name:filename, path:img});
localStorage.setItem("submit", "0");
localStorage.setItem("display_counter", 2);
localStorage.setItem("sfIndex", 1);
size = size + total;
} else if(totalImages != (parseInt(localStorage.getItem("sfIndex"))) && img == null && count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1){ //if only one file left
const idQuery = store.get(parseInt(localStorage.getItem("display_counter")));
document.getElementById('prev').removeAttribute('disabled');
idQuery.onsuccess = async function () {
//url = URL.createObjectURL(idQuery.result.address);
//window.addEventListener("load", loadDoc(url, TIFFViewer,idQuery.result.name), false);
File_Name = idQuery.result.name;
File_Path = idQuery.result.path;
populateFields();
localStorage.setItem("submit", "0");
if (localStorage.getItem("prev") == 1) {
localStorage.setItem("prev", "0");
document.getElementById('next').removeAttribute('disabled');
//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);
/*var formArray = JSON.parse(sessionStorage.getItem('formArray'));
if (typeof formArray[parseInt(localStorage.getItem("sfIndex")) - 1] !== 'undefined') {
populateForm(parseInt(localStorage.getItem("sfIndex")));
}*/
//store.clear();
//localStorage.setItem("nofilesleft", "1");
//promptNoFilesLeft();
}
};
} else if(img == null && count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1){//no files left
// alert("No Files Left");
if(IS_RETRIEVE_FROM_GFS != 'Y'){
const json = {
"start_time" : formatDate(global_start_time),
"end_time": formatDate(global_end_time),
"metrics_dir": METRIC_FILES + "/" + metrics_file_name
}
localStorage.setItem("complete", "1");
saveTime(json);
store.clear();
// disableForm();
// promptNoFilesLeft();
}
} else if (count.result >= 2 && (localStorage.length) >= 2 && localStorage.getItem("submit") == 1) {
const idQuery = store.get(parseInt(localStorage.getItem("display_counter")));
idQuery.onsuccess = async function () {
document.getElementById('prev').removeAttribute('disabled');
document.getElementById('next').removeAttribute('disabled');
// url = URL.createObjectURL(idQuery.result.address);
// window.addEventListener("load", loadDoc(url, TIFFViewer,idQuery.result.name), false);
File_Name = idQuery.result.name;
File_Path = idQuery.result.path;
populateFields();
localStorage.setItem("submit", "0");
if(localStorage.getItem("prev") == 1){
localStorage.setItem("prev", "0");
//populateForm(parseInt(localStorage.getItem("sfIndex")));
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) + 1); //update how many have been fetched
} else {
//store.delete(parseInt(localStorage.getItem("display_counter")) - 1);
store.put({ id: parseInt(localStorage.getItem("display_counter")) + 1, address: blob , name:filename, path:img});
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) + 1); //update how many have been fetched
localStorage.setItem("sfIndex", parseInt(localStorage.getItem("sfIndex")) + 1);
//var file = new File([blob], filename + ".TIFF", {type: "img"}); //uplaod to uploadimgfolder //scanned images
/*var formArray = JSON.parse(sessionStorage.getItem('formArray'));
if(typeof formArray[parseInt(localStorage.getItem("sfIndex")) - 1] !== 'undefined') {
populateForm(parseInt(localStorage.getItem("sfIndex")));
}*/
}
if(parseInt(localStorage.getItem("sfIndex"))<=1){
document.getElementById('prev').setAttribute('disabled','true');
}
//var file = new File([blob], filename + ".TIFF", {type: "img"}); //uplaod to uploadimgfolder //scanned images
};
size = size + total;
}
else {
const json = {
"start_time" : formatDate(global_start_time),
"end_time": formatDate(global_end_time),
"metrics_dir": METRIC_FILES + "/" + metrics_file_name
}
localStorage.setItem("complete", "1");
saveTime(json);
store.clear();
}
}
//var file = new File([blob], filename + ".TIFF", {type: "img"}); //uplaod to uploadimgfolder //scanned images
transaction.oncomplete = function () {
db.close();
status('downloaded '+Math.trunc(size/1000)+" kb");
};
};
size = size + total;
} else {
const json = {
"start_time": formatDate(global_start_time),
"end_time": formatDate(global_end_time),
"metrics_dir": METRIC_FILES + "/" + metrics_file_name
}
localStorage.setItem("complete", "1");
saveTime(json);
store.clear();
}
}
transaction.oncomplete = function() {
db.close();
status('downloaded ' + Math.trunc(size / 1000) + " kb");
};
};
}
var updated_input_files = await Input_files();
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') + '/element7');
} else {
if ((localStorage.length) == 0) {
if (updated_input_files.length == 0) {
alert("No Inputs");
} else if (updated_input_files.length == 1) {
main(updated_input_files[0]);
} else {
await main(updated_input_files[0]);
main(updated_input_files[1]);
}
} else {
main(updated_input_files[0]);
}
}
function get_file_name(filepath) {
if (filepath.startsWith(".")) {
var filename = filepath.substring(8);
var flag = 0;
for (var i = 0; i < filename.length; i++) {
if (filename.charAt(filename.length - i) != ".") {
flag++;
} else {
break;
}
}
filename = filename.substring(0, filename.length - flag);
return filename;
} else {
return filepath.substr(filepath.lastIndexOf("\\") + 1);
}
}
function Input_files() {
//Dirfiles from dir.php
var urls = Object.assign(new Array(), Dirfiles);
var count;
if ((localStorage.length) == 0) {
count = 0;
} else {
if (localStorage.getItem("prev") == 1) {
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) - 2);
localStorage.setItem("sfIndex", parseInt(localStorage.getItem("sfIndex")) - 1);
count = parseInt(localStorage.getItem("display_counter"));
} else {
count = parseInt(localStorage.getItem("display_counter"));
}
}
for (var i = 0; i < count; i++) {
urls.shift();
}
return urls;
}
function getFolder(url) {
const promise = fetch(url, {
method: 'GET',
headers: {
'Authorization': sessionStorage.getItem('token')
// 'Content-Type': 'application/x-www-form-urlencoded',
var updated_input_files = await Input_files();
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')+'/element7');
}else{
if((localStorage.length)==0){
if(updated_input_files.length==0){
alert("No Inputs");
} else if (updated_input_files.length==1){
main(updated_input_files[0]);
} else {
await main(updated_input_files[0]);
main(updated_input_files[1]);
}
}else{
main(updated_input_files[0]);
}
}
//body: JSON.stringify(myObject)
})
.then(function(response) {
if (response.status === 200) {
response.json().then(function(data) {
let temp = data.folderContent;
// temp.forEach(function(obj){
// //getFiles(DOWNLOAD_URL,obj.fileId);
// getFiles(DOWNLOAD_URL,obj.fileId);
// })
var container = document.getElementById("viewer");
var overlay;
for (let i = 0; i < temp.length; i++) {
overlay = document.createElement('div');
overlay.id = "containerModal" + i;
overlay.style.display = 'none';
container.append(overlay);
getFiles(DOWNLOAD_URL, temp[i].fileId, overlay, temp[i].name);
function get_file_name(filepath){
if (filepath.startsWith(".")) {
var filename = filepath.substring(8);
var flag=0;
for (var i = 0; i < filename.length; i++) {
if(filename.charAt(filename.length-i) != "."){
flag++;
}else{
break;
}
}
filename = filename.substring(0,filename.length-flag);
return filename;
} else {
return filepath.substr(filepath.lastIndexOf("\\") + 1);
}
let counter = 0;
sessionStorage.setItem("gfsCounter", counter);
var currDislplay = document.getElementById("containerModal" + sessionStorage.getItem('gfsCounter'));
currDislplay.style.display = 'block';
});
} else {
console.log("Error");
}
})
.catch(function(error) {
console.log('Request failed', error);
});
return promise;
}
async function getFiles(url, id, overlay, filename) {
console.log(url);
var myObject = {
fileId: id
};
fetch(url, {
method: 'POST',
headers: {
'Authorization': sessionStorage.getItem('token'),
'Content-Type': 'application/json'
},
body: JSON.stringify(myObject)
})
.then(async function(response) {
await response.text().then(async function(imgData) {
getBlobService(imgData, function(data) {
var fileReader = new FileReader();
fileReader.onload = function() {
var fileReader = new FileReader();
fileReader.onload = function() {
// File_Name = filename;
tiffViewerTest(this.result, overlay, filename);
};
fileReader.readAsArrayBuffer(data);
};
fileReader.readAsArrayBuffer(data);
});
});
})
.catch(function(error) {
console.log('Request failed', error);
});
}
function Input_files() {
//Dirfiles from dir.php
var urls = Object.assign(new Array(), Dirfiles);
var count;
if((localStorage.length) == 0){
count = 0;
}else{
if(localStorage.getItem("prev") == 1){
localStorage.setItem("display_counter", parseInt(localStorage.getItem("display_counter")) - 2);
localStorage.setItem("sfIndex", parseInt(localStorage.getItem("sfIndex")) - 1);
count = parseInt(localStorage.getItem("display_counter"));
} else {
count = parseInt(localStorage.getItem("display_counter"));
}
}
for (var i = 0; i < count; i++) {
urls.shift();
}
return urls;
}
function getBlobService(url, func) {
const promise = fetch(url, {
method: 'get',
headers: {
'Authorization': sessionStorage.getItem('token')
function getFolder(url){
const promise = fetch(url, {
method: 'GET',
headers: {
'Authorization': sessionStorage.getItem('token')
// 'Content-Type': 'application/x-www-form-urlencoded',
}
//body: JSON.stringify(myObject)
})
.then(function (response) {
if(response.status === 200){
response.json().then(function(data) {
let temp = data.folderContent;
// temp.forEach(function(obj){
// //getFiles(DOWNLOAD_URL,obj.fileId);
// getFiles(DOWNLOAD_URL,obj.fileId);
// })
var container = document.getElementById("viewer");
var overlay;
for (let i = 0; i < temp.length; i++) {
overlay = document.createElement('div');
overlay.id = "containerModal" + i;
overlay.style.display = 'none';
container.append(overlay);
getFiles(DOWNLOAD_URL,temp[i].fileId,overlay,temp[i].name);
}
let counter = 0;
sessionStorage.setItem("gfsCounter", counter);
var currDislplay = document.getElementById("containerModal" + sessionStorage.getItem('gfsCounter'));
currDislplay.style.display = 'block';
});
}else{
console.log("Error");
}
})
.catch(function (error) {
console.log('Request failed', error);
});
return promise;
}
})
.then(function(response) {
switch (response.status) {
case 200:
response.blob().then(function(data) {
func(data);
async function getFiles(url,id,overlay,filename){
console.log(url);
var myObject = {fileId : id};
fetch(url, {
method: 'POST',
headers: {
'Authorization': sessionStorage.getItem('token'),
'Content-Type':'application/json'
},
body: JSON.stringify(myObject)
})
.then(async function(response) {
await response.text().then(async function(imgData) {
getBlobService(imgData, function(data) {
var fileReader = new FileReader();
fileReader.onload = function() {
var fileReader = new FileReader();
fileReader.onload = function () {
// File_Name = filename;
tiffViewerTest(this.result, overlay, filename);
};
fileReader.readAsArrayBuffer(data);
};
fileReader.readAsArrayBuffer(data);
});
});
})
.catch(function (error) {
console.log('Request failed', error);
});
}
function getBlobService(url, func) {
const promise = fetch(url, {
method: 'get',
headers: {
'Authorization': sessionStorage.getItem('token')
}
})
.then(function(response) {
switch (response.status) {
case 200: response.blob().then(function(data) { func(data); }); break;
case 460: createInfoPopup("Error 460", "User does not exist."); break;
case 403: removeOverlay(); createInfoPopup("We are so sorry...", "Permission Denied: You don't have access here."); break;
case 464: createInfoPopup("Error 464", "No folder was retrieved."); break;
case 463: createInfoPopup("Error 463", "The folder name you entered already exists."); break;
case 462: createInfoPopup("Error 462", "No file was retrieved."); break;
case 461: createInfoPopup("Error 461", "File already exists."); break;
case 465: createInfoPopup("Error 465", "Source not found"); break;
case 500: removeOverlay(); createInfoPopup("It's not you. It's us... So sorry.", "Error 500: Please contact the support team so we can fix this immediately."); break;
default: break;
}
})
.catch(function(error) {
removeOverlay();
createInfoPopup("Whoops!", "We encountered some problems with your request. Rest assured we're working on this and it'll be okay soon.");
});
break;
case 460:
createInfoPopup("Error 460", "User does not exist.");
break;
case 403:
removeOverlay();
createInfoPopup("We are so sorry...", "Permission Denied: You don't have access here.");
break;
case 464:
createInfoPopup("Error 464", "No folder was retrieved.");
break;
case 463:
createInfoPopup("Error 463", "The folder name you entered already exists.");
break;
case 462:
createInfoPopup("Error 462", "No file was retrieved.");
break;
case 461:
createInfoPopup("Error 461", "File already exists.");
break;
case 465:
createInfoPopup("Error 465", "Source not found");
break;
case 500:
removeOverlay();
createInfoPopup("It's not you. It's us... So sorry.", "Error 500: Please contact the support team so we can fix this immediately.");
break;
default:
break;
}
})
.catch(function(error) {
removeOverlay();
createInfoPopup("Whoops!", "We encountered some problems with your request. Rest assured we're working on this and it'll be okay soon.");
});
return promise;
}
return promise;
}
}
function postServiceText(url, myObject, funcSuccess, funcFail) {
const promise = fetch(url, {
method: 'post',
body: JSON.stringify(myObject),
headers: {
'Content-Type': 'application/json',
'Authorization': kc.token
// 'Content-Type': 'application/x-www-form-urlencoded',
}
})
.then(function(response) {
if (response.status === 200) {
response.text().then(function(data) {
//var parseData = JSON.parse(data);
// funcSuccess(data);
console.log(data);
//alert(data);
//displayData(parseData);
});
} else {
console.log("Error");
funcFail();
}
})
.catch(function(error) {
console.log('Request failed', error);
});
return promise;
function postServiceText(url, myObject, funcSuccess, funcFail){
const promise = fetch(url, {
method: 'post',
body: JSON.stringify(myObject),
headers: {
'Content-Type': 'application/json',
'Authorization': kc.token
// 'Content-Type': 'application/x-www-form-urlencoded',
}
})
.then(function (response) {
if(response.status === 200){
response.text().then(function(data) {
//var parseData = JSON.parse(data);
// funcSuccess(data);
console.log(data);
//alert(data);
//displayData(parseData);
});
}else{
console.log("Error");
funcFail();
}
})
.catch(function (error) {
console.log('Request failed', error);
});
return promise;
}
......@@ -579,151 +512,109 @@ function refreshImage() {
var size = 0;
const elStatus = document.getElementById('status');
function status(text) {
elStatus.innerHTML = text;
}
//const progressBar = document.getElementById('progressBar');
const elProgress = document.getElementById('progress');
function progress() {
/* elProgress.innerHTML = Math.round(loaded * .000001) + " mb of " + Math.round(total * .000001);*/
/* elProgress.innerHTML = Math.round(loaded * .000001) + " mb of " + Math.round(total * .000001);*/
//progressBar.value = Math.round(100 / 100 * 100);
}
var request = indexedDB.open("ImageDatabase", 1);
request.onsuccess = async function() {
// console.log("Database opened successfully " + val );
const request = indexedDB.open("ImageDatabase", 1);
request.onsuccess = async function () {
// console.log("Database opened successfully " + val );
const db = request.result;
const transaction = db.transaction("image", "readwrite");
const store = transaction.objectStore("image");
const imageIndex = store.index("image_address");
var count = store.count();
count.onsuccess = function() {
if (count.result == 0 && IS_RETRIEVE_FROM_GFS != 'Y') {
disableForm();
promptNoFilesLeft();
} else {
const idQuery = count.result == 2 ? store.get(parseInt(localStorage.getItem("display_counter")) - 1) : store.get(parseInt(localStorage.getItem("display_counter")));
idQuery.onsuccess = function () {
url = URL.createObjectURL(idQuery.result.address);
if (idQuery.result.name.endsWith(PDF_EXTENSION)) {
sessionStorage.setItem("file_Name", idQuery.result.name);
const TiffViewer_Header = document.getElementById("TiffModalHeader");
const TiffViewer_filedetail = document.createElement("div");
TiffViewer_filedetail.id = "TiffViewerImageName";
TiffViewer_filedetail.textContent = "Filename: " + idQuery.result.name;
TiffViewer_filedetail.title = "Filename: " + idQuery.result.name;
TiffViewer_Header.append(TiffViewer_filedetail);
// displayPdf(idQuery.result.path);
displayPdf(url);
} 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;
};
const db = request.result;
var transaction;
var store;
if (db.objectStoreNames.contains('image')) {
transaction = db.transaction("image", "readwrite");
store = transaction.objectStore("image");
}else{
noElementLogout();
}
var count = store.count();
count.onsuccess = function() {
if (count.result == 0 && IS_RETRIEVE_FROM_GFS != 'Y') {
disableForm();
promptNoFilesLeft();
} else {
const idQuery = count.result == 2 ? store.get(parseInt(localStorage.getItem("display_counter")) - 1) : store.get(parseInt(localStorage.getItem("display_counter")));
idQuery.onsuccess = function() {
url = URL.createObjectURL(idQuery.result.address);
if (idQuery.result.name.endsWith(PDF_EXTENSION)) {
sessionStorage.setItem("file_Name", idQuery.result.name);
const TiffViewer_Header = document.getElementById("TiffModalHeader");
const TiffViewer_filedetail = document.createElement("div");
TiffViewer_filedetail.id = "TiffViewerImageName";
TiffViewer_filedetail.textContent = "Filename: " + idQuery.result.name;
TiffViewer_filedetail.title = "Filename: " + idQuery.result.name;
TiffViewer_Header.append(TiffViewer_filedetail);
var ctrlTiff = document.getElementById("TiffViewer_ButtonContainer");
if (ctrlTiff) {
ctrlTiff.outerHTML="";
}
displayPdf(idQuery.result.path);
} else {
var ctrlPdf = document.getElementById("controlsContainer");
if (ctrlPdf) {
ctrlPdf.outerHTML="";
}
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;
};
}
}
transaction.oncomplete = function() {
db.close();
status('downloaded ' + Math.trunc(size / 1000) + " kb");
progress();
[...document.getElementsByClassName("bar")].forEach(el => {
el.style.display = "none";
});
};
};
// Handle errors
request.onerror = function(event) {
console.error('Error opening database:', event.target.error);
};
}
}
}
function noElementLogout(){
alert("Element does not exist in current node, Logging out User");
var DBdeleteRequest = window.indexedDB.deleteDatabase("ImageDatabase");
DBdeleteRequest.addEventListener('blocked', function(e) {
console.log("Database cleared.");
});
DBdeleteRequest.addEventListener('upgradeneeded', function(e) {
console.log("Upgrade needed in deleting database");
});
DBdeleteRequest.addEventListener('error', function(e) {
console.log("Error in deleting database");
});
DBdeleteRequest.addEventListener('success', function(e) {
console.log("Database cleared.");
});
localStorage.clear();
sessionStorage.clear();
logoutKeycloak();
submitted = false;
transaction.oncomplete = function () {
db.close();
status('downloaded '+Math.trunc(size/1000)+" kb");
progress();
[...document.getElementsByClassName("bar")].forEach(el => {
el.style.display = "none";
});
};
};
}
function promptNoFilesLeft() {
var viewer = document.getElementById('viewer');
let genericDiv = document.createElement("div");
genericDiv.classList.add("genericPopup");
var promptMain = document.createElement('div');
promptMain.setAttribute("id", "prompt");
var message = document.createElement('p');
message.innerHTML = 'No images left to be fetched, Proceed to end session';
var okButton = document.createElement('button');
okButton.innerHTML = 'ok';
okButton.onclick = function() {
genericDiv.remove();
var DBdeleteRequest = window.indexedDB.deleteDatabase("ImageDatabase");
DBdeleteRequest.addEventListener('blocked', function(e) {
console.log("Database cleared.");
});
DBdeleteRequest.addEventListener('upgradeneeded', function(e) {
console.log("Upgrade needed in deleting database");
});
DBdeleteRequest.addEventListener('error', function(e) {
console.log("Error in deleting database");
});
DBdeleteRequest.addEventListener('success', function(e) {
console.log("Database cleared.");
});
sessionStorage.clear();
localStorage.clear();
logoutKeycloak();
/*promptMain.style.display = 'none';*/
};
promptMain.appendChild(message);
promptMain.appendChild(okButton);
genericDiv.append(promptMain);
viewer.append(genericDiv);
function promptNoFilesLeft(){
    var viewer = document.getElementById('viewer');
    let genericDiv = document.createElement("div");
    genericDiv.classList.add("genericPopup");
    var promptMain = document.createElement('div');
    promptMain.setAttribute("id", "prompt");     var message =  document.createElement('p');
    message.innerHTML = 'No images left to be fetched, Proceed to end session'; 
    var okButton = document.createElement('button');
    okButton.innerHTML = 'ok';
    okButton.onclick = function() {
    genericDiv.remove();
var DBdeleteRequest = window.indexedDB.deleteDatabase("ImageDatabase");
DBdeleteRequest.addEventListener('blocked', function(e) {
console.log("Database cleared.");
});
DBdeleteRequest.addEventListener('upgradeneeded', function(e) {
console.log("Upgrade needed in deleting database");
});
DBdeleteRequest.addEventListener('error', function(e) {
console.log("Error in deleting database");
});
DBdeleteRequest.addEventListener('success', function(e) {
console.log("Database cleared.");
});
sessionStorage.clear();
localStorage.clear();
logoutKeycloak();
        /*promptMain.style.display = 'none';*/
    };
    promptMain.appendChild(message);
    promptMain.appendChild(okButton);
    genericDiv.append(promptMain);
    viewer.append(genericDiv);
}
function getGfsFileName(contentDisposition) {
return contentDisposition.split("filename=")[1].replaceAll('"', '');
}
\ No newline at end of file
}
WebGde/WebContent/src/pdfviewer/pdfv.js
......@@ -188,24 +188,24 @@ var displayPdf = function(doc) {
fitContentButton.addEventListener('click', function() {
if (currentScale != fitScale) {
/*if (currentScale != fitScale) {
currentScale = fitScale;
renderPage(currentPage);
} else {
} else {*/
currentScale = 1.3;
renderPage(currentPage);
}
//}
});
document.addEventListener("keydown", function(e) {
if (e.shiftKey && e.key == 'F') {
if (currentScale != fitScale) {
currentScale = fitScale;
renderPage(currentPage);
} else {
// if (currentScale != fitScale) {
// currentScale = fitScale;
// renderPage(currentPage);
// } else {
currentScale = 1.3;
renderPage(currentPage);
}
// }
}
});
......
WebGde/WebContent/src/tiffViewer/tiffViewer.css
.tiffViewerContainer {
margin: auto;
height: calc(100% - 60px);
/* height: calc(100% - 60px); */
width: 70%;
position: relative;
display: block;
......
WebGde/WebContent/src/tiffViewer/tiffViewer.js
......@@ -107,6 +107,9 @@ function TIFFViewer(xhr, TiffViewerImageName) {
var editedwidth = 0,
editedheight = 0; //checker of width and height change
var initWidth = 100;
var widthHolder;
var hpercent = 0,
wpercent = 0; //set of percent increase or decrease per zoom
var hzoom = new Array(),
......@@ -351,7 +354,7 @@ let fileName = document.getElementById("TiffViewerImageName");
//setting the style per page
for (var j = 1; j <= TiffViewer_pages; j++) {
var img = document.getElementById(filenameWithoutExt + j);
getMeta(canvas, function(width, height) {
getMeta(canvas, function(width, height, img) {
wzoom[TiffViewer_current - 1] = changedwidth; /*ADDED: to fit large TIFF files*/
hzoom[TiffViewer_current - 1] = changedheight;
Edited();
......@@ -361,26 +364,29 @@ let fileName = document.getElementById("TiffViewerImageName");
setheight = height;
//to only display single page
if (setheight > 800 && setwidth > 1000) {
if (setheight > setwidth) {
// img.style = "width: 870px; height: 1160px";
img.style = "width: 900; height: 1200";
} else {
// img.style = "width: 800; height: 600";
//img.style = "width: 600; height: 800";
img.style = "width: 800; height: 600";
}
changed = true;
} else if (setwidth > 1000 && setheight <= 800) {
img.style = "width: 1000;";
changed = true;
} else if (setheight > 800 && setwidth <= 1000) {
img.style = "width: 800;";
changed = true;
} else {
img.style = `width: {setwidth}; height: {setheight}`;
changed = true;
}
// if (setheight > 800 && setwidth > 1000) {
// if (setheight > setwidth) {
// // img.style = "width: 870px; height: 1160px";
// img.style = "width: 900; height: 1200";
// } else {
// // img.style = "width: 800; height: 600";
// //img.style = "width: 600; height: 800";
// img.style = "width: 800; height: 600";
// }
// changed = true;
// } else if (setwidth > 1000 && setheight <= 800) {
// img.style = "width: 1000;";
// changed = true;
// } else if (setheight > 800 && setwidth <= 1000) {
// img.style = "width: 800;";
// changed = true;
// } else {
// img.style = `width: {setwidth}; height: {setheight}`;
// changed = true;
// }
img.style = `width: ${initWidth}%;`;
changed = true;
if (changed) {
if (TiffViewer_pages > 1) {
......@@ -396,15 +402,22 @@ let fileName = document.getElementById("TiffViewerImageName");
changedheight = setheight;
changedwidth = setwidth;
hpercent = (parseInt(setheight, 10) * (10 / 100));
wpercent = (parseInt(setwidth, 10) * (10 / 100));
// hpercent = (parseInt(setheight, 10) * (10 / 100));
// wpercent = (parseInt(setwidth, 10) * (10 / 100));
wpercent = 10;
hzoom.push(parseInt(setheight, 10));
wzoom.push(parseInt(setwidth, 10));
TiffViewer_scrn.style = `width: ${setwidth}; height: ${setheight};`;
document.getElementById("TiffViewer_FileContainer").style = `width: ${setwidth}; height: ${setheight};`;
TiffViewer_ImageContainer.style = `width: ${setwidth}; height: ${setheight};`;
// TiffViewer_scrn.style = `width: ${setwidth}; height: ${setheight};`;
// document.getElementById("TiffViewer_FileContainer").style = `width: ${setwidth}; height: ${setheight};`;
// TiffViewer_ImageContainer.style = `width: ${setwidth}; height: ${setheight};`;
TiffViewer_scrn.style = `width: ${initWidth}%;`;
document.getElementById("TiffViewer_FileContainer").style = `width: calc(${initWidth}% - 10px);`;
TiffViewer_ImageContainer.style = `width: ${initWidth}%;`;
});
checker.push(0);
flippedX.push(1);
......@@ -428,7 +441,7 @@ let fileName = document.getElementById("TiffViewerImageName");
var img = new Image();
img.src = url;
img.onload = function() {
callback(this.width, this.height);
callback(this.width, this.height, img);
}
}
......@@ -538,8 +551,10 @@ let fileName = document.getElementById("TiffViewerImageName");
})
function zoomIn() {
hzoom[TiffViewer_current - 1] += hpercent;
wzoom[TiffViewer_current - 1] += wpercent;
// hzoom[TiffViewer_current - 1] += hpercent;
// wzoom[TiffViewer_current - 1] += wpercent;
initWidth += wpercent;
document.getElementById("TiffViewer_FileContainer").style = `width: calc(${initWidth}% - 10px);`;
Edited();
};
......@@ -554,12 +569,15 @@ let fileName = document.getElementById("TiffViewerImageName");
})
function zoomOut() {
hzoom[TiffViewer_current - 1] -= hpercent;
wzoom[TiffViewer_current - 1] -= wpercent;
if ((setwidth + wzoom[TiffViewer_current - 1]) < wpercent && (setheight + hzoom[TiffViewer_current - 1]) < hpercent) {
hzoom[TiffViewer_current - 1] = hpercent - setheight;
wzoom[TiffViewer_current - 1] = wpercent - setwidth;
}
// hzoom[TiffViewer_current - 1] -= hpercent;
// wzoom[TiffViewer_current - 1] -= wpercent;
// if ((setwidth + wzoom[TiffViewer_current - 1]) < wpercent && (setheight + hzoom[TiffViewer_current - 1]) < hpercent) {
// hzoom[TiffViewer_current - 1] = hpercent - setheight;
// wzoom[TiffViewer_current - 1] = wpercent - setwidth;
// }
initWidth -= wpercent;
initWidth < 20 ? initWidth = 20 : initWidth;
document.getElementById("TiffViewer_FileContainer").style = `width: calc(${initWidth}% - 10px);`;
Edited();
};
......@@ -627,7 +645,8 @@ let fileName = document.getElementById("TiffViewerImageName");
function fitResize() {
var FitText = this.textContent || this.innerHTML;
document.getElementById("TiffViewer_ImageContainer").classList.remove("active");
if (FitText === "fc") {
/*if (FitText === "fc") {
setheight = origheight;
setwidth = origwidth;
wzoom[TiffViewer_current - 1] = origwidth;
......@@ -639,7 +658,10 @@ let fileName = document.getElementById("TiffViewerImageName");
wzoom[TiffViewer_current - 1] = changedwidth;
hzoom[TiffViewer_current - 1] = changedheight;
}
}*/
widthHolder = initWidth;
initWidth = 100;
document.getElementById("TiffViewer_FileContainer").style = `width: calc(${initWidth}% - 10px);`;
Edited();
}
......@@ -654,82 +676,76 @@ let fileName = document.getElementById("TiffViewerImageName");
if (rot[TiffViewer_current - 1] == 90 || rot[TiffViewer_current - 1] == 270 || rot[TiffViewer_current - 1] == -90 || rot[TiffViewer_current - 1] == -270) {
image.style = `
width: ${setwidth + wzoom[TiffViewer_current - 1]};
height: ${setheight + hzoom[TiffViewer_current - 1]};
width: 100%;
border: 0px groove white;
transform: rotate(${rot[TiffViewer_current - 1]}deg) scaleX(${flippedX[TiffViewer_current - 1]}) scaleY(${flippedY[TiffViewer_current - 1]});`;
image.style = `
width: ${setwidth + wzoom[TiffViewer_current - 1]};
height: ${setheight + hzoom[TiffViewer_current - 1]};
width: 100%;
border: 0px groove white;
-ms-transform: rotate(${rot[TiffViewer_current - 1]}deg) scaleX(${flippedX[TiffViewer_current - 1]}) scaleY(${flippedY[TiffViewer_current - 1]});`; // IE
image.style = `
width: ${setwidth + wzoom[TiffViewer_current - 1]};
height: ${setheight + hzoom[TiffViewer_current - 1]};
width: 100%;
border: 0px groove white;
-webkit-transform: rotate(${rot[TiffViewer_current - 1]}deg) scaleX(${flippedX[TiffViewer_current - 1]}) scaleY(${flippedY[TiffViewer_current - 1]});`; //Safari
TiffViewer_ImageContainer.style = `display: flex;
width: ${setheight};
height: ${setwidth};
position: relative;
justify-content: center;
align-items: center;`;
TiffViewer_Screen.style = `display: flex;
width: ${setheight};
height: ${setwidth};
position: relative;
justify-content: center;
align-items: center;`;
TiffViewer_imgclass.style = `display: flex;
width: ${(setheight + hzoom[TiffViewer_current - 1]) < setheight ? setheight : setheight + hzoom[TiffViewer_current - 1]};
height: ${(setwidth + wzoom[TiffViewer_current - 1]) < setwidth ? setwidth : setwidth + wzoom[TiffViewer_current - 1]};
position: relative;
justify-content: center;
align-items: center;`;
// TiffViewer_ImageContainer.style = `display: flex;
// width: ${setheight};
// height: ${setwidth};
// position: relative;
// justify-content: center;
// align-items: center;`;
// TiffViewer_Screen.style = `display: flex;
// width: ${setheight};
// height: ${setwidth};
// position: relative;
// justify-content: center;
// align-items: center;`;
// TiffViewer_imgclass.style = `display: flex;
// width: ${(setheight + hzoom[TiffViewer_current - 1]) < setheight ? setheight : setheight + hzoom[TiffViewer_current - 1]};
// height: ${(setwidth + wzoom[TiffViewer_current - 1]) < setwidth ? setwidth : setwidth + wzoom[TiffViewer_current - 1]};
// position: relative;
// justify-content: center;
// align-items: center;`;
width = TiffViewer_Screen.clientHeight;
height = TiffViewer_Screen.clientWidth;
} else {
image.style = `
width: ${setwidth + wzoom[TiffViewer_current - 1]};
height: ${setheight + hzoom[TiffViewer_current - 1]};
width: 100%;
border: 0px groove white;
transform: rotate(${rot[TiffViewer_current - 1]}deg) scaleX(${flippedX[TiffViewer_current - 1]}) scaleY(${flippedY[TiffViewer_current - 1]});`;
image.style = `
width: ${setwidth + wzoom[TiffViewer_current - 1]};
height: ${setheight + hzoom[TiffViewer_current - 1]};
width: 100%;
border: 0px groove white;
-ms-transform: rotate(${rot[TiffViewer_current - 1]}deg) scaleX(${flippedX[TiffViewer_current - 1]}) scaleY(${flippedY[TiffViewer_current - 1]});`; // IE
image.style = `
width: ${setwidth + wzoom[TiffViewer_current - 1]};
height: ${setheight + hzoom[TiffViewer_current - 1]};
width: 100%;
border: 0px groove white;
-webkit-transform: rotate(${rot[TiffViewer_current - 1]}deg) scaleX(${flippedX[TiffViewer_current - 1]}) scaleY(${flippedY[TiffViewer_current - 1]});`; //Safari
TiffViewer_ImageContainer.style = `display: flex;
width: ${setwidth};
height: ${setheight};
position: relative;
justify-content: center;
align-items: center;`;
TiffViewer_Screen.style = `display: flex;
width: ${setwidth};
height: ${setheight};
position: relative;
justify-content: center;
align-items: center;`;
TiffViewer_imgclass.style = `display: flex;
width: ${(setwidth + wzoom[TiffViewer_current - 1]) < setwidth ? setwidth : setwidth + wzoom[TiffViewer_current - 1]};
height: ${(setheight + hzoom[TiffViewer_current - 1]) < setheight ? setheight : setheight + hzoom[TiffViewer_current - 1]};
position: relative;
justify-content: center;
align-items: center;`;
// TiffViewer_ImageContainer.style = `display: flex;
// width: ${setwidth};
// height: ${setheight};
// position: relative;
// justify-content: center;
// align-items: center;`;
// TiffViewer_Screen.style = `display: flex;
// width: ${setwidth};
// height: ${setheight};
// position: relative;
// justify-content: center;
// align-items: center;`;
// TiffViewer_imgclass.style = `display: flex;
// width: ${(setwidth + wzoom[TiffViewer_current - 1]) < setwidth ? setwidth : setwidth + wzoom[TiffViewer_current - 1]};
// height: ${(setheight + hzoom[TiffViewer_current - 1]) < setheight ? setheight : setheight + hzoom[TiffViewer_current - 1]};
// position: relative;
// justify-content: center;
// align-items: center;`;
width = TiffViewer_Screen.clientWidth;
height = TiffViewer_Screen.clientHeight;
}
editedwidth = image.clientWidth;
editedheight = image.clientHeight;
let zoomPercentage = Math.round(100 + (hzoom[TiffViewer_current - 1] / setheight * 100));
zoom.innerHTML = zoomPercentage == 100 || isNaN(zoomPercentage) ? "" : zoomPercentage + "%";
// let zoomPercentage = Math.round(100 + (hzoom[TiffViewer_current - 1] / setheight * 100));
zoom.innerHTML = initWidth == 100 || isNaN(initWidth) ? "" : initWidth + "%";
// document.getElementById(`IMG${TiffViewer_current + 1}`).style.display = 'none';
// document.getElementById("IMG2").style.display = 'none';
......
WebGde/WebContent/style.css
......@@ -468,7 +468,6 @@ div#nextDivContainer {
}
#nextDiv {
z-index: 1;
background-color: #000000a1;
width: 35px;
display: flex;
......
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