refactor(app): simplify App initialization and rename PSPDFKit instance
- Initialize `currentDocument` and `currentReceiver` directly in constructor - Replace `Instance` with `pdfKit` for clearer naming - Remove redundant envelope/document loading in `init` - Update all method references to use `this.pdfKit`
This commit is contained in:
parent
3b9b930b82
commit
7d4106d0a5
@ -2,9 +2,9 @@ class App {
|
||||
constructor(envelopeKey, envelopeReceiver, documentBytes, licenseKey, locale, container) {
|
||||
this.container = container ?? `#${this.constructor.name.toLowerCase()}`;
|
||||
this.envelopeKey = envelopeKey
|
||||
this.Instance = null
|
||||
this.currentDocument = null
|
||||
this.currentReceiver = null
|
||||
this.pdfKit = null
|
||||
this.currentDocument = envelopeReceiver.envelope.documents[0]
|
||||
this.currentReceiver = envelopeReceiver.receiver
|
||||
this.signatureCount = 0;
|
||||
this.envelopeReceiver = envelopeReceiver;
|
||||
this.documentBytes = documentBytes;
|
||||
@ -12,51 +12,32 @@ class App {
|
||||
this.locale = locale;
|
||||
}
|
||||
|
||||
// This function will be called from the ShowEnvelope.razor page
|
||||
// and will trigger loading of the Editor Interface
|
||||
async init() {
|
||||
// Load the envelope from the database
|
||||
this.currentDocument = this.envelopeReceiver.envelope.documents[0]
|
||||
this.currentReceiver = this.envelopeReceiver.receiver
|
||||
|
||||
// Load the document from the filestore
|
||||
const documentResponse = this.documentBytes
|
||||
|
||||
if (documentResponse.fatal || documentResponse.error) {
|
||||
return Swal.fire({
|
||||
title: 'Fehler',
|
||||
text: 'Dokument konnte nicht geladen werden!',
|
||||
icon: 'error',
|
||||
})
|
||||
}
|
||||
|
||||
const arrayBuffer = this.documentBytes
|
||||
|
||||
// Load PSPDFKit
|
||||
this.Instance = await UI.loadPSPDFKit(arrayBuffer, this.container, this.licenseKey, this.locale)
|
||||
UI.addToolbarItems(this.Instance, this.handleClick.bind(this))
|
||||
this.pdfKit = await UI.loadPSPDFKit(this.documentBytes, this.container, this.licenseKey, this.locale)
|
||||
UI.addToolbarItems(this.pdfKit, this.handleClick.bind(this))
|
||||
|
||||
this.Instance.addEventListener(
|
||||
this.pdfKit.addEventListener(
|
||||
'annotations.load',
|
||||
this.handleAnnotationsLoad.bind(this)
|
||||
)
|
||||
this.Instance.addEventListener(
|
||||
this.pdfKit.addEventListener(
|
||||
'annotations.change',
|
||||
this.handleAnnotationsChange.bind(this)
|
||||
)
|
||||
this.Instance.addEventListener(
|
||||
this.pdfKit.addEventListener(
|
||||
'annotations.create',
|
||||
this.handleAnnotationsCreate.bind(this)
|
||||
)
|
||||
|
||||
this.Instance.addEventListener("annotations.willChange", _ => {
|
||||
this.pdfKit.addEventListener("annotations.willChange", _ => {
|
||||
Comp.ActPanel.Toggle();
|
||||
});
|
||||
|
||||
// Load annotations into PSPDFKit
|
||||
try {
|
||||
this.signatureCount = this.currentDocument.elements.length
|
||||
await createAnnotations(this.currentDocument, this.Instance)
|
||||
await createAnnotations(this.currentDocument, this.pdfKit)
|
||||
} catch (e) {
|
||||
console.error("Error loading annotations:", e);
|
||||
}
|
||||
@ -96,7 +77,7 @@ class App {
|
||||
|
||||
const request = await fetch(imageUrl)
|
||||
const blob = await request.blob()
|
||||
const imageAttachmentId = await this.Instance.createAttachment(blob)
|
||||
const imageAttachmentId = await this.pdfKit.createAttachment(blob)
|
||||
|
||||
const frameAnnotation = createImageAnnotation(
|
||||
new PSPDFKit.Geometry.Rect({
|
||||
@ -109,7 +90,7 @@ class App {
|
||||
imageAttachmentId
|
||||
)
|
||||
|
||||
this.Instance.create(frameAnnotation)
|
||||
this.pdfKit.create(frameAnnotation)
|
||||
}
|
||||
}
|
||||
|
||||
@ -195,7 +176,7 @@ class App {
|
||||
}
|
||||
|
||||
async handleFinish(event) {
|
||||
const iJSON = await this.Instance.exportInstantJSON()
|
||||
const iJSON = await this.pdfKit.exportInstantJSON()
|
||||
const iFormFieldValues = await iJSON.formFieldValues;
|
||||
|
||||
//check required
|
||||
@ -249,7 +230,7 @@ class App {
|
||||
//---
|
||||
// Save changes before doing anything
|
||||
try {
|
||||
await this.Instance.save()
|
||||
await this.pdfKit.save()
|
||||
} catch (e) {
|
||||
Swal.fire({
|
||||
title: 'Fehler',
|
||||
@ -293,7 +274,7 @@ class App {
|
||||
|
||||
|
||||
async validateAnnotations(totalSignatures) {
|
||||
const annotations = await getAnnotations(this.Instance)
|
||||
const annotations = await getAnnotations(this.pdfKit)
|
||||
const filtered = annotations
|
||||
.map(a => a.toJS())
|
||||
.filter(a => a.isSignature)
|
||||
@ -314,7 +295,7 @@ class App {
|
||||
})
|
||||
|
||||
if (result.isConfirmed) {
|
||||
const result = await deleteAnnotations(this.Instance)
|
||||
const result = await deleteAnnotations(this.pdfKit)
|
||||
}
|
||||
|
||||
return result
|
||||
|
||||
4
EnvelopeGenerator.Web/wwwroot/js/app.min.js
vendored
4
EnvelopeGenerator.Web/wwwroot/js/app.min.js
vendored
@ -1,3 +1,3 @@
|
||||
class App{constructor(n,t,i,r,u,f){this.container=f??`#${this.constructor.name.toLowerCase()}`;this.envelopeKey=n;this.Instance=null;this.currentDocument=null;this.currentReceiver=null;this.signatureCount=0;this.envelopeReceiver=t;this.documentBytes=i;this.licenseKey=r;this.locale=u}async init(){this.currentDocument=this.envelopeReceiver.envelope.documents[0];this.currentReceiver=this.envelopeReceiver.receiver;const n=this.documentBytes;if(n.fatal||n.error)return Swal.fire({title:"Fehler",text:"Dokument konnte nicht geladen werden!",icon:"error"});const t=this.documentBytes;this.Instance=await UI.loadPSPDFKit(t,this.container,this.licenseKey,this.locale);UI.addToolbarItems(this.Instance,this.handleClick.bind(this));this.Instance.addEventListener("annotations.load",this.handleAnnotationsLoad.bind(this));this.Instance.addEventListener("annotations.change",this.handleAnnotationsChange.bind(this));this.Instance.addEventListener("annotations.create",this.handleAnnotationsCreate.bind(this));this.Instance.addEventListener("annotations.willChange",()=>{Comp.ActPanel.Toggle()});try{this.signatureCount=this.currentDocument.elements.length;await createAnnotations(this.currentDocument,this.Instance)}catch(i){console.error("Error loading annotations:",i)}[...document.getElementsByClassName("btn_refresh")].forEach(n=>n.addEventListener("click",()=>this.handleClick("RESET")));[...document.getElementsByClassName("btn_complete")].forEach(n=>n.addEventListener("click",()=>this.handleClick("FINISH")));[...document.getElementsByClassName("btn_reject")].forEach(n=>n.addEventListener("click",()=>this.handleClick("REJECT")))}handleAnnotationsLoad(n){n.toJS()}handleAnnotationsChange(){}async handleAnnotationsCreate(n){const t=n.toJS()[0],i=!!t.formFieldName,r=!!t.isSignature;if(i===!1&&r===!0){const r=t.boundingBox.left-20,u=t.boundingBox.top-20,n=150,i=75,f=new Date,e=await createAnnotationFrameBlob(this.envelopeReceiver.name,this.currentReceiver.signature,f,n,i),o=await fetch(e),s=await o.blob(),h=await this.Instance.createAttachment(s),c=createImageAnnotation(new PSPDFKit.Geometry.Rect({left:r,top:u,width:n,height:i}),t.pageIndex,h);this.Instance.create(c)}}async handleClick(n){let t=!1;switch(n){case"RESET":t=await this.handleReset(null);Comp.SignatureProgress.SignedCount=0;t.isConfirmed&&Swal.fire({title:"Erfolg",text:"Dokument wurde zurückgesetzt",icon:"info"});break;case"FINISH":t=await this.handleFinish(null);t==!0&&(window.location.href=`/Envelope/${this.envelopeKey}`);break;case"REJECT":Swal.fire({title:localized.rejection,html:`<div class="text-start fs-6 p-0 m-0">${localized.rejectionReasonQ}</div>`,icon:"question",input:"text",inputAttributes:{autocapitalize:"off"},showCancelButton:!0,confirmButtonColor:"#3085d6",cancelButtonColor:"#d33",confirmButtonText:localized.complete,cancelButtonText:localized.back,showLoaderOnConfirm:!0,preConfirm:async n=>{try{return await rejectEnvelope(n)}catch(t){Swal.showValidationMessage(`
|
||||
class App{constructor(n,t,i,r,u,f){this.container=f??`#${this.constructor.name.toLowerCase()}`;this.envelopeKey=n;this.pdfKit=null;this.currentDocument=t.envelope.documents[0];this.currentReceiver=t.receiver;this.signatureCount=0;this.envelopeReceiver=t;this.documentBytes=i;this.licenseKey=r;this.locale=u}async init(){this.pdfKit=await UI.loadPSPDFKit(this.documentBytes,this.container,this.licenseKey,this.locale);UI.addToolbarItems(this.pdfKit,this.handleClick.bind(this));this.pdfKit.addEventListener("annotations.load",this.handleAnnotationsLoad.bind(this));this.pdfKit.addEventListener("annotations.change",this.handleAnnotationsChange.bind(this));this.pdfKit.addEventListener("annotations.create",this.handleAnnotationsCreate.bind(this));this.pdfKit.addEventListener("annotations.willChange",()=>{Comp.ActPanel.Toggle()});try{this.signatureCount=this.currentDocument.elements.length;await createAnnotations(this.currentDocument,this.pdfKit)}catch(n){console.error("Error loading annotations:",n)}[...document.getElementsByClassName("btn_refresh")].forEach(n=>n.addEventListener("click",()=>this.handleClick("RESET")));[...document.getElementsByClassName("btn_complete")].forEach(n=>n.addEventListener("click",()=>this.handleClick("FINISH")));[...document.getElementsByClassName("btn_reject")].forEach(n=>n.addEventListener("click",()=>this.handleClick("REJECT")))}handleAnnotationsLoad(n){n.toJS()}handleAnnotationsChange(){}async handleAnnotationsCreate(n){const t=n.toJS()[0],i=!!t.formFieldName,r=!!t.isSignature;if(i===!1&&r===!0){const r=t.boundingBox.left-20,u=t.boundingBox.top-20,n=150,i=75,f=new Date,e=await createAnnotationFrameBlob(this.envelopeReceiver.name,this.currentReceiver.signature,f,n,i),o=await fetch(e),s=await o.blob(),h=await this.pdfKit.createAttachment(s),c=createImageAnnotation(new PSPDFKit.Geometry.Rect({left:r,top:u,width:n,height:i}),t.pageIndex,h);this.pdfKit.create(c)}}async handleClick(n){let t=!1;switch(n){case"RESET":t=await this.handleReset(null);Comp.SignatureProgress.SignedCount=0;t.isConfirmed&&Swal.fire({title:"Erfolg",text:"Dokument wurde zurückgesetzt",icon:"info"});break;case"FINISH":t=await this.handleFinish(null);t==!0&&(window.location.href=`/Envelope/${this.envelopeKey}`);break;case"REJECT":Swal.fire({title:localized.rejection,html:`<div class="text-start fs-6 p-0 m-0">${localized.rejectionReasonQ}</div>`,icon:"question",input:"text",inputAttributes:{autocapitalize:"off"},showCancelButton:!0,confirmButtonColor:"#3085d6",cancelButtonColor:"#d33",confirmButtonText:localized.complete,cancelButtonText:localized.back,showLoaderOnConfirm:!0,preConfirm:async n=>{try{return await rejectEnvelope(n)}catch(t){Swal.showValidationMessage(`
|
||||
Request failed: ${t}
|
||||
`)}},allowOutsideClick:()=>!Swal.isLoading()}).then(n=>{if(n.isConfirmed){const t=n.value;t.ok?reload():Swal.showValidationMessage(`Request failed: ${t.message}`)}});break;case"COPY_URL":const n=window.location.href.replace(/\/readonly/gi,"");navigator.clipboard.writeText(n).then(function(){bsNotify("Kopiert",{alert_type:"success",delay:4,icon_name:"check_circle"})}).catch(function(){bsNotify("Unerwarteter Fehler",{alert_type:"danger",delay:4,icon_name:"error"})});break;case"SHARE":Comp.ShareBackdrop.show();break;case"LOGOUT":await logout()}}async handleFinish(){const n=await this.Instance.exportInstantJSON(),t=await n.formFieldValues,r=t.filter(n=>isFieldRequired(n)),u=r.some(n=>n.value===undefined||n.value===null||n.value==="");if(u)return Swal.fire({title:"Warnung",text:"Bitte füllen Sie alle Standortinformationen vollständig aus!",icon:"warning"}),!1;const f=new RegExp("^[a-zA-Z\\u0080-\\u024F]+(?:([\\ \\-\\']|(\\.\\ ))[a-zA-Z\\u0080-\\u024F]+)*$"),e=t.filter(n=>isCityField(n));for(var i of e)if(!IS_MOBILE_DEVICE&&!f.test(i.value))return Swal.fire({title:"Warnung",text:`Bitte überprüfen Sie die eingegebene Ortsangabe "${i.value}" auf korrekte Formatierung. Beispiele für richtige Formate sind: München, Île-de-France, Sauðárkrókur, San Francisco, St. Catharines usw.`,icon:"warning"}),!1;const o=await this.validateAnnotations(this.signatureCount);return o===!1?(Swal.fire({title:"Warnung",text:"Es wurden nicht alle Signaturfelder ausgefüllt!",icon:"warning"}),!1):Swal.fire({title:localized.confirmation,html:`<div class="text-start fs-6 p-0 m-0">${localized.sigAgree}</div>`,icon:"question",showCancelButton:!0,confirmButtonColor:"#3085d6",cancelButtonColor:"#d33",confirmButtonText:localized.finalize,cancelButtonText:localized.back}).then(async t=>{if(t.isConfirmed){try{await this.Instance.save()}catch(i){return Swal.fire({title:"Fehler",text:"Umschlag konnte nicht signiert werden!",icon:"error"}),!1}try{const t=await signEnvelope(await n);if(t.ok)return!0;if(t.status===403)return Swal.fire({title:"Warnung",text:"Umschlag ist nicht mehr verfügbar.",icon:"warning"}),!1;throw new Error;}catch(i){return Swal.fire({title:"Fehler",text:"Umschlag konnte nicht signiert werden!",icon:"error"}),!1}}else return!1})}async validateAnnotations(n){const t=await getAnnotations(this.Instance),i=t.map(n=>n.toJS()).filter(n=>n.isSignature);return n>i.length?!1:!0}async handleReset(){const n=await Swal.fire({title:"Sind sie sicher?",text:"Wollen Sie das Dokument und alle erstellten Signaturen zurücksetzen?",icon:"question",showCancelButton:!0});if(n.isConfirmed){const n=await deleteAnnotations(this.Instance)}return n}}
|
||||
`)}},allowOutsideClick:()=>!Swal.isLoading()}).then(n=>{if(n.isConfirmed){const t=n.value;t.ok?reload():Swal.showValidationMessage(`Request failed: ${t.message}`)}});break;case"COPY_URL":const n=window.location.href.replace(/\/readonly/gi,"");navigator.clipboard.writeText(n).then(function(){bsNotify("Kopiert",{alert_type:"success",delay:4,icon_name:"check_circle"})}).catch(function(){bsNotify("Unerwarteter Fehler",{alert_type:"danger",delay:4,icon_name:"error"})});break;case"SHARE":Comp.ShareBackdrop.show();break;case"LOGOUT":await logout()}}async handleFinish(){const n=await this.pdfKit.exportInstantJSON(),t=await n.formFieldValues,r=t.filter(n=>isFieldRequired(n)),u=r.some(n=>n.value===undefined||n.value===null||n.value==="");if(u)return Swal.fire({title:"Warnung",text:"Bitte füllen Sie alle Standortinformationen vollständig aus!",icon:"warning"}),!1;const f=new RegExp("^[a-zA-Z\\u0080-\\u024F]+(?:([\\ \\-\\']|(\\.\\ ))[a-zA-Z\\u0080-\\u024F]+)*$"),e=t.filter(n=>isCityField(n));for(var i of e)if(!IS_MOBILE_DEVICE&&!f.test(i.value))return Swal.fire({title:"Warnung",text:`Bitte überprüfen Sie die eingegebene Ortsangabe "${i.value}" auf korrekte Formatierung. Beispiele für richtige Formate sind: München, Île-de-France, Sauðárkrókur, San Francisco, St. Catharines usw.`,icon:"warning"}),!1;const o=await this.validateAnnotations(this.signatureCount);return o===!1?(Swal.fire({title:"Warnung",text:"Es wurden nicht alle Signaturfelder ausgefüllt!",icon:"warning"}),!1):Swal.fire({title:localized.confirmation,html:`<div class="text-start fs-6 p-0 m-0">${localized.sigAgree}</div>`,icon:"question",showCancelButton:!0,confirmButtonColor:"#3085d6",cancelButtonColor:"#d33",confirmButtonText:localized.finalize,cancelButtonText:localized.back}).then(async t=>{if(t.isConfirmed){try{await this.pdfKit.save()}catch(i){return Swal.fire({title:"Fehler",text:"Umschlag konnte nicht signiert werden!",icon:"error"}),!1}try{const t=await signEnvelope(await n);if(t.ok)return!0;if(t.status===403)return Swal.fire({title:"Warnung",text:"Umschlag ist nicht mehr verfügbar.",icon:"warning"}),!1;throw new Error;}catch(i){return Swal.fire({title:"Fehler",text:"Umschlag konnte nicht signiert werden!",icon:"error"}),!1}}else return!1})}async validateAnnotations(n){const t=await getAnnotations(this.pdfKit),i=t.map(n=>n.toJS()).filter(n=>n.isSignature);return n>i.length?!1:!0}async handleReset(){const n=await Swal.fire({title:"Sind sie sicher?",text:"Wollen Sie das Dokument und alle erstellten Signaturen zurücksetzen?",icon:"question",showCancelButton:!0});if(n.isConfirmed){const n=await deleteAnnotations(this.pdfKit)}return n}}
|
||||
Loading…
x
Reference in New Issue
Block a user