refactor(network): Die Methode getAnnotationParams wurde aktualisiert, um die Anmerkung übersetzen und das Verhältnis ihrer Größe ändern zu können.

EnvelopeGenerator.Web/wwwroot/js/annotation.js

@@ -22,11 +22,12 @@
     }
 
     static async createSignature(element) {
+        const annotParams = await getAnnotationParams(element.left, element.top);
         const id = PSPDFKit.generateInstantId()
-        const width = Annotation.inchToPoint(element.width)
+        const width = annotParams.signature.width;
-        const height = Annotation.inchToPoint(element.height)
+        const height = annotParams.signature.height;
-        const top = Annotation.inchToPoint(element.top) - height / 2
+        const top = annotParams.signature.top;
-        const left = Annotation.inchToPoint(element.left) - width / 2
+        const left = annotParams.signature.left;
         const page = element.page - 1
 
         //signatures
@@ -36,12 +37,7 @@
             formFieldName: id,
             backgroundColor: PSPDFKit.Color.YELLOW,
             blendMode: 'multiply',
-            boundingBox: new PSPDFKit.Geometry.Rect({
+            boundingBox: new PSPDFKit.Geometry.Rect(annotParams.signature),
-                width,
-                height,
-                top,
-                left,
-            }),
         })
 
         const formField = new PSPDFKit.FormFields.SignatureFormField({

EnvelopeGenerator.Web/wwwroot/js/network.js

@@ -204,10 +204,20 @@ async function logout() {
     });
 }
 
