@@ -171,6 +178,7 @@ import {
pdfjsLib.GlobalWorkerOptions.workerSrc = "pdfjs-dist/build/pdf.worker.mjs";
+const multiPage: Ref = ref(true);
const modalOpen: Ref = ref(false);
const loading: Ref = ref(false);
const adding: Ref = ref(false);
@@ -198,13 +206,24 @@ const mountPdf = async (url: string) => {
const loadingTask = pdfjsLib.getDocument(url);
pdf = await loadingTask.promise;
pageCount.value = pdf.numPages;
- await setPage(1);
+ if (multiPage.value) {
+ await setAllPages();
+ } else {
+ await setPage(1);
+ }
};
const getRenderContext = (pdfPage: PDFPageProxy) => {
const scale = 1;
const viewport = pdfPage.getViewport({ scale });
- const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
+ let canvas;
+ if (multiPage.value) {
+ canvas = document.getElementById(
+ `canvas-${pdfPage.pageNumber}`
+ ) as HTMLCanvasElement;
+ } else {
+ canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
+ }
const context = canvas.getContext("2d") as CanvasRenderingContext2D;
canvas.height = viewport.height;
canvas.width = viewport.width;
@@ -215,6 +234,9 @@ const getRenderContext = (pdfPage: PDFPageProxy) => {
};
};
+const setAllPages = async () =>
+ Array.from(Array(pageCount.value).keys()).map((p) => setPage(p + 1));
+
const setPage = async (page: number) => {
const pdfPage = await pdf.getPage(page);
const renderContext = getRenderContext(pdfPage);
@@ -515,7 +537,7 @@ downloadAndOpen();