diff --git a/src/dbp-official-signature-pdf-upload.js b/src/dbp-official-signature-pdf-upload.js
index a5049aec4c418c6814709b50379f5e74bae55e7d..72b041e344b4948af8ce4b915c708a2f85588e3d 100644
--- a/src/dbp-official-signature-pdf-upload.js
+++ b/src/dbp-official-signature-pdf-upload.js
@@ -19,6 +19,7 @@ import {OrganizationSelect} from "@dbp-toolkit/organization-select";
import metadata from './dbp-official-signature-pdf-upload.metadata.json';
import {Activity} from './activity.js';
import {PdfAnnotationView} from "./dbp-pdf-annotation-view";
+import * as SignatureStyles from './styles';
const i18n = createI18nInstance();
@@ -121,12 +122,11 @@ class OfficialSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitElem
setInterval(() => { this.handleQueuedFiles(); }, 1000);
}
- async _updateNeedsPlacementStatus(id) {
- let entry = this.queuedFiles[id];
- let sigCount = await utils.getPDFSignatureCount(entry.file);
- this.queuedFilesNeedsPlacement.delete(id);
- if (sigCount > 0)
- this.queuedFilesNeedsPlacement.set(id, true);
+ async queueFile(file) {
+ let id = await super.queueFile(file);
+ await this._updateNeedsPlacementStatus(id);
+ this.requestUpdate();
+ return id;
}
/**
@@ -194,40 +194,8 @@ class OfficialSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitElem
this.uploadInProgress = false;
}
- storePDFData(event) {
- let placement = event.detail;
- let placementMode = 'manual';
-
- let key = this.currentPreviewQueueKey;
- this.queuedFilesSignaturePlacements[key] = placement;
- this.queuedFilesPlacementModes[key] = placementMode;
- this.signaturePlacementInProgress = false;
- }
-
- /**
- * Called when preview is "canceled"
- *
- * @param event
- */
- hidePDF(event) {
- // reset placement mode to "auto" if no placement was confirmed previously
- if (this.queuedFilesSignaturePlacements[this.currentPreviewQueueKey] === undefined) {
- this.queuedFilesPlacementModes[this.currentPreviewQueueKey] = "auto";
- }
- this.signaturePlacementInProgress = false;
- }
- queuePlacementSwitch(key, name) {
- this.queuedFilesPlacementModes[key] = name;
- console.log(name);
- if (name === "manual") {
- this.showPreview(key, true);
- } else if (this.currentPreviewQueueKey === key) {
- this.signaturePlacementInProgress = false;
- }
- this.requestUpdate();
- }
/**
* Decides if the "beforeunload" event needs to be canceled
@@ -259,25 +227,6 @@ class OfficialSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitElem
event.returnValue = '';
}
- endSigningProcessIfQueueEmpty() {
- if (this.queuedFilesCount === 0 && this.signingProcessActive) {
- this.signingProcessActive = false;
- }
- }
-
- /**
- * @param ev
- */
- onFileSelected(ev) {
- this.queueFile(ev.detail.file);
- }
-
- async queueFile(file) {
- let id = await super.queueFile(file);
- await this._updateNeedsPlacementStatus(id);
- this.requestUpdate();
- return id;
- }
addToErrorFiles(file) {
this.endSigningProcessIfQueueEmpty();
@@ -327,95 +276,7 @@ class OfficialSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitElem
super.update(changedProperties);
}
- onLanguageChanged(e) {
- this.lang = e.detail.lang;
- }
-
- /**
- * Re-Upload all failed files
- */
- reUploadAllClickHandler() {
- const that = this;
- // we need to make a copy and reset the queue or else our queue will run crazy
- const errorFilesCopy = {...this.errorFiles};
- this.errorFiles = [];
- this.errorFilesCount = 0;
-
- commonUtils.asyncObjectForEach(errorFilesCopy, async (file, id) => {
- await this.fileQueueingClickHandler(file.file, id);
- });
-
- that._("#re-upload-all-button").stop();
- }
-
- /**
- * Queues a failed pdf-file again
- *
- * @param file
- * @param id
- */
- async fileQueueingClickHandler(file, id) {
- this.takeFailedFileFromQueue(id);
- return this.queueFile(file);
- }
-
- /**
- * Shows the preview
- *
- * @param key
- * @param withSigBlock
- */
- async showPreview(key, withSigBlock=false) {
- if (this.signingProcessEnabled) {
- return;
- }
-
- const entry = this.getQueuedFile(key);
- this.currentFile = entry.file;
- this.currentPreviewQueueKey = key;
- console.log(entry);
- // start signature placement process
- this.signaturePlacementInProgress = true;
- this.withSigBlock = withSigBlock;
- const previewTag = this.getScopedTagName("dbp-pdf-preview");
- await this._(previewTag).showPDF(
- entry.file,
- withSigBlock, //this.queuedFilesPlacementModes[key] === "manual",
- this.queuedFilesSignaturePlacements[key]);
- }
-
- /**
- * Takes a failed file off of the queue
- *
- * @param key
- */
- takeFailedFileFromQueue(key) {
- const file = this.errorFiles.splice(key, 1);
- this.errorFilesCount = Object.keys(this.errorFiles).length;
- return file;
- }
-
- clearQueuedFiles() {
- this.queuedFilesSignaturePlacements = [];
- this.queuedFilesPlacementModes = [];
- this.queuedFilesNeedsPlacement.clear();
- super.clearQueuedFiles();
- }
-
- clearSignedFiles() {
- this.signedFiles = [];
- this.signedFilesCount = 0;
- }
-
- clearErrorFiles() {
- this.errorFiles = [];
- this.errorFilesCount = 0;
- }
-
- isUserInterfaceDisabled() {
- return this.signaturePlacementInProgress || this.externalAuthInProgress || this.uploadInProgress || this.addAnnotationInProgress;
- }
static get styles() {
// language=css
@@ -424,278 +285,7 @@ class OfficialSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitElem
${commonStyles.getGeneralCSS(false)}
${commonStyles.getButtonCSS()}
${commonStyles.getNotificationCSS()}
-
- #annotation-view .button.is-cancel {
- background: transparent;
- border: none;
- font-size: 1.5rem;
- color: var(--dbp-override-danger-bg-color);
- cursor: pointer;
- padding: 0px;
- }
-
- #annotation-view .box-header, #external-auth .box-header {
- display: flex;
- justify-content: space-between;
- align-items: start;
- }
-
- #annotation-view .box-header .filename, #external-auth .box-header .filename {
- overflow: hidden;
- text-overflow: ellipsis;
- margin-right: 0.5em;
- }
-
- #pdf-preview, #annotation-view {
- min-width: 320px;
- box-sizing: border-box;
- }
-
- h2:first-child {
- margin-top: 0;
- margin-bottom: 0px;
- }
-
- strong {
- font-weight: 600;
- }
-
- #pdf-preview .box-header, #annotation-view .box-header {
- border: 1px solid #000;
- border-bottom-width: 0;
- padding: 0.5em 0.5em 0 0.5em;
- }
-
- .hidden {
- display: none;
- }
-
- .files-block.field:not(:last-child) {
- margin-bottom: 40px;
- }
-
- .files-block .file {
- margin: 10px 0;
- }
-
- .error-files .file {
- display: grid;
- grid-template-columns: 40px auto;
- }
-
- .files-block .file .button-box {
- display: flex;
- align-items: center;
- }
-
- .files-block .file .info {
- display: inline-block;
- vertical-align: middle;
- }
-
- .file .info strong {
- font-weight: 600;
- }
-
- .notification dbp-mini-spinner {
- position: relative;
- top: 2px;
- margin-right: 5px;
- }
-
- .error, #cancel-signing-process {
- color: #e4154b;
- }
-
- #cancel-signing-process:hover {
- color: white;
- }
-
- /* using dbp-icon doesn't work */
- button > [name=close], a > [name=close] {
- font-size: 0.8em;
- }
-
- a > [name=close] {
- color: red;
- }
-
- .empty-queue {
- margin: 10px 0;
- }
-
- #grid-container {
- display: flex;
- flex-flow: row wrap;
- }
-
- #grid-container > div {
- margin-right: 20px;
- }
-
- #grid-container > div:last-child {
- margin-right: 0;
- flex: 1 0;
- }
-
- .file-block {
- max-width: 320px;
- }
-
- .file-block, .box {
- border: solid 1px black;
- padding: 10px;
- }
-
- .file-block, .box .file {
- margin-top: 0;
- }
-
- .file-block {
- margin-bottom: 10px;
- }
-
- .file-block .header {
- display: grid;
- align-items: center;
- grid-template-columns: auto 40px;
- grid-gap: 10px;
- }
-
- .file-block.error .header {
- grid-template-columns: auto 80px;
- }
-
- .file-block.error .header .buttons {
- white-space: nowrap;
- }
-
- .file-block div.bottom-line {
- display: grid;
- align-items: center;
- grid-template-columns: auto auto;
- grid-gap: 6px;
- margin-top: 6px;
- }
-
- .file-block .error-line {
- margin-top: 6px;
- color: var(--dbp-override-danger-bg-color);
- }
-
- .file-block.error div.bottom-line {
- display: block;
- }
-
- .file-block div.bottom-line .headline {
- text-align: right;
- }
-
- .file-block .filename, .file-block div.bottom-line .headline {
- text-overflow: ellipsis;
- overflow: hidden;
- }
-
- .file-block .filename {
- white-space: nowrap;
- }
-
- .bold-filename {
- font-weight: bold;
- }
-
- #pdf-preview .button.is-cancel {
- color: #e4154b;
- }
-
- .is-right {
- float: right;
- }
-
- .error-files .header {
- color: black;
- }
-
- /* prevent hovering of disabled default button */
- .button[disabled]:not(.is-primary):hover {
- background-color: inherit;
- color: inherit;
- }
-
- .is-disabled, .is-disabled.button[disabled] {
- opacity: 0.2;
- pointer-events: none;
- }
-
- #pdf-preview .box-header {
- display: flex;
- justify-content: space-between;
- align-items: start;
- }
-
- #pdf-preview .box-header .filename {
- overflow: hidden;
- text-overflow: ellipsis;
- margin-right: 0.5em;
- }
-
- #grid-container{
- margin-top: 2rem;
- /*padding-top: 2rem;*/
- }
-
- .border{
- border-top: 1px solid black;
- margin-top: 2rem;
- padding-top: 2rem;
- }
-
- .placement-missing {
- border: solid 2px var(--dbp-override-danger-bg-color);
- }
-
- .subheadline{
- font-style: italic;
- padding-left: 2em;
- margin-top: -1px;
- /*line-height: 1.8;*/
- margin-bottom: 1.2em;
- }
-
- /* Handling for small displays (like mobile devices) */
- @media only screen
- and (orientation: portrait)
- and (max-width: 768px) {
- /* Modal preview, upload and external auth */
- div.right-container > * {
- position: fixed;
- z-index: 1000;
- padding: 10px;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background-color: white;
- overflow-y: scroll;
- }
-
- /* Don't use the whole screen for the upload progress */
- #upload-progress {
- top: 10px;
- left: 10px;
- right: 10px;
- bottom: inherit;
- }
-
- #grid-container > div {
- margin-right: 0;
- width: 100%;
- }
-
- .file-block {
- max-width: inherit;
- }
- }
+ ${SignatureStyles.getSignatureCss()}
`;
}
diff --git a/src/dbp-qualified-signature-pdf-upload.js b/src/dbp-qualified-signature-pdf-upload.js
index 1a77f1f651c09bb03f132408739d55a4e9b1e7ea..62f8037fcc941446618a393602dffdd22d4addac 100644
--- a/src/dbp-qualified-signature-pdf-upload.js
+++ b/src/dbp-qualified-signature-pdf-upload.js
@@ -20,6 +20,7 @@ import metadata from './dbp-qualified-signature-pdf-upload.metadata.json';
import {Activity} from './activity.js';
import {PdfAnnotationView} from "./dbp-pdf-annotation-view";
import { ExternalSignIFrame } from './ext-sign-iframe.js';
+import * as SignatureStyles from './styles';
const i18n = createI18nInstance();
@@ -130,16 +131,16 @@ class QualifiedSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitEle
disconnectedCallback() {
// remove event listeners
window.removeEventListener('beforeunload', this._onReceiveBeforeUnload);
+ window.removeEventListener('beforeunload', this._onReceiveBeforeUnload);
super.disconnectedCallback();
}
- async _updateNeedsPlacementStatus(id) {
- let entry = this.queuedFiles[id];
- let sigCount = await getPDFSignatureCount(entry.file);
- this.queuedFilesNeedsPlacement.delete(id);
- if (sigCount > 0)
- this.queuedFilesNeedsPlacement.set(id, true);
+ async queueFile(file) {
+ let id = await super.queueFile(file);
+ await this._updateNeedsPlacementStatus(id);
+ this.requestUpdate();
+ return id;
}
/**
@@ -205,40 +206,10 @@ class QualifiedSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitEle
this.uploadInProgress = false;
}
- storePDFData(event) {
- let placement = event.detail;
- let placementMode = 'manual';
- let key = this.currentPreviewQueueKey;
- this.queuedFilesSignaturePlacements[key] = placement;
- this.queuedFilesPlacementModes[key] = placementMode;
- this.signaturePlacementInProgress = false;
- }
- /**
- * Called when preview is "canceled"
- *
- * @param event
- */
- hidePDF(event) {
- // reset placement mode to "auto" if no placement was confirmed previously
- if (this.queuedFilesSignaturePlacements[this.currentPreviewQueueKey] === undefined) {
- this.queuedFilesPlacementModes[this.currentPreviewQueueKey] = "auto";
- }
- this.signaturePlacementInProgress = false;
- }
- queuePlacementSwitch(key, name) {
- this.queuedFilesPlacementModes[key] = name;
- console.log(name);
- if (name === "manual") {
- this.showPreview(key, true);
- } else if (this.currentPreviewQueueKey === key) {
- this.signaturePlacementInProgress = false;
- }
- this.requestUpdate();
- }
/**
* Decides if the "beforeunload" event needs to be canceled
@@ -349,6 +320,7 @@ class QualifiedSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitEle
}, {}, that.lang);
}
+
_onIFrameError(event) {
let error = event.detail.message;
let file = this.currentFile;
@@ -359,25 +331,6 @@ class QualifiedSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitEle
this.endSigningProcessIfQueueEmpty();
}
- endSigningProcessIfQueueEmpty() {
- if (this.queuedFilesCount === 0 && this.signingProcessActive) {
- this.signingProcessActive = false;
- }
- }
-
- /**
- * @param ev
- */
- onFileSelected(ev) {
- this.queueFile(ev.detail.file);
- }
-
- async queueFile(file) {
- let id = await super.queueFile(file);
- await this._updateNeedsPlacementStatus(id);
- this.requestUpdate();
- return id;
- }
addToErrorFiles(file) {
this.endSigningProcessIfQueueEmpty();
@@ -432,95 +385,6 @@ class QualifiedSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitEle
super.update(changedProperties);
}
- onLanguageChanged(e) {
- this.lang = e.detail.lang;
- }
-
- /**
- * Re-Upload all failed files
- */
- reUploadAllClickHandler() {
- const that = this;
-
- // we need to make a copy and reset the queue or else our queue will run crazy
- const errorFilesCopy = {...this.errorFiles};
- this.errorFiles = [];
- this.errorFilesCount = 0;
-
- commonUtils.asyncObjectForEach(errorFilesCopy, async (file, id) => {
- await this.fileQueueingClickHandler(file.file, id);
- });
-
- that._("#re-upload-all-button").stop();
- }
-
- /**
- * Queues a failed pdf-file again
- *
- * @param file
- * @param id
- */
- async fileQueueingClickHandler(file, id) {
- this.takeFailedFileFromQueue(id);
- return this.queueFile(file);
- }
-
- /**
- * Shows the preview
- *
- * @param key
- * @param withSigBlock
- */
- async showPreview(key, withSigBlock=false) {
- if (this.signingProcessEnabled) {
- return;
- }
-
- const entry = this.getQueuedFile(key);
- this.currentFile = entry.file;
- this.currentPreviewQueueKey = key;
- console.log(entry);
- // start signature placement process
- this.signaturePlacementInProgress = true;
- this.withSigBlock = withSigBlock;
- const previewTag = this.getScopedTagName("dbp-pdf-preview");
- await this._(previewTag).showPDF(
- entry.file,
- withSigBlock, //this.queuedFilesPlacementModes[key] === "manual",
- this.queuedFilesSignaturePlacements[key]);
- }
-
- /**
- * Takes a failed file off of the queue
- *
- * @param key
- */
- takeFailedFileFromQueue(key) {
- const file = this.errorFiles.splice(key, 1);
- this.errorFilesCount = Object.keys(this.errorFiles).length;
- return file;
- }
-
- clearQueuedFiles() {
- this.queuedFilesSignaturePlacements = [];
- this.queuedFilesPlacementModes = [];
- this.queuedFilesNeedsPlacement.clear();
- super.clearQueuedFiles();
- }
-
- clearSignedFiles() {
- this.signedFiles = [];
- this.signedFilesCount = 0;
- }
-
- clearErrorFiles() {
- this.errorFiles = [];
- this.errorFilesCount = 0;
- }
-
- isUserInterfaceDisabled() {
- return this.signaturePlacementInProgress || this.externalAuthInProgress || this.uploadInProgress || this.addAnnotationInProgress;
- }
static get styles() {
// language=css
@@ -529,191 +393,9 @@ class QualifiedSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitEle
${commonStyles.getGeneralCSS(false)}
${commonStyles.getButtonCSS()}
${commonStyles.getNotificationCSS()}
+ ${SignatureStyles.getSignatureCss()}
- #annotation-view .button.is-cancel {
- background: transparent;
- border: none;
- font-size: 1.5rem;
- color: var(--dbp-override-danger-bg-color);
- cursor: pointer;
- padding: 0px;
- padding-right: 2px;
- }
-
- #annotation-view .box-header, #external-auth .box-header {
- display: flex;
- justify-content: space-between;
- align-items: start;
- }
-
- #annotation-view .box-header .filename, #external-auth .box-header .filename {
- overflow: hidden;
- text-overflow: ellipsis;
- margin-right: 0.5em;
- }
-
- #pdf-preview, #annotation-view {
- min-width: 320px;
- box-sizing: border-box;
- }
-
- h2:first-child {
- margin-top: 0;
- margin-bottom: 0px;
- }
-
- strong {
- font-weight: 600;
- }
-
- #pdf-preview .box-header, #annotation-view .box-header {
- border: 1px solid #000;
- border-bottom-width: 0;
- padding: 0.5em 0.5em 0 0.5em;
- }
-
- .hidden {
- display: none;
- }
-
- .files-block.field:not(:last-child) {
- margin-bottom: 40px;
- }
-
- .files-block .file {
- margin: 10px 0;
- }
-
- .error-files .file {
- display: grid;
- grid-template-columns: 40px auto;
- }
-
- .files-block .file .button-box {
- display: flex;
- align-items: center;
- }
-
- .files-block .file .info {
- display: inline-block;
- vertical-align: middle;
- }
-
- .file .info strong {
- font-weight: 600;
- }
-
- .notification dbp-mini-spinner {
- position: relative;
- top: 2px;
- margin-right: 5px;
- }
-
- .error, #cancel-signing-process {
- color: #e4154b;
- }
-
- #cancel-signing-process:hover {
- color: white;
- }
-
- /* using dbp-icon doesn't work */
- button > [name=close], a > [name=close] {
- font-size: 0.8em;
- }
-
- a > [name=close] {
- color: red;
- }
-
- .empty-queue {
- margin: 10px 0;
- }
-
- #grid-container {
- display: flex;
- flex-flow: row wrap;
- }
-
- #grid-container > div {
- margin-right: 20px;
- }
-
- #grid-container > div:last-child {
- margin-right: 0;
- flex: 1 0;
- }
-
- .file-block {
- max-width: 320px;
- }
-
- .file-block, .box {
- border: solid 1px black;
- padding: 10px;
- }
-
- .file-block, .box .file {
- margin-top: 0;
- }
-
- .file-block {
- margin-bottom: 10px;
- }
-
- .file-block .header {
- display: grid;
- align-items: center;
- grid-template-columns: auto 40px;
- grid-gap: 10px;
- }
-
- .file-block.error .header {
- grid-template-columns: auto 80px;
- }
-
- .file-block.error .header .buttons {
- white-space: nowrap;
- }
-
- .file-block div.bottom-line {
- display: grid;
- align-items: center;
- grid-template-columns: auto auto;
- grid-gap: 6px;
- margin-top: 6px;
- }
-
- .file-block .error-line {
- margin-top: 6px;
- color: var(--dbp-override-danger-bg-color);
- }
-
- .file-block.error div.bottom-line {
- display: block;
- }
-
- .file-block div.bottom-line .headline {
- text-align: right;
- }
-
- .file-block .filename, .file-block div.bottom-line .headline {
- text-overflow: ellipsis;
- overflow: hidden;
- }
-
- .file-block .filename {
- white-space: nowrap;
- }
-
- .bold-filename {
- font-weight: bold;
- }
-
- #pdf-preview .button.is-cancel {
- color: #e4154b;
- }
-
+
#external-auth #iframe {
margin-top: 0.5em;
}
@@ -728,97 +410,6 @@ class QualifiedSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitEle
/* keeps the A-Trust webpage aligned left */
max-width: 575px;
}
-
- .is-right {
- float: right;
- }
-
- .error-files .header {
- color: black;
- }
-
- /* prevent hovering of disabled default button */
- .button[disabled]:not(.is-primary):hover {
- background-color: inherit;
- color: inherit;
- }
-
- .is-disabled, .is-disabled.button[disabled] {
- opacity: 0.2;
- pointer-events: none;
- }
-
- #pdf-preview .box-header, #external-auth .box-header {
- display: flex;
- justify-content: space-between;
- align-items: start;
- }
-
- #pdf-preview .box-header .filename, #external-auth .box-header .filename {
- overflow: hidden;
- text-overflow: ellipsis;
- margin-right: 0.5em;
- }
-
- #grid-container{
- margin-top: 2rem;
- /* padding-top: 2rem; */
- }
-
- .border{
- border-top: 1px solid black;
- margin-top: 2rem;
- padding-top: 2rem;
- }
-
- .placement-missing {
- border: solid 2px var(--dbp-override-danger-bg-color);
- }
-
- .subheadline{
- font-style: italic;
- padding-left: 2em;
- margin-top: -1px;
- /*line-height: 1.8;*/
- margin-bottom: 1.2em;
- }
-
-
-
- /* Handling for small displays (like mobile devices) */
- @media only screen
- and (orientation: portrait)
- and (max-width: 768px) {
- /* Modal preview, upload and external auth */
- div.right-container > * {
- position: fixed;
- z-index: 1000;
- padding: 10px;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background-color: white;
- overflow-y: scroll;
- }
-
- /* Don't use the whole screen for the upload progress */
- #upload-progress {
- top: 10px;
- left: 10px;
- right: 10px;
- bottom: inherit;
- }
-
- #grid-container > div {
- margin-right: 0;
- width: 100%;
- }
-
- .file-block {
- max-width: inherit;
- }
- }
`;
}
diff --git a/src/dbp-signature-lit-element.js b/src/dbp-signature-lit-element.js
index 2fc408d8921283259fc1ebb28573e1cbab5eca4e..499da2d06703b4ad685b2dbac8e85ee91ff15f1a 100644
--- a/src/dbp-signature-lit-element.js
+++ b/src/dbp-signature-lit-element.js
@@ -2,6 +2,7 @@ import * as utils from "./utils";
import * as commonUtils from "@dbp-toolkit/common/utils";
import {BaseLitElement} from './base-element.js';
import {SignatureEntry} from './signature-entry.js';
+import {getPDFSignatureCount} from "./utils";
export default class DBPSignatureLitElement extends BaseLitElement {
constructor() {
@@ -419,4 +420,156 @@ export default class DBPSignatureLitElement extends BaseLitElement {
span.classList.remove('bold-filename');
}
}
+
+ async _updateNeedsPlacementStatus(id) {
+ let entry = this.queuedFiles[id];
+ let sigCount = await getPDFSignatureCount(entry.file);
+ this.queuedFilesNeedsPlacement.delete(id);
+ if (sigCount > 0)
+ this.queuedFilesNeedsPlacement.set(id, true);
+ }
+
+ storePDFData(event) {
+ let placement = event.detail;
+ let placementMode = 'manual';
+
+ let key = this.currentPreviewQueueKey;
+ this.queuedFilesSignaturePlacements[key] = placement;
+ this.queuedFilesPlacementModes[key] = placementMode;
+ this.signaturePlacementInProgress = false;
+ }
+
+ /**
+ * Called when preview is "canceled"
+ *
+ * @param event
+ */
+ hidePDF(event) {
+ // reset placement mode to "auto" if no placement was confirmed previously
+ if (this.queuedFilesSignaturePlacements[this.currentPreviewQueueKey] === undefined) {
+ this.queuedFilesPlacementModes[this.currentPreviewQueueKey] = "auto";
+ }
+ this.signaturePlacementInProgress = false;
+ }
+
+ queuePlacementSwitch(key, name) {
+ this.queuedFilesPlacementModes[key] = name;
+ console.log(name);
+
+ if (name === "manual") {
+ this.showPreview(key, true);
+ } else if (this.currentPreviewQueueKey === key) {
+ this.signaturePlacementInProgress = false;
+ }
+ this.requestUpdate();
+ }
+
+ endSigningProcessIfQueueEmpty() {
+ if (this.queuedFilesCount === 0 && this.signingProcessActive) {
+ this.signingProcessActive = false;
+ }
+ }
+
+ /**
+ * @param ev
+ */
+ onFileSelected(ev) {
+ this.queueFile(ev.detail.file);
+ }
+
+
+
+ /**
+ * Re-Upload all failed files
+ */
+ reUploadAllClickHandler() {
+ const that = this;
+
+ // we need to make a copy and reset the queue or else our queue will run crazy
+ const errorFilesCopy = {...this.errorFiles};
+ this.errorFiles = [];
+ this.errorFilesCount = 0;
+
+ commonUtils.asyncObjectForEach(errorFilesCopy, async (file, id) => {
+ await this.fileQueueingClickHandler(file.file, id);
+ });
+
+ that._("#re-upload-all-button").stop();
+ }
+
+ /**
+ * Queues a failed pdf-file again
+ *
+ * @param file
+ * @param id
+ */
+ async fileQueueingClickHandler(file, id) {
+ this.takeFailedFileFromQueue(id);
+ return this.queueFile(file);
+ }
+
+ /**
+ * Shows the preview
+ *
+ * @param key
+ * @param withSigBlock
+ */
+ async showPreview(key, withSigBlock=false) {
+ if (this.signingProcessEnabled) {
+ return;
+ }
+
+ const entry = this.getQueuedFile(key);
+ this.currentFile = entry.file;
+ this.currentPreviewQueueKey = key;
+ console.log(entry);
+ // start signature placement process
+ this.signaturePlacementInProgress = true;
+ this.withSigBlock = withSigBlock;
+ const previewTag = this.getScopedTagName("dbp-pdf-preview");
+ await this._(previewTag).showPDF(
+ entry.file,
+ withSigBlock, //this.queuedFilesPlacementModes[key] === "manual",
+ this.queuedFilesSignaturePlacements[key]);
+ }
+
+ onLanguageChanged(e) {
+ this.lang = e.detail.lang;
+ }
+
+
+ /**
+ * Takes a failed file off of the queue
+ *
+ * @param key
+ */
+ takeFailedFileFromQueue(key) {
+ const file = this.errorFiles.splice(key, 1);
+ this.errorFilesCount = Object.keys(this.errorFiles).length;
+ return file;
+ }
+
+ clearQueuedFiles() {
+ this.queuedFilesSignaturePlacements = [];
+ this.queuedFilesPlacementModes = [];
+ this.queuedFilesNeedsPlacement.clear();
+ super.clearQueuedFiles();
+ }
+
+ clearSignedFiles() {
+ this.signedFiles = [];
+ this.signedFilesCount = 0;
+ }
+
+ clearErrorFiles() {
+ this.errorFiles = [];
+ this.errorFilesCount = 0;
+ }
+
+ isUserInterfaceDisabled() {
+ return this.signaturePlacementInProgress || this.externalAuthInProgress || this.uploadInProgress || this.addAnnotationInProgress;
+ }
+
+
+
}
diff --git a/src/dbp-signature-verification-full.js b/src/dbp-signature-verification-full.js
index 329cef020438b583a518870e08fcc8411b83030e..736ad1ee2e384fd0520c4bb81644ce5067d55755 100644
--- a/src/dbp-signature-verification-full.js
+++ b/src/dbp-signature-verification-full.js
@@ -13,6 +13,7 @@ import JSONLD from "@dbp-toolkit/common/jsonld";
import {name as pkgName} from './../package.json';
import metadata from './dbp-signature-verification-full.metadata.json';
import {Activity} from './activity.js';
+import * as SignatureStyles from './styles';
const i18n = createI18nInstance();
@@ -309,131 +310,18 @@ class SignatureVerificationFull extends ScopedElementsMixin(DBPSignatureLitEleme
${commonStyles.getGeneralCSS(false)}
${commonStyles.getButtonCSS()}
${commonStyles.getNotificationCSS()}
-
- #pdf-preview {
- min-width: 320px;
- box-sizing: border-box;
- }
-
- h2:first-child {
- margin-top: 0;
- margin-bottom: 0px;
- }
-
- strong {
- font-weight: 600;
- }
-
- #pdf-preview .box-header {
- border: 1px solid #000;
- border-bottom-width: 0;
- padding: 0.5em 0.5em 0 0.5em;
- }
-
- .hidden {
- display: none;
- }
-
- .files-block.field:not(:last-child) {
- margin-bottom: 40px;
- }
-
- .files-block .file {
- margin: 10px 0;
- }
-
- .error-files .file {
- display: grid;
- grid-template-columns: 40px auto;
- }
-
- .files-block .file .button-box {
- display: flex;
- align-items: center;
- }
-
- .files-block .file .info {
- display: inline-block;
- vertical-align: middle;
- }
-
- .file .info strong {
- font-weight: 600;
- }
-
- .notification dbp-mini-spinner {
- position: relative;
- top: 2px;
- margin-right: 5px;
- }
-
- .error, #cancel-verification-process {
- color: #e4154b;
- }
+ ${SignatureStyles.getSignatureCss()}
+
- #cancel-verification-process:hover {
- color: white;
- }
-
- /* using dbp-icon doesn't work */
- button > [name=close], a > [name=close] {
- font-size: 0.8em;
- }
-
- a > [name=close] {
- color: red;
- }
-
- .empty-queue {
- margin: 10px 0;
- }
-
- #grid-container {
- display: flex;
- flex-flow: row wrap;
- }
-
- #grid-container > div {
- margin-right: 20px;
- }
-
- #grid-container > div:last-child {
- margin-right: 0;
- flex: 1 0;
- }
.file-block {
max-width: 320px;
}
- .file-block, .box {
- border: solid 1px black;
- padding: 10px;
- }
-
- .file-block, .box .file {
- margin-top: 0;
- }
-
- .file-block {
- margin-bottom: 10px;
- }
-
- .file-block .header {
- display: grid;
- align-items: center;
- grid-template-columns: auto 40px;
- grid-gap: 10px;
- }
-
.file-block.error .header {
grid-template-columns: auto 90px;
}
- .file-block.error .header .buttons {
- white-space: nowrap;
- }
-
.file-block div.bottom-line {
display: grid;
align-items: center;
@@ -441,124 +329,7 @@ class SignatureVerificationFull extends ScopedElementsMixin(DBPSignatureLitEleme
grid-gap: 10px;
margin-top: 10px;
}
-
- .file-block.error div.bottom-line {
- display: block;
- }
-
- .file-block div.bottom-line .headline {
- text-align: right;
- }
-
- .file-block .filename, .file-block div.bottom-line .headline {
- text-overflow: ellipsis;
- overflow: hidden;
- }
-
- .file-block .filename {
- white-space: nowrap;
- }
-
- #pdf-preview .button.is-cancel {
- color: #e4154b;
- }
-
- .is-right {
- float: right;
- }
-
- .error-files .header {
- color: black;
- }
-
- /* prevent hovering of disabled default button */
- .button[disabled]:not(.is-primary):hover {
- background-color: inherit;
- color: inherit;
- }
-
- .is-disabled, .is-disabled.button[disabled] {
- opacity: 0.2;
- pointer-events: none;
- }
-
- #pdf-preview .box-header {
- display: flex;
- justify-content: space-between;
- align-items: start;
- }
-
- #pdf-preview .box-header .filename {
- overflow: hidden;
- text-overflow: ellipsis;
- margin-right: 0.5em;
- }
-
- table.signatures {
- margin-top: 10px;
- }
-
- .verified-files .file-block {
- max-width: inherit;
- }
-
- .verification-ok {
- background-color: #a4ffa4;
- }
-
- #grid-container{
- margin-top: 2rem;
- /*padding-top: 2rem;*/
- }
- .border{
- border-top: 1px solid black;
- margin-top: 2rem;
- padding-top: 2rem;
- }
-
- .subheadline{
- font-style: italic;
- padding-left: 2em;
- margin-top: -1px;
- /*line-height: 1.8;*/
- margin-bottom: 1.2em;
- }
-
- /* Handling for small displays (like mobile devices) */
- @media only screen
- and (orientation: portrait)
- and (max-width: 768px) {
- /* Modal preview, upload and external auth */
- div.right-container > * {
- position: fixed;
- z-index: 1000;
- padding: 10px;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background-color: white;
- overflow-y: scroll;
- }
-
- /* Don't use the whole screen for the upload progress */
- #upload-progress {
- top: 10px;
- left: 10px;
- right: 10px;
- bottom: inherit;
- }
-
- #grid-container > div {
- margin-right: 0;
- width: 100%;
- }
-
- .file-block {
- max-width: inherit;
- }
- }
`;
}
diff --git a/src/styles.js b/src/styles.js
index 4d8897088ba17d8eae079605850ee226fe156ec6..df9597a4179ef66fd5628d702b78391870e8f6a9 100644
--- a/src/styles.js
+++ b/src/styles.js
@@ -3,8 +3,291 @@ import {css} from 'lit-element';
export function getSignatureCss() {
// language=css
return css`
+
+ #annotation-view .button.is-cancel {
+ background: transparent;
+ border: none;
+ font-size: 1.5rem;
+ color: var(--dbp-override-danger-bg-color);
+ cursor: pointer;
+ padding: 0px;
+ padding-right: 2px;
+ }
+
+ #annotation-view .box-header, #external-auth .box-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: start;
+ }
+
+ #annotation-view .box-header .filename, #external-auth .box-header .filename {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ margin-right: 0.5em;
+ }
+
+ #pdf-preview, #annotation-view {
+ min-width: 320px;
+ box-sizing: border-box;
+ }
+
+ h2:first-child {
+ margin-top: 0;
+ margin-bottom: 0px;
+ }
+
+ strong {
+ font-weight: 600;
+ }
+
+ #pdf-preview .box-header, #annotation-view .box-header {
+ border: 1px solid #000;
+ border-bottom-width: 0;
+ padding: 0.5em 0.5em 0 0.5em;
+ }
+
+ .hidden {
+ display: none;
+ }
+
+ .files-block.field:not(:last-child) {
+ margin-bottom: 40px;
+ }
+
+ .files-block .file {
+ margin: 10px 0;
+ }
+
+ .error-files .file {
+ display: grid;
+ grid-template-columns: 40px auto;
+ }
+
+ .files-block .file .button-box {
+ display: flex;
+ align-items: center;
+ }
+
+ .files-block .file .info {
+ display: inline-block;
+ vertical-align: middle;
+ }
+
+
+ .file .info strong {
+ font-weight: 600;
+ }
+
+ .notification dbp-mini-spinner {
+ position: relative;
+ top: 2px;
+ margin-right: 5px;
+ }
+
+ .error, #cancel-signing-process {
+ color: #e4154b;
+ }
+
+ #cancel-signing-process:hover {
+ color: white;
+ }
+
+ /* using dbp-icon doesn't work */
+ button > [name=close], a > [name=close] {
+ font-size: 0.8em;
+ }
+
+ a > [name=close] {
+ color: red;
+ }
+
+ .empty-queue {
+ margin: 10px 0;
+ }
+
+ #grid-container {
+ display: flex;
+ flex-flow: row wrap;
+ }
+
+ #grid-container > div {
+ margin-right: 20px;
+ }
+
+ #grid-container > div:last-child {
+ margin-right: 0;
+ flex: 1 0;
+ }
+
+ .file-block, .box {
+ border: solid 1px black;
+ padding: 10px;
+ }
+
+ .file-block, .box .file {
+ margin-top: 0;
+ }
+
+
+ .file-block {
+ max-width: 320px;
+ margin-bottom: 10px;
+ }
+
+ .file-block .header {
+ display: grid;
+ align-items: center;
+ grid-template-columns: auto 40px;
+ grid-gap: 10px;
+ }
+
+ .file-block.error .header {
+ grid-template-columns: auto 80px;
+ }
+
+ .file-block.error .header .buttons {
+ white-space: nowrap;
+ }
+
+ .file-block div.bottom-line {
+ display: grid;
+ align-items: center;
+ grid-template-columns: auto auto;
+ grid-gap: 6px;
+ margin-top: 6px;
+ }
+
+ .file-block .error-line {
+ margin-top: 6px;
+ color: var(--dbp-override-danger-bg-color);
+ }
+
+ .file-block.error div.bottom-line {
+ display: block;
+ }
+
+ .file-block div.bottom-line .headline {
+ text-align: right;
+ }
+
+ .file-block .filename, .file-block div.bottom-line .headline {
+ text-overflow: ellipsis;
+ overflow: hidden;
+ }
+
+ .file-block .filename {
+ white-space: nowrap;
+ }
+
+ .bold-filename {
+ font-weight: bold;
+ }
+
+ #pdf-preview .button.is-cancel {
+ color: #e4154b;
+ }
+
+ .is-right {
+ float: right;
+ }
+
+ .error-files .header {
+ color: black;
+ }
+
+ /* prevent hovering of disabled default button */
+ .button[disabled]:not(.is-primary):hover {
+ background-color: inherit;
+ color: inherit;
+ }
+
+ .is-disabled, .is-disabled.button[disabled] {
+ opacity: 0.2;
+ pointer-events: none;
+ }
+
#pdf-preview {
position: sticky;
top: 0px;
- }`;
+ height: 100vh;
+ overflow: auto;
+ }
+
+ #pdf-preview .box-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: start;
+ }
+
+ #pdf-preview .box-header .filename {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ margin-right: 0.5em;
+ }
+
+ #grid-container{
+ margin-top: 2rem;
+ /*padding-top: 2rem;*/
+ }
+
+ .border{
+ border-top: 1px solid black;
+ margin-top: 2rem;
+ padding-top: 2rem;
+ }
+
+ .placement-missing {
+ border: solid 2px var(--dbp-override-danger-bg-color);
+ }
+
+ .subheadline{
+ font-style: italic;
+ padding-left: 2em;
+ margin-top: -1px;
+ /*line-height: 1.8;*/
+ margin-bottom: 1.2em;
+ }
+
+ @media only screen
+ and (orientation: portrait)
+ and (max-width: 768px) {
+ /* Modal preview, upload and external auth */
+ div.right-container > * {
+ position: fixed;
+ z-index: 1000;
+ padding: 10px;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background-color: white;
+ overflow-y: scroll;
+ }
+
+ /* Don't use the whole screen for the upload progress */
+ #upload-progress {
+ top: 10px;
+ left: 10px;
+ right: 10px;
+ bottom: inherit;
+ }
+
+ #grid-container > div {
+ margin-right: 0;
+ width: 100%;
+ }
+
+ .file-block {
+ max-width: inherit;
+ }
+
+ #pdf-preview {
+ position: fixed;
+ }
+ }
+
+
+ `;
+
+
}
\ No newline at end of file