-function getAnnotationParams() {
+function getAnnotationParams(leftInInch = 0, topInInch = 0, inchToPointFactor = 72) {
     return fetch(`${window.location.origin}/api/Config/Annotations`, {
         credentials: 'include',
         method: 'GET'
     })
-    .then(res => res.json());
+    .then(res => res.json())
+    .then(annotParams => {
+        for(var key in annotParams){
+            var annot = annotParams[key];
+            annot.width *= inchToPointFactor;
+            annot.height *= inchToPointFactor;
+            annot.left = (leftInInch + annot.left) * inchToPointFactor - annot.width / 2;
+            annot.top = (topInInch + annot.top) * inchToPointFactor - annot.height / 2;
+        }
+        return annotParams;
+    });
 }

EnvelopeGenerator.Web/wwwroot/js/network.min.js

@@ -1 +1 @@
-async function setLangAsync(n,t){document.getElementById("selectedFlag").className="fi "+t+" me-2";await fetch(`/lang/${n}`,{method:"POST",headers:{"Content-Type":"application/json"}})}async function setLanguage(n){const t=await fetch("/lang",{method:"GET",headers:{"Content-Type":"application/json"}}).then(n=>n.json()).then(t=>t.includes(n)).catch(()=>!1);if(t)return await fetch(`/lang/${n}`,{method:"POST",headers:{"Content-Type":"application/json"}}).then(n=>{if(n.redirected)window.location.href=n.url;else if(!n.ok)return Promise.reject("Failed to set language")})}async function logout(){return await fetch(`/auth/logout`,{method:"POST",headers:{"Content-Type":"application/json"}}).then(n=>{n.ok&&(window.location.href="/")})}function getAnnotationParams(){return fetch(`${window.location.origin}/api/Config/Annotations`,{credentials:"include",method:"GET"}).then(n=>n.json())}class Network{async getEnvelope(n){return this.getRequest(`/api/envelope/${n}`).then(this.wrapJsonResponse.bind(this))}async postEnvelope(n,t,i){return this.postRequest(`/api/envelope/${n}?index=${t}`,i).then(this.wrapJsonResponse.bind(this))}async getDocument(n,t){return this.getRequest(`/api/document/${n}?index=${t}`).then(this.wrapBinaryResponse.bind(this))}async openDocument(n){return this.postRequest(`/api/document/${n}`,{}).then(this.wrapJsonResponse.bind(this))}withCSRFToken(n){const t=getCSRFToken;let i=n.headers;return n.headers={...i,...t},n}getCSRFToken(){const n=document.getElementsByName("__RequestVerificationToken")[0].value;return{"X-XSRF-TOKEN":n}}getRequest(n){const t=this.getCSRFToken(),i={credentials:"include",method:"GET",headers:{...t}};return fetch(n,i)}postRequest(n,t){const i=this.getCSRFToken(),r={credentials:"include",method:"POST",headers:{...i,"Content-Type":"application/json; charset=utf-8"},body:JSON.stringify(t)};return fetch(n,r)}async wrapJsonResponse(n){return await this.wrapResponse(n,async n=>await n.json())}async wrapBinaryResponse(n){return await this.wrapResponse(n,async n=>await n.arrayBuffer())}async wrapResponse(n,t){let i;if(n.status===200){const r=await t(n);i=new WrappedResponse(r,null)}else if(n.status===403){const t=await n.json();i=new WrappedResponse(null,t)}else i=new WrappedResponse(null,null);return i}}class WrappedResponse{constructor(n,t){this.data=n;this.error=t;this.fatal=n===null&&t===null}}
+async function setLangAsync(n,t){document.getElementById("selectedFlag").className="fi "+t+" me-2";await fetch(`/lang/${n}`,{method:"POST",headers:{"Content-Type":"application/json"}})}async function setLanguage(n){const t=await fetch("/lang",{method:"GET",headers:{"Content-Type":"application/json"}}).then(n=>n.json()).then(t=>t.includes(n)).catch(()=>!1);if(t)return await fetch(`/lang/${n}`,{method:"POST",headers:{"Content-Type":"application/json"}}).then(n=>{if(n.redirected)window.location.href=n.url;else if(!n.ok)return Promise.reject("Failed to set language")})}async function logout(){return await fetch(`/auth/logout`,{method:"POST",headers:{"Content-Type":"application/json"}}).then(n=>{n.ok&&(window.location.href="/")})}function getAnnotationParams(n=0,t=0,i=72){return fetch(`${window.location.origin}/api/Config/Annotations`,{credentials:"include",method:"GET"}).then(n=>n.json()).then(r=>{var f,u;for(f in r)u=r[f],u.width*=i,u.height*=i,u.left=(n+u.left)*i-u.width/2,u.top=(t+u.top)*i-u.height/2;return r})}class Network{async getEnvelope(n){return this.getRequest(`/api/envelope/${n}`).then(this.wrapJsonResponse.bind(this))}async postEnvelope(n,t,i){return this.postRequest(`/api/envelope/${n}?index=${t}`,i).then(this.wrapJsonResponse.bind(this))}async getDocument(n,t){return this.getRequest(`/api/document/${n}?index=${t}`).then(this.wrapBinaryResponse.bind(this))}async openDocument(n){return this.postRequest(`/api/document/${n}`,{}).then(this.wrapJsonResponse.bind(this))}withCSRFToken(n){const t=getCSRFToken;let i=n.headers;return n.headers={...i,...t},n}getCSRFToken(){const n=document.getElementsByName("__RequestVerificationToken")[0].value;return{"X-XSRF-TOKEN":n}}getRequest(n){const t=this.getCSRFToken(),i={credentials:"include",method:"GET",headers:{...t}};return fetch(n,i)}postRequest(n,t){const i=this.getCSRFToken(),r={credentials:"include",method:"POST",headers:{...i,"Content-Type":"application/json; charset=utf-8"},body:JSON.stringify(t)};return fetch(n,r)}async wrapJsonResponse(n){return await this.wrapResponse(n,async n=>await n.json())}async wrapBinaryResponse(n){return await this.wrapResponse(n,async n=>await n.arrayBuffer())}async wrapResponse(n,t){let i;if(n.status===200){const r=await t(n);i=new WrappedResponse(r,null)}else if(n.status===403){const t=await n.json();i=new WrappedResponse(null,t)}else i=new WrappedResponse(null,null);return i}}class WrappedResponse{constructor(n,t){this.data=n;this.error=t;this.fatal=n===null&&t===null}}