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) await this.Network.postHistory(this.envelopeKey, ActionType.Seen) } catch (e) { console.error(e) } } handleAnnotationsLoad(loadedAnnotations) { console.log('annotations loaded', loadedAnnotations.toJS()) } handleAnnotationsChange() {} async handleAnnotationsCreate(createdAnnotations) { const annotation = createdAnnotations.toJS()[0] const isFormField = !!annotation.formFieldName const isSignature = !!annotation.isSignature if (isFormField === false && isSignature === true) { const left = annotation.boundingBox.left - 25; const top = annotation.boundingBox.top - 25; const width = 150; const height = 75; 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 = this.Annotation.createImageAnnotation(new PSPDFKit.Geometry.Rect({ left: left, top: top, width: width, height: height, }), annotation.pageIndex, imageAttachmentId) 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) { // Redirect to success page after saving to database window.location.href = `/EnvelopeKey/${this.envelopeKey}/Success` } 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) ) console.log(postEnvelopeResult) 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 } } }