Re-format while code base

src/dbp-signature-verification.js

 import {createInstance} from './i18n.js';
 import {css, html} from 'lit';
 import {ScopedElementsMixin} from '@open-wc/scoped-elements';
-import DBPSignatureLitElement from "./dbp-signature-lit-element";
+import DBPSignatureLitElement from './dbp-signature-lit-element';
 import * as commonUtils from '@dbp-toolkit/common/utils';
 import * as commonStyles from '@dbp-toolkit/common/styles';
 import metadata from './dbp-signature-verification.metadata.json';
 import {Activity} from './activity.js';
 
-
 class SignatureVerification extends ScopedElementsMixin(DBPSignatureLitElement) {
     constructor() {
         super();
@@ -29,7 +28,7 @@ class SignatureVerification extends ScopedElementsMixin(DBPSignatureLitElement)
     update(changedProperties) {
         changedProperties.forEach((oldValue, propName) => {
             switch (propName) {
-                case "lang":
+                case 'lang':
                     this._i18n.changeLanguage(this.lang);
                     break;
             }
@@ -70,7 +69,7 @@ class SignatureVerification extends ScopedElementsMixin(DBPSignatureLitElement)
             }
 
             .int-link-internal:after {
-                content: "\\00a0\\00a0\\00a0";
+                content: '\\00a0\\00a0\\00a0';
                 background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3Ardf%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2F02%2F22-rdf-syntax-ns%23%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%228.6836mm%22%20width%3D%225.2043mm%22%20version%3D%221.1%22%20xmlns%3Acc%3D%22http%3A%2F%2Fcreativecommons.org%2Fns%23%22%20xmlns%3Adc%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Felements%2F1.1%2F%22%20viewBox%3D%220%200%2018.440707%2030.768605%22%3E%3Cg%20transform%3D%22translate(-382.21%20-336.98)%22%3E%3Cpath%20style%3D%22stroke-linejoin%3Around%3Bstroke%3A%23000%3Bstroke-linecap%3Around%3Bstroke-miterlimit%3A10%3Bstroke-width%3A2%3Bfill%3Anone%22%20d%3D%22m383.22%20366.74%2016.43-14.38-16.43-14.37%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
                 background-size: 73%;
                 background-repeat: no-repeat;
@@ -82,7 +81,7 @@ class SignatureVerification extends ScopedElementsMixin(DBPSignatureLitElement)
             }
 
             .int-link-internal:hover::after {
-                content: "\\00a0\\00a0\\00a0";
+                content: '\\00a0\\00a0\\00a0';
                 background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3Ardf%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2F02%2F22-rdf-syntax-ns%23%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%228.6836mm%22%20width%3D%225.2043mm%22%20version%3D%221.1%22%20xmlns%3Acc%3D%22http%3A%2F%2Fcreativecommons.org%2Fns%23%22%20xmlns%3Adc%3D%22http%3A%2F%2Fpurl.org%2Fdc%2Felements%2F1.1%2F%22%20viewBox%3D%220%200%2018.440707%2030.768605%22%3E%3Cg%20transform%3D%22translate(-382.21%20-336.98)%22%3E%3Cpath%20style%3D%22stroke-linejoin%3Around%3Bstroke%3A%23FFF%3Bstroke-linecap%3Around%3Bstroke-miterlimit%3A10%3Bstroke-width%3A2%3Bfill%3Anone%22%20d%3D%22m383.22%20366.74%2016.43-14.38-16.43-14.37%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
                 background-size: 73%;
                 background-repeat: no-repeat;
@@ -108,16 +107,16 @@ class SignatureVerification extends ScopedElementsMixin(DBPSignatureLitElement)
         const activity = new Activity(metadata);
         return html`
             <h2>${activity.getName(this.lang)}</h2>
-            <p class="subheadline">
-                ${activity.getDescription(this.lang)}
-            </p>
-            <p>
-                ${i18n.t('signature-verification-extern.description-text')}
-            </p>
-            <a target="_blank" rel="noopener" class="int-link-internal" href="https://www.signaturpruefung.gv.at">${i18n.t('signature-verification-extern.link-label')}</a>
-            <p>
-                ${i18n.t('signature-verification-extern.adobe-reader-text')}
-            </p>
+            <p class="subheadline">${activity.getDescription(this.lang)}</p>
+            <p>${i18n.t('signature-verification-extern.description-text')}</p>
+            <a
+                target="_blank"
+                rel="noopener"
+                class="int-link-internal"
+                href="https://www.signaturpruefung.gv.at">
+                ${i18n.t('signature-verification-extern.link-label')}
+            </a>
+            <p>${i18n.t('signature-verification-extern.adobe-reader-text')}</p>
             <slot name="additional-information"></slot>
         `;
     }

src/dbp-signature.js

 import {AppShell} from '@dbp-toolkit/app-shell';
 import * as commonUtils from '@dbp-toolkit/common/utils';
-import {Translated} from "@dbp-toolkit/common/src/translated";
-import {TUGrazLogo} from "@dbp-toolkit/app-shell/src/tugraz-logo";
+import {Translated} from '@dbp-toolkit/common/src/translated';
+import {TUGrazLogo} from '@dbp-toolkit/app-shell/src/tugraz-logo';
 
 commonUtils.defineCustomElement('dbp-signature', AppShell);
 commonUtils.defineCustomElement('dbp-translated', Translated);

src/ext-sign-iframe.js

@@ -11,7 +11,6 @@ import {ScopedElementsMixin} from '@open-wc/scoped-elements';
  *  signature-done with an "id"
  */
 export class ExternalSignIFrame extends ScopedElementsMixin(LitElement) {
-
     constructor() {
         super();
         this._loading = false;
@@ -47,28 +46,32 @@ export class ExternalSignIFrame extends ScopedElementsMixin(LitElement) {
             if (data.cause) {
                 error = `${error}: ${data.cause}`;
             }
-            this.dispatchEvent(new CustomEvent('signature-error', {
+            this.dispatchEvent(
+                new CustomEvent('signature-error', {
                     detail: {
                         message: error,
-                }
-            }));
+                    },
+                })
+            );
         } else if (data.type === 'pdf-as-callback') {
-            this.dispatchEvent(new CustomEvent('signature-done', {
+            this.dispatchEvent(
+                new CustomEvent('signature-done', {
                     detail: {
                         id: data.sessionId,
-                }
-            }));
+                    },
+                })
+            );
         }
     }
 
     setUrl(url) {
-        let iframe = this.renderRoot.querySelector("#iframe");
+        let iframe = this.renderRoot.querySelector('#iframe');
         this._loading = true;
         iframe.src = url;
     }
 
     reset() {
-        this.setUrl("about:blank");
+        this.setUrl('about:blank');
     }
 
     static get styles() {
@@ -93,15 +96,20 @@ export class ExternalSignIFrame extends ScopedElementsMixin(LitElement) {
     }
 
     render() {
-
         let onDone = (event) => {
             this._loading = false;
         };
 
         return html`
-            ${ this._loading ? html`<dbp-mini-spinner></dbp-mini-spinner>` : html`` }
+            ${this._loading
+                ? html`
+                      <dbp-mini-spinner></dbp-mini-spinner>
+                  `
+                : html``}
             <!-- "scrolling" is deprecated, but still seem to help -->
-            <iframe id="iframe" class=${classMap({hidden: this._loading})}
+            <iframe
+                id="iframe"
+                class=${classMap({hidden: this._loading})}
                 @load="${onDone}"
                 @error="${onDone}"
                 scrolling="no"></iframe>

src/signature-entry.js

 export class SignatureEntry {
-
     constructor(key, file) {
         this.key = key;
         this.file = file;

src/styles.js

@@ -3,7 +3,6 @@ import {css} from 'lit';
 export function getSignatureCss() {
     // language=css
     return css`
-
         #annotation-view .button.is-cancel {
             background: transparent;
             border: none;
@@ -14,19 +13,22 @@ export function getSignatureCss() {
             padding-right: 2px;
         }
 
-        #annotation-view .box-header, #external-auth .box-header {
+        #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 {
+        #annotation-view .box-header .filename,
+        #external-auth .box-header .filename {
             overflow: hidden;
             text-overflow: ellipsis;
             margin-right: 0.5em;
         }
 
-        #pdf-preview, #annotation-view {
+        #pdf-preview,
+        #annotation-view {
             min-width: 320px;
             box-sizing: border-box;
         }
@@ -40,7 +42,8 @@ export function getSignatureCss() {
             font-weight: 600;
         }
 
-        #pdf-preview .box-header, #annotation-view .box-header {
+        #pdf-preview .box-header,
+        #annotation-view .box-header {
             border: var(--dbp-border-dark);
             border-bottom-width: 0;
             padding: 0.5em 0.5em 0 0.5em;
@@ -73,7 +76,6 @@ export function getSignatureCss() {
             vertical-align: middle;
         }
 
-
         .file .info strong {
             font-weight: 600;
         }
@@ -84,7 +86,8 @@ export function getSignatureCss() {
             margin-right: 5px;
         }
 
-        .error, #cancel-signing-process {
+        .error,
+        #cancel-signing-process {
             color: var(--dbp-danger-dark);
         }
 
@@ -94,11 +97,12 @@ export function getSignatureCss() {
         }
 
         /* using dbp-icon doesn't work */
-        button > [name=close], a > [name=close] {
+        button > [name='close'],
+        a > [name='close'] {
             font-size: 0.8em;
         }
 
-        a > [name=close] {
+        a > [name='close'] {
             color: var(--dbp-accent-dark);
         }
 
@@ -120,16 +124,17 @@ export function getSignatureCss() {
             flex: 1 0;
         }
 
-        .file-block, .box {
+        .file-block,
+        .box {
             border: var(--dbp-border-dark);
             padding: 10px;
         }
 
-        .file-block, .box .file {
+        .file-block,
+        .box .file {
             margin-top: 0;
         }
 
-
         .file-block {
             max-width: 320px;
             margin-bottom: 10px;
@@ -171,7 +176,8 @@ export function getSignatureCss() {
             text-align: right;
         }
 
-        .file-block .filename, .file-block div.bottom-line .headline {
+        .file-block .filename,
+        .file-block div.bottom-line .headline {
             text-overflow: ellipsis;
             overflow: hidden;
         }
@@ -202,12 +208,14 @@ export function getSignatureCss() {
             color: inherit;
         }
 
-        .is-disabled, .is-disabled.button[disabled] {
+        .is-disabled,
+        .is-disabled.button[disabled] {
             opacity: 0.2;
             pointer-events: none;
         }
 
-        #pdf-preview, #annotation-view {
+        #pdf-preview,
+        #annotation-view {
             position: sticky;
             top: 0px;
             height: 100vh;
@@ -251,9 +259,7 @@ export function getSignatureCss() {
             margin-bottom: 1.2em;
         }
 
-        @media only screen
-        and (orientation: portrait)
-        and (max-width: 768px) {
+        @media only screen and (orientation: portrait) and (max-width: 768px) {
             /* Modal preview, upload and external auth */
             div.right-container > * {
                 position: fixed;
@@ -285,13 +291,10 @@ export function getSignatureCss() {
                 max-width: inherit;
             }
 
-            #pdf-preview, #annotation-view {
+            #pdf-preview,
+            #annotation-view {
                 position: fixed;
             }
         }
-    
-    
     `;
-
-
 }

src/textswitch.js

 import {html, LitElement, css} from 'lit';
 import * as commonStyles from '@dbp-toolkit/common/styles';
 
-const BUTTON1 = "button1";
-const BUTTON2 = "button2";
+const BUTTON1 = 'button1';
+const BUTTON2 = 'button2';
 
 /**
  * Attributes:
@@ -20,11 +20,11 @@ const BUTTON2 = "button2";
 export class TextSwitch extends LitElement {
     constructor() {
         super();
-        this.value1 = "";
-        this.value2 = "";
-        this.name1 = "";
-        this.name2 = "";
-        this.name = "";
+        this.value1 = '';
+        this.value2 = '';
+        this.name1 = '';
+        this.name2 = '';
+        this.name = '';
         this.disabled = false;
         this._active = BUTTON1;
     }
@@ -82,7 +82,7 @@ export class TextSwitch extends LitElement {
 
     update(changedProperties) {
         changedProperties.forEach((oldValue, propName) => {
-            if (propName === "name") {
+            if (propName === 'name') {
                 if (this[propName] === this.name1) {
                     this._active = BUTTON1;
                 } else if (this[propName] === this.name2) {
@@ -100,7 +100,7 @@ export class TextSwitch extends LitElement {
             this.name = this._active === BUTTON1 ? this.name1 : this.name2;
 
             // send event only when buttons are clicked
-            const event = new CustomEvent("change", {
+            const event = new CustomEvent('change', {
                 bubbles: true,
                 cancelable: false,
             });
@@ -110,9 +110,18 @@ export class TextSwitch extends LitElement {
 
         return html`
             <div>
-                <button @click="${onClick}" class="button ${this._active === BUTTON1 ? `active` : ``}" id="${BUTTON1}" ?disabled="${this.disabled}">
+                <button
+                    @click="${onClick}"
+                    class="button ${this._active === BUTTON1 ? `active` : ``}"
+                    id="${BUTTON1}"
+                    ?disabled="${this.disabled}">
                     ${this.value1}
-                </button><button @click="${onClick}" class="button ${this._active === BUTTON2 ? `active` : ``}" id="${BUTTON2}" ?disabled="${this.disabled}">
+                </button>
+                <button
+                    @click="${onClick}"
+                    class="button ${this._active === BUTTON2 ? `active` : ``}"
+                    id="${BUTTON2}"
+                    ?disabled="${this.disabled}">
                     ${this.value2}
                 </button>
             </div>

src/utils.js

@@ -9,8 +9,8 @@ import {html} from 'lit';
  * @param results
  * @param identifierAttribute
  */
-export const findObjectInApiResults = (identifier, results, identifierAttribute = "@id") => {
-    const members = results["hydra:member"];
+export const findObjectInApiResults = (identifier, results, identifierAttribute = '@id') => {
+    const members = results['hydra:member'];
 
     if (members === undefined) {
         return;
@@ -24,7 +24,7 @@ export const findObjectInApiResults = (identifier, results, identifierAttribute
 };
 
 export const getPDFFileBase64Content = (file) => {
-    return file.contentUrl.replace(/data:\s*application\/pdf;\s*base64,/, "");
+    return file.contentUrl.replace(/data:\s*application\/pdf;\s*base64,/, '');
 };
 
 export const convertDataURIToBinary = (dataURI) => {
@@ -49,18 +49,16 @@ export const getDataURIContentType = (dataURI) => {
     return dataURI.substring(5, base64Index);
 };
 
-export const baseName = (str) =>
-{
+export const baseName = (str) => {
     let base = String(str).substring(str.lastIndexOf('/') + 1);
 
-    if (base.lastIndexOf(".") !== -1) {
-        base = base.substring(0, base.lastIndexOf("."));
+    if (base.lastIndexOf('.') !== -1) {
+        base = base.substring(0, base.lastIndexOf('.'));
     }
 
     return base;
 };
 
-
 export const fabricjs2pdfasPosition = (data) => {
     let angle = -(data.angle - 360) % 360;
     let bottom = data.bottom;
@@ -81,7 +79,7 @@ export const fabricjs2pdfasPosition = (data) => {
         x: Math.round(left),
         r: angle,
         w: Math.round(data.width), // only width, no "height" allowed in PDF-AS
-        p: data.currentPage
+        p: data.currentPage,
     };
 };
 
@@ -134,8 +132,9 @@ export const readArrayBufferFileContent = async (file) => {
  */
 export const getPDFSignatureCount = async (file) => {
     const sigRegex = new RegExp(
-        "/Type\\s*/Sig(.|\\s)*?/SubFilter\\s*(/ETSI\\.CAdES\\.detached|/adbe\\.pkcs7\\.detached)",
-        "g");
+        '/Type\\s*/Sig(.|\\s)*?/SubFilter\\s*(/ETSI\\.CAdES\\.detached|/adbe\\.pkcs7\\.detached)',
+        'g'
+    );
     const content = await readBinaryFileContent(file);
     let matches = 0;
     while (sigRegex.exec(content) !== null) {
@@ -183,8 +182,17 @@ export const getAnnotationFactoryFromFile = async (file) => {
  * @param value
  * @returns {AnnotationFactory} prepared to annotate
  */
-export const addKeyValuePdfAnnotationsToAnnotationFactory = (annotationFactory, activityNameDE, activityNameEN, personName,
-                                                             annotationType, annotationTypeNameDE, annotationTypeNameEN, organizationNumber, value) => {
+export const addKeyValuePdfAnnotationsToAnnotationFactory = (
+    annotationFactory,
+    activityNameDE,
+    activityNameEN,
+    personName,
+    annotationType,
+    annotationTypeNameDE,
+    annotationTypeNameEN,
+    organizationNumber,
+    value
+) => {
     annotationType = annotationType.trim();
     annotationTypeNameDE = annotationTypeNameDE.trim();
     annotationTypeNameEN = annotationTypeNameEN.trim();
@@ -198,12 +206,13 @@ export const addKeyValuePdfAnnotationsToAnnotationFactory = (annotationFactory,
 
     // add human readable annotation
     let author = personName + ' via  "' + activityNameDE + ' / ' + activityNameEN + '"';
-    let content = annotationTypeNameDE + ': ' + value +"\n" + annotationTypeNameEN + ': ' + value;
+    let content = annotationTypeNameDE + ': ' + value + '\n' + annotationTypeNameEN + ': ' + value;
     annotationFactory = addPdfAnnotationToAnnotationFactory(annotationFactory, author, content);
 
     // add machine readable annotation
     const organizationNumberContent = organizationNumber !== '' ? '_' + organizationNumber : '';
-    author = 'Maschinell aufgebracht, bitte nicht entfernen / Applied automatically, please do not remove';
+    author =
+        'Maschinell aufgebracht, bitte nicht entfernen / Applied automatically, please do not remove';
     content = 'dbp_annotation_' + annotationType + organizationNumberContent + '=' + value;
     annotationFactory = addPdfAnnotationToAnnotationFactory(annotationFactory, author, content);
 
@@ -225,13 +234,16 @@ export const addPdfAnnotationToAnnotationFactory = (annotationFactory, author, c
     // annotationFactory.checkRect(4, rect);
 
     // Create single free text annotation with print flag and 0 font size
-    let annotation = Object.assign(annotationFactory.createBaseAnnotation(page, rect, content, author), {
+    let annotation = Object.assign(
+        annotationFactory.createBaseAnnotation(page, rect, content, author),
+        {
             annotation_flag: 4, // enable print to be PDF/A conform
             color: {r: 1, g: 1, b: 1}, // white to (maybe) hide it better
             opacity: 0.001, // we can't set to 0 because of "if (opacity) {"
-        defaultAppearance: "/Invalid_font 0 Tf" // font size 0 to (maybe) hide it better
-    });
-    annotation.type = "/FreeText";
+            defaultAppearance: '/Invalid_font 0 Tf', // font size 0 to (maybe) hide it better
+        }
+    );
+    annotation.type = '/FreeText';
     annotationFactory.annotations.push(annotation);
 
     return annotationFactory;
@@ -245,20 +257,20 @@ export const addPdfAnnotationToAnnotationFactory = (annotationFactory, author, c
  */
 export const getAnnotationTypes = (key = null) => {
     const types = {
-        'bbe3a371': {
-            'name': {
-                'de': 'Geschäftszahl',
-                'en': 'Businessnumber',
+        bbe3a371: {
+            name: {
+                de: 'Geschäftszahl',
+                en: 'Businessnumber',
             },
-            'hasOrganization': true,
+            hasOrganization: true,
         },
         '85a4eb4c': {
-            'name': {
-                'de': 'Verwendungszweck',
-                'en': 'Intended use',
+            name: {
+                de: 'Verwendungszweck',
+                en: 'Intended use',
+            },
+            hasOrganization: false,
         },
-            'hasOrganization': false,
-        }
     };
 
     return key === null ? types : types[key] || {};

test/unit.js

@@ -41,27 +41,29 @@ suite('dbp-signature-app basics', () => {
 });
 
 suite('pdf signature detection', () => {
-
     function getPDFFile(data) {
         return new File([new Blob([data])], 'test.pdf', {type: 'application/pdf'});
     }
 
     test('getPDFSignatureCount', async () => {
         // Produced via pdf-as-web
-        let sig1 = "/Type\n/Sig\n/Filter\n/Adobe.PPKLite\n/SubFilter\n/ETSI.CAdES.detached";
-        let sig2 = "/Type\n/Sig\n/Filter\n/Adobe.PPKLite\n/SubFilter\n/adbe.pkcs7.detached";
+        let sig1 = '/Type\n/Sig\n/Filter\n/Adobe.PPKLite\n/SubFilter\n/ETSI.CAdES.detached';
+        let sig2 = '/Type\n/Sig\n/Filter\n/Adobe.PPKLite\n/SubFilter\n/adbe.pkcs7.detached';
         // Produced via https://www.handy-signatur.at
-        let sig3 = "/Type /Sig\n/Name (Max Meier)\n/Location ()\n/Reason ()\n/M (D:20210201154123+01'00')\n/Filter /asign.ECDSA\n/SubFilter /ETSI.CAdES.detached";
+        let sig3 =
+            "/Type /Sig\n/Name (Max Meier)\n/Location ()\n/Reason ()\n/M (D:20210201154123+01'00')\n/Filter /asign.ECDSA\n/SubFilter /ETSI.CAdES.detached";
 
-        assert(await getPDFSignatureCount(getPDFFile(sig1)) === 1);
-        assert(await getPDFSignatureCount(getPDFFile(sig2)) === 1);
-        assert(await getPDFSignatureCount(getPDFFile(sig3)) === 1);
-        assert(await getPDFSignatureCount(getPDFFile(sig1 + sig2)) === 2);
-        assert(await getPDFSignatureCount(getPDFFile("foo" + sig1 + "bar" + sig2 + "quux")) === 2);
-        assert(await getPDFSignatureCount(getPDFFile("\nfoo" + sig1 + "bar\n")) === 1);
-        assert(await getPDFSignatureCount(getPDFFile("\nfoo" + sig2 + "bar\n")) === 1);
+        assert((await getPDFSignatureCount(getPDFFile(sig1))) === 1);
+        assert((await getPDFSignatureCount(getPDFFile(sig2))) === 1);
+        assert((await getPDFSignatureCount(getPDFFile(sig3))) === 1);
+        assert((await getPDFSignatureCount(getPDFFile(sig1 + sig2))) === 2);
+        assert(
+            (await getPDFSignatureCount(getPDFFile('foo' + sig1 + 'bar' + sig2 + 'quux'))) === 2
+        );
+        assert((await getPDFSignatureCount(getPDFFile('\nfoo' + sig1 + 'bar\n'))) === 1);
+        assert((await getPDFSignatureCount(getPDFFile('\nfoo' + sig2 + 'bar\n'))) === 1);
 
-        assert(await getPDFSignatureCount(getPDFFile("foobar")) === 0);
-        assert(await getPDFSignatureCount(getPDFFile("")) === 0);
+        assert((await getPDFSignatureCount(getPDFFile('foobar'))) === 0);
+        assert((await getPDFSignatureCount(getPDFFile(''))) === 0);
     });
 });