04-10-2023

This commit is contained in:
Jonathan Jenne
2023-10-04 11:44:26 +02:00
parent d7d457b82a
commit 6de7ec0050
7 changed files with 373 additions and 293 deletions

View File

@@ -50,9 +50,11 @@ var App = /** @class */ (function () {
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
App.ui = new UI();
App.UI = new UI();
App.Network = new Network();
App.Annotation = new Annotation();
console.debug("Loading PSPDFKit..");
return [4 /*yield*/, App.loadData("/api/get-data/".concat(envelopeKey))];
return [4 /*yield*/, App.Network.loadData(envelopeKey)];
case 1:
envelopeObject = _b.sent();
App.envelopeKey = envelopeKey;
@@ -60,7 +62,7 @@ var App = /** @class */ (function () {
_b.label = 2;
case 2:
_b.trys.push([2, 4, , 5]);
return [4 /*yield*/, App.loadDocument("/api/download/".concat(envelopeKey, "?id=").concat(App.currentDocument.id))];
return [4 /*yield*/, App.Network.loadDocument(envelopeKey, App.currentDocument.id)];
case 3:
arrayBuffer = _b.sent();
return [3 /*break*/, 5];
@@ -70,16 +72,16 @@ var App = /** @class */ (function () {
return [3 /*break*/, 5];
case 5:
_a = App;
return [4 /*yield*/, App.loadPSPDFKit(arrayBuffer, container)];
return [4 /*yield*/, App.UI.loadPSPDFKit(arrayBuffer, container)];
case 6:
_a.Instance = _b.sent();
App.configurePSPDFKit(this.Instance);
App.UI.configurePSPDFKit(this.Instance, App.handleClick);
console.debug(envelopeObject.envelope);
console.debug("PSPDFKit configured!");
annotations = [];
App.currentDocument.elements.forEach(function (element) {
console.log("Creating annotation for element", element.id);
var _a = App.createAnnotationFromElement(element), annotation = _a[0], formField = _a[1];
var _a = App.Annotation.createAnnotationFromElement(element), annotation = _a[0], formField = _a[1];
annotations.push(annotation);
annotations.push(formField);
});
@@ -92,59 +94,6 @@ var App = /** @class */ (function () {
});
});
};
App.inchToPoint = function (inch) {
return inch * 72;
};
// Makes a call to the supplied url and fetches the binary response as an array buffer
App.loadDocument = function (url) {
return fetch(url, { credentials: "include" })
.then(function (res) { return res.arrayBuffer(); });
};
// Makes a call to the supplied url and fetches the json response as an object
App.loadData = function (url) {
return fetch(url, { credentials: "include" })
.then(function (res) { return res.json(); });
};
App.postDocument = function (url, buffer) {
return fetch(url, { credentials: "include", method: "POST", body: buffer })
.then(function (res) { return res.json(); });
};
// 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.
App.loadPSPDFKit = function (arrayBuffer, container) {
return PSPDFKit.load({
container: container,
document: arrayBuffer,
autoSaveMode: DISABLED,
annotationPresets: App.ui.getPresets(),
electronicSignatures: {
creationModes: [DRAW, TYPE]
},
isEditableAnnotation: function (annotation) {
// Check if the annotation is a signature
// This will allow new signatures, but not allow edits.
return !annotation.isSignature;
}
});
};
App.configurePSPDFKit = function (instance) {
var _this = this;
instance.addEventListener("annotations.load", function (loadedAnnotations) {
console.log("annotations loaded", loadedAnnotations.toJS());
});
instance.addEventListener("annotations.change", function () {
console.log("annotations changed");
});
instance.addEventListener("annotations.create", function (createdAnnotations) { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
console.log("annotations created", createdAnnotations.toJS());
return [2 /*return*/];
});
}); });
var filteredItems = instance.toolbarItems
.filter(function (item) { return App.ui.allowedToolbarItems.includes(item.type); });
instance.setToolbarItems(filteredItems.concat(App.ui.getToolbarItems(App.handleClick)));
};
App.handleClick = function (eventType) {
return __awaiter(this, void 0, void 0, function () {
var _a;
@@ -172,7 +121,7 @@ var App = /** @class */ (function () {
};
App.handleFinish = function (event) {
return __awaiter(this, void 0, void 0, function () {
var json, buffer;
var json, buffer, result;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, App.Instance.save()];
@@ -185,54 +134,23 @@ var App = /** @class */ (function () {
return [4 /*yield*/, App.Instance.exportPDF({ flatten: true })];
case 3:
buffer = _a.sent();
return [4 /*yield*/, App.uploadDocument(buffer, App.envelopeKey, App.currentDocument.id)];
return [4 /*yield*/, App.Network.postDocument(App.envelopeKey, App.currentDocument.id, buffer)];
case 4:
_a.sent();
alert("Signatur wird gespeichert!");
result = _a.sent();
console.log(result);
return [2 /*return*/];
}
});
});
};
App.handleReset = function (event) {
return __awaiter(this, void 0, void 0, function () {
var i, annotations;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!confirm("Wollen Sie das Dokument und alle erstellten Signaturen zurücksetzen?")) return [3 /*break*/, 4];
i = 0;
_a.label = 1;
case 1:
if (!(i < App.Instance.totalPageCount)) return [3 /*break*/, 4];
return [4 /*yield*/, App.Instance.getAnnotations(i)];
case 2:
annotations = _a.sent();
annotations.forEach(function (annotation) {
//console.log(annotation)
// TODO: Delete only create signatures
//App.Instance.delete(annotation.id)
});
_a.label = 3;
case 3:
i++;
return [3 /*break*/, 1];
case 4: return [2 /*return*/];
}
});
});
};
App.uploadDocument = function (buffer, envelopeKey, documentId) {
return __awaiter(this, void 0, void 0, function () {
var result;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, App.postDocument("/api/upload/".concat(envelopeKey, "/").concat(documentId), buffer)];
case 1:
result = _a.sent();
console.log(result);
return [2 /*return*/];
if (confirm("Wollen Sie das Dokument und alle erstellten Signaturen zurücksetzen?")) {
result = App.Annotation.deleteAnnotations(App.Instance);
}
return [2 /*return*/];
});
});
};
@@ -274,15 +192,20 @@ var App = /** @class */ (function () {
});
});
};
App.createAnnotationFromElement = function (element) {
return App;
}());
export { App };
var Annotation = /** @class */ (function () {
function Annotation() {
}
Annotation.prototype.createAnnotationFromElement = function (element) {
var id = PSPDFKit.generateInstantId();
console.log("Creating Annotation", id);
var width = App.inchToPoint(element.width);
var height = App.inchToPoint(element.height);
var top = App.inchToPoint(element.top) - (height / 2);
var left = App.inchToPoint(element.left) - (width / 2);
var width = this.inchToPoint(element.width);
var height = this.inchToPoint(element.height);
var top = this.inchToPoint(element.top) - (height / 2);
var left = this.inchToPoint(element.left) - (width / 2);
var page = element.page - 1;
var annotation = App.createSignatureAnnotation(id, width, height, top, left, page);
var annotation = this.createSignatureAnnotation(id, width, height, top, left, page);
console.log(annotation);
var formField = new SignatureFormField({
name: id,
@@ -291,7 +214,27 @@ var App = /** @class */ (function () {
console.log(formField);
return [annotation, formField];
};
App.createSignatureAnnotation = function (id, width, height, top, left, pageIndex) {
Annotation.prototype.deleteAnnotations = function (instance) {
return __awaiter(this, void 0, void 0, function () {
var pageAnnotations;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, Promise.all(Array.from({ length: instance.totalPageCount }).map(function (_, pageIndex) {
return instance.getAnnotations(pageIndex);
}))];
case 1:
pageAnnotations = (_a.sent()).flatMap(function (annotations) {
return annotations.reduce(function (acc, annotation) { return acc.concat(annotation); }, []);
}).filter(function (annotation) { return !!annotation.isSignature; });
return [4 /*yield*/, instance.delete(pageAnnotations)];
case 2:
//deleting all Annotations
return [2 /*return*/, _a.sent()];
}
});
});
};
Annotation.prototype.createSignatureAnnotation = function (id, width, height, top, left, pageIndex) {
var annotation = new PSPDFKit.Annotations.WidgetAnnotation({
id: id,
pageIndex: pageIndex,
@@ -300,9 +243,30 @@ var App = /** @class */ (function () {
});
return annotation;
};
return App;
Annotation.prototype.inchToPoint = function (inch) {
return inch * 72;
};
return Annotation;
}());
var Network = /** @class */ (function () {
function Network() {
}
// Makes a call to the supplied url and fetches the binary response as an array buffer
Network.prototype.loadDocument = function (envelopeKey, documentId) {
return fetch("/api/file/".concat(envelopeKey, "?id=").concat(documentId), { credentials: "include" })
.then(function (res) { return res.arrayBuffer(); });
};
// Makes a call to the supplied url and fetches the json response as an object
Network.prototype.loadData = function (envelopeKey) {
return fetch("/api/envelope/".concat(envelopeKey), { credentials: "include" })
.then(function (res) { return res.json(); });
};
Network.prototype.postDocument = function (envelopeKey, documentId, buffer) {
return fetch("/api/upload/".concat(envelopeKey, "/").concat(documentId), { credentials: "include", method: "POST", body: buffer })
.then(function (res) { return res.json(); });
};
return Network;
}());
export { App };
var UI = /** @class */ (function () {
function UI() {
this.allowedToolbarItems = [
@@ -317,7 +281,7 @@ var UI = /** @class */ (function () {
"spacer",
"search"
];
this.getToolbarItems = function (callback) {
this.getCustomItems = function (callback) {
var customItems = [
{
type: "custom",
@@ -341,6 +305,50 @@ var UI = /** @class */ (function () {
return customItems;
};
}
// 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.
UI.prototype.loadPSPDFKit = function (arrayBuffer, container) {
return PSPDFKit.load({
container: container,
document: arrayBuffer,
autoSaveMode: DISABLED,
annotationPresets: this.getPresets(),
electronicSignatures: {
creationModes: [DRAW, TYPE]
},
isEditableAnnotation: function (annotation) {
// Check if the annotation is a signature
// This will allow new signatures, but not allow edits.
return !annotation.isSignature;
}
});
};
UI.prototype.configurePSPDFKit = function (instance, handler) {
var _this = this;
instance.addEventListener("annotations.load", function (loadedAnnotations) {
console.log("annotations loaded", loadedAnnotations.toJS());
});
instance.addEventListener("annotations.change", function () {
console.log("annotations changed");
});
instance.addEventListener("annotations.create", function (createdAnnotations) { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
console.log("annotations created");
return [2 /*return*/];
});
}); });
var toolbarItems = this.getToolbarItems(instance, handler);
instance.setToolbarItems(toolbarItems);
};
UI.prototype.getToolbarItems = function (instance, handler) {
var customItems = this.getCustomItems(handler);
var defaultItems = this.getDefaultItems(instance.toolbarItems);
return defaultItems.concat(customItems);
};
UI.prototype.getDefaultItems = function (items) {
var _this = this;
return items.filter(function (item) { return _this.allowedToolbarItems.includes(item.type); });
};
UI.prototype.getPresets = function () {
var annotationPresets = PSPDFKit.defaultAnnotationPresets;
annotationPresets.ink = {