feat(pdfjs-viewer): enhance form viewer with print functionality and XFA support
Added a print button to the PDF viewer for direct printing. Implemented a scripting manager to handle XFA forms, ensuring proper rendering and interaction. Updated form-filler logic to support XFA detection and improved error handling for unsupported save operations. Refactored file handling to streamline PDF loading and viewer initialization.
This commit is contained in:
abdullahalam123
@@ -24,6 +24,17 @@ import * as pdfjsLib from 'pdfjs-dist';
|
||||
async function handleSinglePdfUpload(toolId, file) {
|
||||
showLoader('Loading PDF...');
|
||||
try {
|
||||
// pdf-lib does not support XFA, so we let pdf.js render it
|
||||
if (toolId === 'form-filler') {
|
||||
hideLoader();
|
||||
|
||||
const logic = toolLogic[toolId];
|
||||
if (logic && logic.setup) {
|
||||
await logic.setup();
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
const pdfBytes = await readFileAsArrayBuffer(file);
|
||||
state.pdfDoc = await PDFLibDocument.load(pdfBytes as ArrayBuffer, {
|
||||
ignoreEncryption: true,
|
||||
@@ -502,89 +513,89 @@ async function handleMultiFileUpload(toolId) {
|
||||
toolLogic.merge.setup();
|
||||
} else if (toolId === 'alternate-merge') {
|
||||
toolLogic['alternate-merge'].setup();
|
||||
} else if (toolId === 'image-to-pdf') {
|
||||
const imageList = document.getElementById('image-list');
|
||||
imageList.textContent = '';
|
||||
state.files.forEach((file) => {
|
||||
const url = URL.createObjectURL(file);
|
||||
const li = document.createElement('li');
|
||||
li.className = 'relative group cursor-move';
|
||||
li.dataset.fileName = file.name;
|
||||
} else if (toolId === 'image-to-pdf') {
|
||||
const imageList = document.getElementById('image-list');
|
||||
imageList.textContent = '';
|
||||
state.files.forEach((file) => {
|
||||
const url = URL.createObjectURL(file);
|
||||
const li = document.createElement('li');
|
||||
li.className = 'relative group cursor-move';
|
||||
li.dataset.fileName = file.name;
|
||||
|
||||
const wrapper = document.createElement('div');
|
||||
wrapper.className = 'w-full h-36 sm:h-40 md:h-44 bg-gray-900 rounded-md border-2 border-gray-600 flex items-center justify-center overflow-hidden';
|
||||
const wrapper = document.createElement('div');
|
||||
wrapper.className = 'w-full h-36 sm:h-40 md:h-44 bg-gray-900 rounded-md border-2 border-gray-600 flex items-center justify-center overflow-hidden';
|
||||
|
||||
const img = document.createElement('img');
|
||||
img.src = url;
|
||||
img.className = 'max-w-full max-h-full object-contain';
|
||||
const img = document.createElement('img');
|
||||
img.src = url;
|
||||
img.className = 'max-w-full max-h-full object-contain';
|
||||
|
||||
const p = document.createElement('p');
|
||||
p.className =
|
||||
'absolute bottom-0 left-0 right-0 bg-black bg-opacity-50 text-white text-xs text-center truncate p-1';
|
||||
p.textContent = file.name;
|
||||
const p = document.createElement('p');
|
||||
p.className =
|
||||
'absolute bottom-0 left-0 right-0 bg-black bg-opacity-50 text-white text-xs text-center truncate p-1';
|
||||
p.textContent = file.name;
|
||||
|
||||
wrapper.appendChild(img);
|
||||
li.append(wrapper, p);
|
||||
imageList.appendChild(li);
|
||||
});
|
||||
wrapper.appendChild(img);
|
||||
li.append(wrapper, p);
|
||||
imageList.appendChild(li);
|
||||
});
|
||||
|
||||
Sortable.create(imageList);
|
||||
// Show image-to-pdf options and wire up slider text
|
||||
const opts = document.getElementById('image-to-pdf-options');
|
||||
if (opts) {
|
||||
opts.classList.remove('hidden');
|
||||
const slider = document.getElementById('image-pdf-quality') as HTMLInputElement;
|
||||
const value = document.getElementById('image-pdf-quality-value');
|
||||
if (slider && value) {
|
||||
const update = () => (value.textContent = `${Math.round(parseFloat(slider.value) * 100)}%`);
|
||||
slider.addEventListener('input', update);
|
||||
update();
|
||||
}
|
||||
Sortable.create(imageList);
|
||||
// Show image-to-pdf options and wire up slider text
|
||||
const opts = document.getElementById('image-to-pdf-options');
|
||||
if (opts) {
|
||||
opts.classList.remove('hidden');
|
||||
const slider = document.getElementById('image-pdf-quality') as HTMLInputElement;
|
||||
const value = document.getElementById('image-pdf-quality-value');
|
||||
if (slider && value) {
|
||||
const update = () => (value.textContent = `${Math.round(parseFloat(slider.value) * 100)}%`);
|
||||
slider.addEventListener('input', update);
|
||||
update();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (toolId === 'pdf-to-jpg') {
|
||||
const qualitySlider = document.getElementById('jpg-quality') as HTMLInputElement;
|
||||
const qualityValue = document.getElementById('jpg-quality-value');
|
||||
if (qualitySlider && qualityValue) {
|
||||
const updateValue = () => {
|
||||
qualityValue.textContent = `${Math.round(parseFloat(qualitySlider.value) * 100)}%`;
|
||||
};
|
||||
qualitySlider.addEventListener('input', updateValue);
|
||||
updateValue();
|
||||
}
|
||||
if (toolId === 'pdf-to-jpg') {
|
||||
const qualitySlider = document.getElementById('jpg-quality') as HTMLInputElement;
|
||||
const qualityValue = document.getElementById('jpg-quality-value');
|
||||
if (qualitySlider && qualityValue) {
|
||||
const updateValue = () => {
|
||||
qualityValue.textContent = `${Math.round(parseFloat(qualitySlider.value) * 100)}%`;
|
||||
};
|
||||
qualitySlider.addEventListener('input', updateValue);
|
||||
updateValue();
|
||||
}
|
||||
}
|
||||
|
||||
if (toolId === 'pdf-to-png') {
|
||||
const qualitySlider = document.getElementById('png-quality') as HTMLInputElement;
|
||||
const qualityValue = document.getElementById('png-quality-value');
|
||||
if (qualitySlider && qualityValue) {
|
||||
const updateValue = () => {
|
||||
qualityValue.textContent = `${qualitySlider.value}x`;
|
||||
};
|
||||
qualitySlider.addEventListener('input', updateValue);
|
||||
updateValue();
|
||||
}
|
||||
if (toolId === 'pdf-to-png') {
|
||||
const qualitySlider = document.getElementById('png-quality') as HTMLInputElement;
|
||||
const qualityValue = document.getElementById('png-quality-value');
|
||||
if (qualitySlider && qualityValue) {
|
||||
const updateValue = () => {
|
||||
qualityValue.textContent = `${qualitySlider.value}x`;
|
||||
};
|
||||
qualitySlider.addEventListener('input', updateValue);
|
||||
updateValue();
|
||||
}
|
||||
}
|
||||
|
||||
if (toolId === 'pdf-to-webp') {
|
||||
const qualitySlider = document.getElementById('webp-quality') as HTMLInputElement;
|
||||
const qualityValue = document.getElementById('webp-quality-value');
|
||||
if (qualitySlider && qualityValue) {
|
||||
const updateValue = () => {
|
||||
qualityValue.textContent = `${Math.round(parseFloat(qualitySlider.value) * 100)}%`;
|
||||
};
|
||||
qualitySlider.addEventListener('input', updateValue);
|
||||
updateValue();
|
||||
}
|
||||
if (toolId === 'pdf-to-webp') {
|
||||
const qualitySlider = document.getElementById('webp-quality') as HTMLInputElement;
|
||||
const qualityValue = document.getElementById('webp-quality-value');
|
||||
if (qualitySlider && qualityValue) {
|
||||
const updateValue = () => {
|
||||
qualityValue.textContent = `${Math.round(parseFloat(qualitySlider.value) * 100)}%`;
|
||||
};
|
||||
qualitySlider.addEventListener('input', updateValue);
|
||||
updateValue();
|
||||
}
|
||||
}
|
||||
|
||||
if (toolId === 'jpg-to-pdf' || toolId === 'png-to-pdf') {
|
||||
const optionsDiv = document.getElementById(`${toolId}-options`);
|
||||
if (optionsDiv) {
|
||||
optionsDiv.classList.remove('hidden');
|
||||
}
|
||||
if (toolId === 'jpg-to-pdf' || toolId === 'png-to-pdf') {
|
||||
const optionsDiv = document.getElementById(`${toolId}-options`);
|
||||
if (optionsDiv) {
|
||||
optionsDiv.classList.remove('hidden');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function setupFileInputHandler(toolId) {
|
||||
|
||||
Reference in New Issue
Block a user