djoka/bentopdf
1
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

feat(pdf-to-webp): direct download resulting image and adjust filename

Browse Source
This commit is contained in:
Sebastian Espei
2025-12-01 00:56:14 +01:00
parent 30b16a6bf1
commit 33ebcf4479
2 changed files with 39 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/js/logic/pdf-to-webp.ts
View File

@@ -3,6 +3,7 @@ import { downloadFile, readFileAsArrayBuffer, getPDFDocument } from '../utils/he
import { state } from '../state.js';
import JSZip from 'jszip';
import * as pdfjsLib from 'pdfjs-dist';
import { PDFPageProxy } from 'pdfjs-dist';
pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
@@ -13,25 +14,21 @@ export async function pdfToWebp() {
const pdf = await getPDFDocument(
await readFileAsArrayBuffer(state.files[0])
).promise;
const zip = new JSZip();
for (let i = 1; i <= pdf.numPages; i++) {
const page = await pdf.getPage(i);
const viewport = page.getViewport({ scale: 2.0 });
const canvas = document.createElement('canvas');
canvas.height = viewport.height;
canvas.width = viewport.width;
const context = canvas.getContext('2d');
await page.render({ canvasContext: context, viewport: viewport, canvas }).promise;
const qualityInput = document.getElementById('webp-quality') as HTMLInputElement;
const quality = qualityInput ? parseFloat(qualityInput.value) : 0.9;
const blob = await new Promise((resolve) =>
canvas.toBlob(resolve, 'image/webp', quality)
);
zip.file(`page_${i}.webp`, blob as Blob);
if(pdf.numPages === 1) {
const page = await pdf.getPage(1);
const blob = await pageToBlob(page);
downloadFile(blob, getCleanFilename(state.files[0].name) + '.webp');
} else {
const zip = new JSZip();
for (let i = 1; i <= pdf.numPages; i++) {
const page = await pdf.getPage(i);
const blob = await pageToBlob(page);
zip.file(`page_${i}.webp`, blob as Blob);
}
const zipBlob = await zip.generateAsync({ type: 'blob' });
downloadFile(zipBlob, getCleanFilename(state.files[0].name) + '_webps.zip');
}
const zipBlob = await zip.generateAsync({ type: 'blob' });
downloadFile(zipBlob, 'converted_webp.zip');
} catch (e) {
console.error(e);
showAlert('Error', 'Failed to convert PDF to WebP.');
@@ -39,3 +36,27 @@ export async function pdfToWebp() {
hideLoader();
}
}
async function pageToBlob(page: PDFPageProxy): Promise<Blob> {
const viewport = page.getViewport({ scale: 2.0 });
const canvas = document.createElement('canvas');
canvas.height = viewport.height;
canvas.width = viewport.width;
const context = canvas.getContext('2d');
await page.render({ canvasContext: context, viewport: viewport, canvas }).promise;
const qualityInput = document.getElementById('webp-quality') as HTMLInputElement;
const quality = qualityInput ? parseFloat(qualityInput.value) : 0.9;
const blob = await new Promise((resolve) =>
canvas.toBlob(resolve, 'image/webp', quality)
);
return blob as Blob;
}
function getCleanFilename(fileName: string): string {
let clean = fileName.replace(/\.pdf$/i, '').trim();
if (clean.length > 80) {
clean = clean.slice(0, 80);
}
return clean;
}