const ActionType = { Created: 0, Saved: 1, Sent: 2, EmailSent: 3, Delivered: 4, Seen: 5, Signed: 6, Rejected: 7 } class App { constructor(container, envelopeKey) { this.container = container; this.envelopeKey = envelopeKey; // Initialize classes console.debug("Initializing classes..") this.UI = new UI(); this.Network = new Network(); this.Annotation = new Annotation(); this.Instance = null; this.currentDocument = null; this.currentReceiver = null; } // This function will be called in the ShowEnvelope.razor page // and will trigger loading of the Editor Interface async init() { // Load the envelope from the database console.debug("Loading envelope from database..") const envelopeObject = await this.Network.getEnvelope(this.envelopeKey); this.currentDocument = envelopeObject.envelope.documents[0]; this.currentReceiver = envelopeObject.receiver; console.log(envelopeObject) // Load the document from the filestore console.debug("Loading document from filestore") let arrayBuffer try { arrayBuffer = await this.Network.getDocument(this.envelopeKey, this.currentDocument.id); } catch (e) { console.error(e) } // Load PSPDFKit console.debug("Loading PSPDFKit..") this.Instance = await this.UI.loadPSPDFKit(arrayBuffer, this.container) this.UI.configurePSPDFKit(this.Instance, this.handleClick.bind(this)) this.Instance.addEventListener("annotations.load", this.handleAnnotationsLoad) this.Instance.addEventListener("annotations.change", this.handleAnnotationsChange) this.Instance.addEventListener("annotations.create", this.handleAnnotationsCreate.bind(this)) // Load annotations into PSPDFKit console.debug("Loading annotations..") try { const annotations = this.Annotation.createAnnotations(this.currentDocument) const createdAnnotations = await this.Instance.create(annotations) const description = "Umschlag wurde geöffnet" await this.Network.postHistory(this.envelopeKey, ActionType.Seen, description); } catch (e) { console.error(e) } } handleAnnotationsLoad(loadedAnnotations) { console.log("annotations loaded", loadedAnnotations.toJS()); } handleAnnotationsChange() {} async handleAnnotationsCreate(createdAnnotations) { console.log("annotations created"); console.log(createdAnnotations.toJS()) const annotation = createdAnnotations.toJS()[0]; const isFormField = !!annotation.formFieldName; const isSignature = !!annotation.isSignature; console.log("form field", isFormField, "signature", isSignature) //if (!isSignature) { // return; //} //if (!(isFormField && isSignature)) { // return; //} if (isFormField === false && isSignature === true) { const left = annotation.boundingBox.left - 25; const top = annotation.boundingBox.top - 25; const width = 150; const height = 75; console.log(annotation.boundingBox) const imageUrl = await this.Annotation.createAnnotationFrameBlob(this.currentReceiver.name, width, height); const request = await fetch(imageUrl); const blob = await request.blob(); const imageAttachmentId = await this.Instance.createAttachment(blob); const frameAnnotation = new PSPDFKit.Annotations.ImageAnnotation({ pageIndex: annotation.pageIndex, isSignature: false, readOnly: true, locked: true, lockedContents: true, contentType: 'image/png', imageAttachmentId, description: 'FRAME', boundingBox: new PSPDFKit.Geometry.Rect({ left: left, top: top, width: width, height: height, }), }); this.Instance.create(frameAnnotation); } } async handleClick(eventType) { let result = false; switch (eventType) { case "RESET": result = await this.handleReset(null) if (result == true) { alert("Dokument zurückgesetzt!"); } else { alert("Fehler beim Zurücksetzen des Dokuments!") } break; case "FINISH": result = await this.handleFinish(null) if (result == true) { // TODO: Redirect to success page alert("Dokument erfolgreich signiert!") } else { alert("Fehler beim Abschließen des Dokuments!") } break; } } async handleFinish(event) { // Save changes before doing anything try { await this.Instance.save(); } catch (e) { console.error(e); return false; } // Export annotation data and save to database try { const json = await this.Instance.exportInstantJSON() const postEnvelopeResult = await this.Network.postEnvelope(this.envelopeKey, this.currentDocument.id, JSON.stringify(json)) if (postEnvelopeResult === false) { return false; } } catch (e) { console.error(e); return false; } return true; } async handleReset(event) { if (confirm("Wollen Sie das Dokument und alle erstellten Signaturen zurücksetzen?")) { const result = this.Annotation.deleteAnnotations(this.Instance) return true; } else { return true; } } }