@progress/kendo-pdfviewer-common 0.6.0-develop.1 → 0.6.1-develop.1

package/dist/es/utils.js

@@ -68,7 +68,9 @@ export const download = (options, fileName = 'Document', saveOptions = {}, onDow
     if (options.pdf) {
         options.pdf
             .getData()
-            .then((data) => new Blob([data], { type: 'application/pdf' }))
+            .then((data) => 
+        // @ts-ignore
+        new Blob([data], { type: 'application/pdf' }))
             .then((blob) => {
             if (!onDownload(blob, fileName, saveOptions)) {
                 saveAs(blob, fileName, saveOptions);

package/dist/es/widget/page.js

@@ -163,8 +163,8 @@ export class Page extends Component {
         const canvas = this.canvasForPrint;
         const printContentLoadPromise = this.createPromise();
         const printContent = new Image();
-        const pageHeight = canvas.height;
-        const pageWidth = canvas.width;
+        const pageHeight = (canvas.height / this.pdfViewer.getPrintScale()) * this.pdfViewer.getPdfToCssUnits();
+        const pageWidth = (canvas.width / this.pdfViewer.getPrintScale()) * this.pdfViewer.getPdfToCssUnits();
         printContent.src = canvas.toDataURL();
         printContent.width = pageWidth;
         printContent.height = pageHeight;
@@ -210,11 +210,8 @@ export class Page extends Component {
     renderForPrintAsync() {
         var _a, _b;
         const printUnits = this.pdfViewer.getPrintUnits();
-        // this is how pdf.js prints
-        const printScale = 1;
-        const { canvasContext, canvas } = this.pdfViewer.createPageElements({
+        const { canvasContext, canvas, viewport } = this.pdfViewer.createPageElements({
             pdfPage: this.pdfPage,
-            zoom: printScale,
             printUnits
         });
         this.canvasForPrint = canvas;
@@ -226,8 +223,7 @@ export class Page extends Component {
         });
         const renderContext = {
             canvasContext: canvasContext,
-            transform: [printUnits, 0, 0, printUnits, 0, 0],
-            viewport: this.pdfPage.getViewport({ scale: printScale, rotation: this.viewport.rotation }),
+            viewport: viewport,
             intent: "print",
             annotationMode: AnnotationMode.ENABLE_STORAGE,
             optionalContentConfigPromise,

package/dist/es/widget/pdfviewer.js

@@ -59,8 +59,8 @@ export class PdfViewer extends Component {
             pageChangeScrollThreshold: 0.85,
             // values higher than 200ms can result in browser zoom
             pageWheelThrottleDelay: 200,
-            // ported from pdf.js
-            printResolution: 100,
+            // the print scale that is used for controlling the print quality
+            printScale: 3,
             // the render scale that is used for controlling the render quality
             renderScale: 3,
             loadOnDemand: false,
@@ -338,7 +338,20 @@ export class PdfViewer extends Component {
         return __classPrivateFieldGet(this, _PdfViewer_annotationMode, "f");
     }
     getPrintUnits() {
-        return this.options.printResolution / PixelsPerInch.PDF;
+        return this.getPrintScale();
+    }
+    getPdfToCssUnits() {
+        return PixelsPerInch.PDF_TO_CSS_UNITS;
+    }
+    getPrintScale() {
+        return this.getPrintResolution() / PixelsPerInch.PDF;
+    }
+    getPrintResolution() {
+        // the default is 150 in pdf.js, we use 300 to have better DPI by default
+        return 100 * this.options.printScale;
+    }
+    getRenderScale() {
+        return getScale(this.options.renderScale);
     }
     extendOptions(options) {
         this.options = deepExtend(this.options, options);
@@ -752,9 +765,9 @@ export class PdfViewer extends Component {
         if (zoom <= 0) {
             return;
         }
-        let scaleNum = getScale(this.options.renderScale);
+        let scaleNum = this.getRenderScale();
         if (printUnits) {
-            scaleNum = zoom || scaleNum;
+            scaleNum = this.getPrintScale();
         }
         // changing the viewport dimensions here requires changes in
         // page.getPrintContentAsync for the printing dimensions
@@ -769,17 +782,22 @@ export class PdfViewer extends Component {
             height: `round(var(--scale-factor) * ${viewport.height / scaleNum}px, 1px)`
         };
         const pageElement = createElement("div", "k-page", styles);
-        const canvas = createElement("canvas", '', {
-            width: "100%",
-            height: "100%"
-        });
+        const canvas = createElement("canvas", '', {});
         canvas.height = adjustedHeight;
         canvas.width = adjustedWidth;
         if (printUnits) {
-            canvas.width = Math.floor(canvas.width * (printUnits || 1));
-            canvas.height = Math.floor(canvas.height * (printUnits || 1));
+            canvas.style.width = `${viewport.width / scaleNum}px`;
+            canvas.style.height = `${viewport.height / scaleNum}px`;
+        }
+        else {
+            canvas.style.width = "100%";
+            canvas.style.height = "100%";
         }
         const canvasContext = canvas.getContext("2d");
+        if (printUnits) {
+            // aim for crisp pixels when printing
+            canvasContext.imageSmoothingEnabled = false;
+        }
         const canvasWrapper = convertToHtml(`
             <div class="${this.options.elementSelectors.pageCanvasWrapper}"></div>
         `);
@@ -940,6 +958,7 @@ export class PdfViewer extends Component {
                 if (!data) {
                     return;
                 }
+                // @ts-ignore
                 return new Blob([data], { type: 'application/pdf' });
             })
                 .then((blob) => {
@@ -1175,8 +1194,8 @@ export class PdfViewer extends Component {
     }
     openPrintDialog() {
         const pages = this.pages;
-        const width = pages[0].rawWidth * this.getPrintUnits();
-        const height = pages[0].rawHeight * this.getPrintUnits();
+        const width = pages[0].rawWidth * this.getPdfToCssUnits();
+        const height = pages[0].rawHeight * this.getPdfToCssUnits();
         const printDialog = window.open('', '', 'innerWidth=' + width + ',innerHeight=' + height + 'location=no,titlebar=no,toolbar=no');
         if (!printDialog || !printDialog.document) {
             this.triggerError({
@@ -1195,7 +1214,6 @@ export class PdfViewer extends Component {
         printDialog.print();
         // setTimeout(() => {
         // printDialog.print();
-        // done();
         // });
     }
     cacheZoomLevelBeforePrint() {

package/dist/es2015/utils.js

@@ -68,7 +68,9 @@ export const download = (options, fileName = 'Document', saveOptions = {}, onDow
     if (options.pdf) {
         options.pdf
             .getData()
-            .then((data) => new Blob([data], { type: 'application/pdf' }))
+            .then((data) => 
+        // @ts-ignore
+        new Blob([data], { type: 'application/pdf' }))
             .then((blob) => {
             if (!onDownload(blob, fileName, saveOptions)) {
                 saveAs(blob, fileName, saveOptions);

package/dist/es2015/widget/page.js

@@ -163,8 +163,8 @@ export class Page extends Component {
         const canvas = this.canvasForPrint;
         const printContentLoadPromise = this.createPromise();
         const printContent = new Image();
-        const pageHeight = canvas.height;
-        const pageWidth = canvas.width;
+        const pageHeight = (canvas.height / this.pdfViewer.getPrintScale()) * this.pdfViewer.getPdfToCssUnits();
+        const pageWidth = (canvas.width / this.pdfViewer.getPrintScale()) * this.pdfViewer.getPdfToCssUnits();
         printContent.src = canvas.toDataURL();
         printContent.width = pageWidth;
         printContent.height = pageHeight;
@@ -210,11 +210,8 @@ export class Page extends Component {
     renderForPrintAsync() {
         var _a, _b;
         const printUnits = this.pdfViewer.getPrintUnits();
-        // this is how pdf.js prints
-        const printScale = 1;
-        const { canvasContext, canvas } = this.pdfViewer.createPageElements({
+        const { canvasContext, canvas, viewport } = this.pdfViewer.createPageElements({
             pdfPage: this.pdfPage,
-            zoom: printScale,
             printUnits
         });
         this.canvasForPrint = canvas;
@@ -226,8 +223,7 @@ export class Page extends Component {
         });
         const renderContext = {
             canvasContext: canvasContext,
-            transform: [printUnits, 0, 0, printUnits, 0, 0],
-            viewport: this.pdfPage.getViewport({ scale: printScale, rotation: this.viewport.rotation }),
+            viewport: viewport,
             intent: "print",
             annotationMode: AnnotationMode.ENABLE_STORAGE,
             optionalContentConfigPromise,

package/dist/es2015/widget/pdfviewer.js

@@ -59,8 +59,8 @@ export class PdfViewer extends Component {
             pageChangeScrollThreshold: 0.85,
             // values higher than 200ms can result in browser zoom
             pageWheelThrottleDelay: 200,
-            // ported from pdf.js
-            printResolution: 100,
+            // the print scale that is used for controlling the print quality
+            printScale: 3,
             // the render scale that is used for controlling the render quality
             renderScale: 3,
             loadOnDemand: false,
@@ -338,7 +338,20 @@ export class PdfViewer extends Component {
         return __classPrivateFieldGet(this, _PdfViewer_annotationMode, "f");
     }
     getPrintUnits() {
-        return this.options.printResolution / PixelsPerInch.PDF;
+        return this.getPrintScale();
+    }
+    getPdfToCssUnits() {
+        return PixelsPerInch.PDF_TO_CSS_UNITS;
+    }
+    getPrintScale() {
+        return this.getPrintResolution() / PixelsPerInch.PDF;
+    }
+    getPrintResolution() {
+        // the default is 150 in pdf.js, we use 300 to have better DPI by default
+        return 100 * this.options.printScale;
+    }
+    getRenderScale() {
+        return getScale(this.options.renderScale);
     }
     extendOptions(options) {
         this.options = deepExtend(this.options, options);
@@ -752,9 +765,9 @@ export class PdfViewer extends Component {
         if (zoom <= 0) {
             return;
         }
-        let scaleNum = getScale(this.options.renderScale);
+        let scaleNum = this.getRenderScale();
         if (printUnits) {
-            scaleNum = zoom || scaleNum;
+            scaleNum = this.getPrintScale();
         }
         // changing the viewport dimensions here requires changes in
         // page.getPrintContentAsync for the printing dimensions
@@ -769,17 +782,22 @@ export class PdfViewer extends Component {
             height: `round(var(--scale-factor) * ${viewport.height / scaleNum}px, 1px)`
         };
         const pageElement = createElement("div", "k-page", styles);
-        const canvas = createElement("canvas", '', {
-            width: "100%",
-            height: "100%"
-        });
+        const canvas = createElement("canvas", '', {});
         canvas.height = adjustedHeight;
         canvas.width = adjustedWidth;
         if (printUnits) {
-            canvas.width = Math.floor(canvas.width * (printUnits || 1));
-            canvas.height = Math.floor(canvas.height * (printUnits || 1));
+            canvas.style.width = `${viewport.width / scaleNum}px`;
+            canvas.style.height = `${viewport.height / scaleNum}px`;
+        }
+        else {
+            canvas.style.width = "100%";
+            canvas.style.height = "100%";
         }
         const canvasContext = canvas.getContext("2d");
+        if (printUnits) {
+            // aim for crisp pixels when printing
+            canvasContext.imageSmoothingEnabled = false;
+        }
         const canvasWrapper = convertToHtml(`
             <div class="${this.options.elementSelectors.pageCanvasWrapper}"></div>
         `);
@@ -940,6 +958,7 @@ export class PdfViewer extends Component {
                 if (!data) {
                     return;
                 }
+                // @ts-ignore
                 return new Blob([data], { type: 'application/pdf' });
             })
                 .then((blob) => {
@@ -1175,8 +1194,8 @@ export class PdfViewer extends Component {
     }
     openPrintDialog() {
         const pages = this.pages;
-        const width = pages[0].rawWidth * this.getPrintUnits();
-        const height = pages[0].rawHeight * this.getPrintUnits();
+        const width = pages[0].rawWidth * this.getPdfToCssUnits();
+        const height = pages[0].rawHeight * this.getPdfToCssUnits();
         const printDialog = window.open('', '', 'innerWidth=' + width + ',innerHeight=' + height + 'location=no,titlebar=no,toolbar=no');
         if (!printDialog || !printDialog.document) {
             this.triggerError({
@@ -1195,7 +1214,6 @@ export class PdfViewer extends Component {
         printDialog.print();
         // setTimeout(() => {
         // printDialog.print();
-        // done();
         // });
     }
     cacheZoomLevelBeforePrint() {

package/dist/npm/utils.js

@@ -74,7 +74,9 @@ const download = (options, fileName = 'Document', saveOptions = {}, onDownload)
     if (options.pdf) {
         options.pdf
             .getData()
-            .then((data) => new Blob([data], { type: 'application/pdf' }))
+            .then((data) => 
+        // @ts-ignore
+        new Blob([data], { type: 'application/pdf' }))
             .then((blob) => {
             if (!onDownload(blob, fileName, saveOptions)) {
                 (0, kendo_file_saver_1.saveAs)(blob, fileName, saveOptions);

package/dist/npm/widget/page.js

@@ -163,8 +163,8 @@ class Page extends component_1.Component {
         const canvas = this.canvasForPrint;
         const printContentLoadPromise = this.createPromise();
         const printContent = new Image();
-        const pageHeight = canvas.height;
-        const pageWidth = canvas.width;
+        const pageHeight = (canvas.height / this.pdfViewer.getPrintScale()) * this.pdfViewer.getPdfToCssUnits();
+        const pageWidth = (canvas.width / this.pdfViewer.getPrintScale()) * this.pdfViewer.getPdfToCssUnits();
         printContent.src = canvas.toDataURL();
         printContent.width = pageWidth;
         printContent.height = pageHeight;
@@ -210,11 +210,8 @@ class Page extends component_1.Component {
     renderForPrintAsync() {
         var _a, _b;
         const printUnits = this.pdfViewer.getPrintUnits();
-        // this is how pdf.js prints
-        const printScale = 1;
-        const { canvasContext, canvas } = this.pdfViewer.createPageElements({
+        const { canvasContext, canvas, viewport } = this.pdfViewer.createPageElements({
             pdfPage: this.pdfPage,
-            zoom: printScale,
             printUnits
         });
         this.canvasForPrint = canvas;
@@ -226,8 +223,7 @@ class Page extends component_1.Component {
         });
         const renderContext = {
             canvasContext: canvasContext,
-            transform: [printUnits, 0, 0, printUnits, 0, 0],
-            viewport: this.pdfPage.getViewport({ scale: printScale, rotation: this.viewport.rotation }),
+            viewport: viewport,
             intent: "print",
             annotationMode: pdf_mjs_1.AnnotationMode.ENABLE_STORAGE,
             optionalContentConfigPromise,

package/dist/npm/widget/pdfviewer.d.ts

@@ -41,6 +41,10 @@ export declare class PdfViewer extends Component {
     set annotationEditorMode({ mode, editId, isFromKeyboard }: any);
     getAnnotationMode(): number;
     getPrintUnits(): number;
+    getPdfToCssUnits(): number;
+    getPrintScale(): number;
+    getPrintResolution(): number;
+    getRenderScale(): number;
     extendOptions(options: any): void;
     setOptions(options: any): void;
     bindEvents(): void;

package/dist/npm/widget/pdfviewer.js

@@ -62,8 +62,8 @@ class PdfViewer extends main_1.Component {
             pageChangeScrollThreshold: 0.85,
             // values higher than 200ms can result in browser zoom
             pageWheelThrottleDelay: 200,
-            // ported from pdf.js
-            printResolution: 100,
+            // the print scale that is used for controlling the print quality
+            printScale: 3,
             // the render scale that is used for controlling the render quality
             renderScale: 3,
             loadOnDemand: false,
@@ -341,7 +341,20 @@ class PdfViewer extends main_1.Component {
         return tslib_1.__classPrivateFieldGet(this, _PdfViewer_annotationMode, "f");
     }
     getPrintUnits() {
-        return this.options.printResolution / pdf_mjs_1.PixelsPerInch.PDF;
+        return this.getPrintScale();
+    }
+    getPdfToCssUnits() {
+        return pdf_mjs_1.PixelsPerInch.PDF_TO_CSS_UNITS;
+    }
+    getPrintScale() {
+        return this.getPrintResolution() / pdf_mjs_1.PixelsPerInch.PDF;
+    }
+    getPrintResolution() {
+        // the default is 150 in pdf.js, we use 300 to have better DPI by default
+        return 100 * this.options.printScale;
+    }
+    getRenderScale() {
+        return (0, utils_1.scale)(this.options.renderScale);
     }
     extendOptions(options) {
         this.options = (0, main_1.deepExtend)(this.options, options);
@@ -755,9 +768,9 @@ class PdfViewer extends main_1.Component {
         if (zoom <= 0) {
             return;
         }
-        let scaleNum = (0, utils_1.scale)(this.options.renderScale);
+        let scaleNum = this.getRenderScale();
         if (printUnits) {
-            scaleNum = zoom || scaleNum;
+            scaleNum = this.getPrintScale();
         }
         // changing the viewport dimensions here requires changes in
         // page.getPrintContentAsync for the printing dimensions
@@ -772,17 +785,22 @@ class PdfViewer extends main_1.Component {
             height: `round(var(--scale-factor) * ${viewport.height / scaleNum}px, 1px)`
         };
         const pageElement = (0, utils_1.createElement)("div", "k-page", styles);
-        const canvas = (0, utils_1.createElement)("canvas", '', {
-            width: "100%",
-            height: "100%"
-        });
+        const canvas = (0, utils_1.createElement)("canvas", '', {});
         canvas.height = adjustedHeight;
         canvas.width = adjustedWidth;
         if (printUnits) {
-            canvas.width = Math.floor(canvas.width * (printUnits || 1));
-            canvas.height = Math.floor(canvas.height * (printUnits || 1));
+            canvas.style.width = `${viewport.width / scaleNum}px`;
+            canvas.style.height = `${viewport.height / scaleNum}px`;
+        }
+        else {
+            canvas.style.width = "100%";
+            canvas.style.height = "100%";
         }
         const canvasContext = canvas.getContext("2d");
+        if (printUnits) {
+            // aim for crisp pixels when printing
+            canvasContext.imageSmoothingEnabled = false;
+        }
         const canvasWrapper = (0, main_1.convertToHtml)(`
             <div class="${this.options.elementSelectors.pageCanvasWrapper}"></div>
         `);
@@ -943,6 +961,7 @@ class PdfViewer extends main_1.Component {
                 if (!data) {
                     return;
                 }
+                // @ts-ignore
                 return new Blob([data], { type: 'application/pdf' });
             })
                 .then((blob) => {
@@ -1178,8 +1197,8 @@ class PdfViewer extends main_1.Component {
     }
     openPrintDialog() {
         const pages = this.pages;
-        const width = pages[0].rawWidth * this.getPrintUnits();
-        const height = pages[0].rawHeight * this.getPrintUnits();
+        const width = pages[0].rawWidth * this.getPdfToCssUnits();
+        const height = pages[0].rawHeight * this.getPdfToCssUnits();
         const printDialog = window.open('', '', 'innerWidth=' + width + ',innerHeight=' + height + 'location=no,titlebar=no,toolbar=no');
         if (!printDialog || !printDialog.document) {
             this.triggerError({
@@ -1198,7 +1217,6 @@ class PdfViewer extends main_1.Component {
         printDialog.print();
         // setTimeout(() => {
         // printDialog.print();
-        // done();
         // });
     }
     cacheZoomLevelBeforePrint() {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-pdfviewer-common",
   "description": "Kendo UI TypeScript package exporting functions for PDFViewer component",
-  "version": "0.6.0-develop.1",
+  "version": "0.6.1-develop.1",
   "keywords": [
     "Kendo UI"
   ],