AppStd/EnvelopeGenerator
8
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Hinzufügen von Beschriftungen mit schreibgeschütztem PSPDF Kit-Textformularfeld. Statische PSPDF-Kit-Instanz erstellt.

Browse Source
This commit is contained in:
Developer 02
2024-07-05 17:15:51 +02:00
parent b3b2baf0e4
commit 8eefd94569
5 changed files with 125 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

138
EnvelopeGenerator.Web/wwwroot/js/annotation.js
View File

@@ -1,9 +1,9 @@
class Annotation {
static async createAnnotations(document) {
static async createAnnotations(document, instance) {
const signatures = []
for(var element of document.elements){
const [annotation, formField, annotation_date, formFieldDate, annotation_postcode, formFieldPostcode, annotation_city, formFieldCity] = await Annotation.createSignature(element)
for (var element of document.elements) {
const [annotation, formField, annotation_date, formFieldDate, annotation_postcode, formFieldPostcode, annotation_city, formFieldCity, annotation_date_label, formFieldDateLabel, annotation_postcode_label, formFieldPostcodeLabel, annotation_city_label, formFieldCityLabel] = await Annotation.createSignature(element)
signatures.push(annotation)
signatures.push(formField)
signatures.push(annotation_date)
@@ -12,9 +12,18 @@
signatures.push(formFieldPostcode)
signatures.push(annotation_city)
signatures.push(formFieldCity)
signatures.push(annotation_date_label)
signatures.push(formFieldDateLabel)
signatures.push(annotation_postcode_label)
signatures.push(formFieldPostcodeLabel)
signatures.push(annotation_city_label)
signatures.push(formFieldCityLabel)
}
return [...signatures ]
await instance.create(signatures)
}
static async createSignature(element) {
@@ -45,6 +54,10 @@
annotationIds: PSPDFKit.Immutable.List([annotation.id]),
})
/**
* Date, post code and place text form part
*/
const date_place_top_shift = 16
//date
const id_date = PSPDFKit.generateInstantId()
const annotation_date = new PSPDFKit.Annotations.WidgetAnnotation({
@@ -56,17 +69,17 @@
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.75,
height: height / 2,
top: top + height + 25,
top: top + height + 25 + date_place_top_shift,
left: left - width * .25,
}),
fontSize:8,
fontSize: 8,
additionalActions: {
onFormat: new PSPDFKit.Actions.JavaScriptAction({
script: `AFDate_FormatEx("dd/mm/yyyy")`,
}),
onFormat: new PSPDFKit.Actions.JavaScriptAction({
script: `AFDate_FormatEx("dd/mm/yyyy")`,
}),
}
})
const formFieldDate = new PSPDFKit.FormFields.TextFormField({
name: id_date,
annotationIds: PSPDFKit.Immutable.List([annotation_date.id]),
@@ -85,12 +98,12 @@
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.45,
height: height / 2,
top: top + height + 25,
top: top + height + 25 + date_place_top_shift,
left: left - width * .25 + width * 0.80,
}),
fontSize:8
fontSize: 8
})
const formFieldPostcode = new PSPDFKit.FormFields.TextFormField({
name: id_postcode,
annotationIds: PSPDFKit.Immutable.List([annotation_postcode.id]),
@@ -109,19 +122,104 @@
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.75,
height: height / 2,
top: top + height + 25,
top: top + height + 25 + date_place_top_shift,
left: left - width * .25 + width * 1.30,
}),
fontSize:8
fontSize: 8
})
const formFieldCity = new PSPDFKit.FormFields.TextFormField({
name: id_city,
annotationIds: PSPDFKit.Immutable.List([annotation_city.id]),
value: location.city
value: location.city,
})
return [annotation, formField, annotation_date, formFieldDate, annotation_postcode, formFieldPostcode, annotation_city, formFieldCity]
/**
* Date, post code and place label part
*/
const label_top_shift = -15
//date label
const id_date_label = PSPDFKit.generateInstantId()
const annotation_date_label = new PSPDFKit.Annotations.WidgetAnnotation({
id: id_date_label,
pageIndex: page,
formFieldName: id_date_label,
blendMode: 'multiply',
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.75,
height: height / 2,
top: top + height + 25 + label_top_shift + date_place_top_shift,
left: left - width * .25,
}),
fontSize: 8,
backgroundColor: PSPDFKit.Color.TRANSPARENT,
fontColor: PSPDFKit.Color.Black,
isBold: true,
required: true
})
const formFieldDateLabel = new PSPDFKit.FormFields.TextFormField({
name: id_date_label,
annotationIds: PSPDFKit.Immutable.List([annotation_date_label.id]),
value: "Date",
readOnly: true
})
//postcode label
const id_postcode_label = PSPDFKit.generateInstantId()
const annotation_postcode_label = new PSPDFKit.Annotations.WidgetAnnotation({
id: id_postcode_label,
pageIndex: page,
formFieldName: id_postcode_label,
blendMode: 'multiply',
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.45,
height: height / 2,
top: top + height + 25 + label_top_shift + date_place_top_shift,
left: left - width * .25 + width * 0.80,
}),
fontSize: 8,
backgroundColor: PSPDFKit.Color.TRANSPARENT,
fontColor: PSPDFKit.Color.Black,
isBold: true,
required: true
})
const formFieldPostcodeLabel = new PSPDFKit.FormFields.TextFormField({
name: id_postcode_label,
annotationIds: PSPDFKit.Immutable.List([annotation_postcode_label.id]),
value: "PLZ",
readOnly: true
})
//city label
const id_city_label = PSPDFKit.generateInstantId()
const annotation_city_label = new PSPDFKit.Annotations.WidgetAnnotation({
id: id_city_label,
pageIndex: page,
formFieldName: id_city_label,
blendMode: 'multiply',
boundingBox: new PSPDFKit.Geometry.Rect({
width: width * 0.75,
height: height / 2,
top: top + height + 25 + label_top_shift + date_place_top_shift,
left: left - width * .25 + width * 1.30,
}),
fontSize: 8,
backgroundColor: PSPDFKit.Color.TRANSPARENT,
fontColor: PSPDFKit.Color.Black,
isBold: true,
})
const formFieldCityLabel = new PSPDFKit.FormFields.TextFormField({
name: id_city_label,
annotationIds: PSPDFKit.Immutable.List([annotation_city_label.id]),
value: "Ort",
readOnly: true
})
return [annotation, formField, annotation_date, formFieldDate, annotation_postcode, formFieldPostcode, annotation_city, formFieldCity, annotation_date_label, formFieldDateLabel, annotation_postcode_label, formFieldPostcodeLabel, annotation_city_label, formFieldCityLabel]
}
static createTextBox(element) {
@@ -176,7 +274,7 @@
const pageAnnotations = allAnnotations.filter(Annotation.isSignature)
//deleting all Annotations
return await instance.delete(pageAnnotations)
}
}
static async validateAnnotations(instance) {
const allAnnotations = await Annotation.getAnnotations(instance)
@@ -211,7 +309,7 @@
const canvas = document.createElement('canvas')
const scale = 4
const fontSize = 10
canvas.width = width * scale
canvas.height = height * scale

3
EnvelopeGenerator.Web/wwwroot/js/app.js
View File

@@ -70,8 +70,7 @@ class App {
// Load annotations into PSPDFKit
try {
this.signatureCount = this.currentDocument.elements.length
const annotations = await Annotation.createAnnotations(this.currentDocument)
await this.Instance.create(annotations)
await Annotation.createAnnotations(this.currentDocument, this.Instance)
const openResponse = await this.Network.openDocument(this.envelopeKey)

5
EnvelopeGenerator.Web/wwwroot/js/ui.js
View File

@@ -14,8 +14,9 @@
// Load the PSPDFKit UI by setting a target element as the container to render in
// and a arraybuffer which represents the document that should be displayed.
static Instance
static loadPSPDFKit(arrayBuffer, container, licenseKey, locale) {
return PSPDFKit.load({
UI.Instance = PSPDFKit.load({
locale: locale,
licenseKey: licenseKey,
styleSheets: ['/css/site.css'],
@@ -43,6 +44,8 @@
Annotation: UI.annotationRenderer,
},
})
return UI.Instance;
}
static configurePSPDFKit(instance, handler) {

1
EnvelopeGenerator.Web/wwwroot/js/util.js
View File

@@ -52,6 +52,5 @@ function locale_date_dd_mm_yyyy() {
const day = String(today.getDate()).padStart(2, '0');
const month = String(today.getMonth() + 1).padStart(2, '0');
const year = String(today.getFullYear()).slice(-4);
console.log(`${day}/${month}/${year}`)
return `${day}/${month}/${year}`;
}