Sync PDF preview and signature positioning (qualified -> official)

See issues #12 and #14

rollup.config.js

@@ -256,7 +256,7 @@ Dependencies:
                 {src: 'node_modules/vpu-common/src/spinner.js', dest: 'dist/local/' + pkg.name, rename: 'spinner.js'},
                 {src: 'node_modules/vpu-common/misc/browser-check.js', dest: 'dist/local/' + pkg.name, rename: 'browser-check.js'},
                 {src: 'assets/icon-*.png', dest: 'dist/local/' + pkg.name},
-                {src: 'assets/signature-placeholder.png', dest: 'dist/local/' + pkg.name},
+                {src: 'assets/*-placeholder.png', dest: 'dist/local/' + pkg.name},
                 {src: 'assets/manifest.json', dest: 'dist', rename: pkg.name + '.manifest.json'},
                 {src: 'assets/*.metadata.json', dest: 'dist'},
                 {src: 'node_modules/vpu-common/assets/icons/*.svg', dest: 'dist/local/vpu-common/icons'},

src/i18n/de/translation.json

@@ -2,6 +2,22 @@
   "official-pdf-upload": {
     "upload-field-label": "PDF-Dokumente zum Signieren hochladen",
     "upload-area-text": "Sie können in diesem Bereich PDF-Dokumente per Drag & Drop oder per Direktauswahl hochladen",
+    "current-signing-process-label": "Aktueller Signaturprozess",
+    "queued-files-label": "Dokumente in der Warteschlange",
+    "queued-files-empty1": "Kein Dokument in der Warteschlange",
+    "queued-files-empty2": "Sie können jetzt ein neues Dokument hochladen",
+    "remove-failed-file-button-title": "Fehlgeschlagenes Dokument entfernen",
+    "remove-queued-file-button-title": "Dokument aus der Warteschlange entfernen",
+    "clear-all": "Alle entfernen",
+    "start-signing-process-button": "Signatur starten",
+    "stop-signing-process-button": "Signieren unterbrechen",
+    "show-preview": "Dokument anzeigen",
+    "positioning-automatic": "Automatisch",
+    "positioning-manual": "Manuell",
+    "close-preview": "Dokumentansicht schließen",
+    "preview-label": "Dokumentenansicht",
+    "start-signing-process-button-running-title": "Signaturvorgang läuft gerade",
+    "remove-current-file-button-title": "Aktuellen Signaturprozess abbrechen",
     "signed-files-label": "Signierte Dokumente",
     "download-zip-button": "Als ZIP Datei herunterladen",
     "download-zip-button-tooltip": "Alle signierten Dokumente als ZIP Datei herunterladen",
@@ -11,7 +27,11 @@
     "re-upload-file-button-title": "Erneut hochladen",
     "upload-status-file-text": "({{fileSize}}) wird hochgeladen und verarbeitet...",
     "re-upload-all-button": "Alle erneut hochladen",
-    "re-upload-all-button-title": "Alle fehlgeschlagen Uploads erneut hochladen"
+    "re-upload-all-button-title": "Alle fehlgeschlagen Uploads erneut hochladen",
+    "signature-placement-label": "Signatur platzieren",
+    "positioning": "Positionierung",
+    "file-label": "Dokument",
+    "confirm-page-leave": "Sind Sie sicher, dass Sie die Seite verlassen wollen? Es stehen signierte Dokumente zum Download bereit."
   },
   "qualified-pdf-upload": {
     "upload-field-label": "PDF-Dokumente zum Signieren hochladen",

src/i18n/en/translation.json

@@ -2,6 +2,22 @@
   "official-pdf-upload": {
     "upload-field-label": "Upload PDF-files to sign",
     "upload-area-text": "In this area you can upload PDF-files via Drag & Drop or by selecting them directly",
+    "current-signing-process-label": "Current signing process",
+    "queued-files-label": "Queued documents",
+    "queued-files-empty1": "No queued documents",
+    "queued-files-empty2": "You can now upload more documents",
+    "remove-failed-file-button-title": "Remove failed document",
+    "remove-queued-file-button-title": "Remove document from queue",
+    "clear-all": "Clear all",
+    "start-signing-process-button": "Start signing",
+    "stop-signing-process-button": "Stop signing",
+    "show-preview": "Show document",
+    "positioning-automatic": "Automatic",
+    "positioning-manual": "Manual",
+    "close-preview": "Close preview",
+    "preview-label": "Document view",
+    "start-signing-process-button-running-title": "Signing process running",
+    "remove-current-file-button-title": "Cancel current signing process",
     "signed-files-label": "Signed files",
     "download-zip-button": "Download ZIP",
     "download-zip-button-tooltip": "Download all signed files as ZIP file",
@@ -11,7 +27,11 @@
     "re-upload-file-button-title": "Upload again",
     "upload-status-file-text": "({{fileSize}}) is currently uploading and being processed...",
     "re-upload-all-button": "Upload all",
-    "re-upload-all-button-title": "Upload all failed uploads again"
+    "re-upload-all-button-title": "Upload all failed uploads again",
+    "signature-placement-label": "Place signature",
+    "positioning": "Positioning",
+    "file-label": "document",
+    "confirm-page-leave": "Are you sure you want to leave this page? There are still signed documents ready to be downloaded."
   },
   "qualified-pdf-upload": {
     "upload-field-label": "Upload PDF-documents to sign",

src/vpu-pdf-preview.js

@@ -29,6 +29,9 @@ export class PdfPreview extends ScopedElementsMixin(VPULitElement) {
         this.fabricCanvas = null;
         this.canvasToPdfScale = 1.0;
         this.currentPageOriginalHeight = 0;
+        this.placeholder = 'signature-placeholder.png';
+        this.signature_width = 80;
+        this.signature_height = 29;
 
         this._onWindowResize = this._onWindowResize.bind(this);
     }
@@ -51,6 +54,9 @@ export class PdfPreview extends ScopedElementsMixin(VPULitElement) {
             isPageRenderingInProgress: { type: Boolean, attribute: false },
             isPageLoaded: { type: Boolean, attribute: false },
             isShowPlacement: { type: Boolean, attribute: false },
+            placeholder: { type: String, attribute: 'signature-placeholder-image' },
+            signature_width: { type: Number, attribute: 'signature-width' },
+            signature_height: { type: Number, attribute: 'signature-height' },
         };
     }
 
@@ -99,7 +105,7 @@ export class PdfPreview extends ScopedElementsMixin(VPULitElement) {
             });
 
             // add signature image
-            fabric.Image.fromURL(commonUtils.getAssetURL('local/vpu-signature/signature-placeholder.png'), function(image) {
+            fabric.Image.fromURL(commonUtils.getAssetURL('local/vpu-signature/' + this.placeholder), function(image) {
                 // add a red border around the signature placeholder
                 image.set({stroke: "#e4154b", strokeWidth: 8});
 
@@ -288,7 +294,7 @@ export class PdfPreview extends ScopedElementsMixin(VPULitElement) {
 
                 // set the initial position of the signature
                 if (initSignature) {
-                    const sigSizeMM = {width: 80, height: 29};
+                    const sigSizeMM = {width: this.signature_width, height: this.signature_height};
                     const sigPosMM = {top: 5, left: 5};
 
                     const inchPerMM = 0.03937007874;
@@ -369,7 +375,7 @@ export class PdfPreview extends ScopedElementsMixin(VPULitElement) {
     }
 
     /**
-     * Rotates the signature clock-wise in 90 steps
+     * Rotates the signature clock-wise in 90� steps
      */
     async rotateSignature() {
         let signature = this.getSignatureRect();