20-09-2023

This commit is contained in:
Jonathan Jenne
2023-09-20 13:42:24 +02:00
parent 12556e41e4
commit 446bcfeb9e
21 changed files with 399 additions and 78 deletions

View File

@@ -38,25 +38,48 @@ var List = PSPDFKit.Immutable.List;
var Rect = PSPDFKit.Geometry.Rect;
var SignatureFormField = PSPDFKit.FormFields.SignatureFormField;
var _a = PSPDFKit.ElectronicSignatureCreationMode, DRAW = _a.DRAW, TYPE = _a.TYPE;
var DISABLED = PSPDFKit.AutoSaveMode.DISABLED;
var Settings = /** @class */ (function () {
function Settings() {
}
Settings.allowedToolbarItems = [
"sidebar-thumbnails",
"sidebar-document-ouline",
"sidebar-bookmarks",
"pager",
"pan",
"zoom-out",
"zoom-in",
"zoom-mode",
"spacer",
"search"
];
return Settings;
}());
var App = /** @class */ (function () {
function App() {
}
// This function will be called in the ShowEnvelope.razor page
// and will trigger loading of the Editor Interface
App.loadPDFFromUrl = function (container, documentId) {
App.loadPDFFromUrl = function (container, envelopeKey) {
return __awaiter(this, void 0, void 0, function () {
var arrayBuffer, instance, id, annotation, formField, createdAnnotation;
return __generator(this, function (_a) {
switch (_a.label) {
var arrayBuffer, envelopeObject, _a, id, annotation, formField, createdAnnotation;
return __generator(this, function (_b) {
switch (_b.label) {
case 0:
console.debug("Loading PSPDFKit..");
return [4 /*yield*/, App.loadDocument("/api/download/".concat(documentId))];
return [4 /*yield*/, App.loadDocument("/api/download/".concat(envelopeKey))];
case 1:
arrayBuffer = _a.sent();
return [4 /*yield*/, App.loadPSPDFKit(arrayBuffer, container)];
arrayBuffer = _b.sent();
return [4 /*yield*/, App.loadData("/api/get-data/".concat(envelopeKey))];
case 2:
instance = _a.sent();
App.configurePSPDFKit(instance);
envelopeObject = _b.sent();
_a = App;
return [4 /*yield*/, App.loadPSPDFKit(arrayBuffer, container)];
case 3:
_a.Instance = _b.sent();
App.configurePSPDFKit(this.Instance);
console.debug(envelopeObject.envelope.id);
console.debug("PSPDFKit configured!");
id = PSPDFKit.generateInstantId();
annotation = App.createSignatureAnnotation(id, 150, 50, 50, 50, 0);
@@ -65,9 +88,9 @@ var App = /** @class */ (function () {
annotationIds: List([annotation.id])
});
console.debug("Annotation created.");
return [4 /*yield*/, instance.create([annotation, formField])];
case 3:
createdAnnotation = (_a.sent())[0];
return [4 /*yield*/, App.Instance.create([annotation, formField])];
case 4:
createdAnnotation = (_b.sent())[0];
console.debug(createdAnnotation);
return [2 /*return*/];
}
@@ -79,6 +102,11 @@ var App = /** @class */ (function () {
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(); });
};
// 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) {
@@ -90,9 +118,10 @@ var App = /** @class */ (function () {
return PSPDFKit.load({
container: container,
document: arrayBuffer,
autoSaveMode: DISABLED,
annotationPresets: annotationPresets,
electronicSignatures: {
creationModes: [TYPE, DRAW]
creationModes: [DRAW]
}
});
};
@@ -104,8 +133,73 @@ var App = /** @class */ (function () {
console.log("annotations changed");
});
instance.addEventListener("annotations.create", function (createdAnnotations) {
var annotation = createdAnnotations[0];
console.log("annotations created", createdAnnotations.toJS());
});
var filteredItems = instance.toolbarItems
.filter(function (item) { return Settings.allowedToolbarItems.includes(item.type); });
var customItems = [
{
type: "custom",
id: "button-finish",
title: "Abschließen",
icon: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" fill=\"currentColor\" class=\"bi bi-check2-circle\" viewBox=\"0 0 16 16\">\n <path d=\"M2.5 8a5.5 5.5 0 0 1 8.25-4.764.5.5 0 0 0 .5-.866A6.5 6.5 0 1 0 14.5 8a.5.5 0 0 0-1 0 5.5 5.5 0 1 1-11 0z\"/>\n <path d=\"M15.354 3.354a.5.5 0 0 0-.708-.708L8 9.293 5.354 6.646a.5.5 0 1 0-.708.708l3 3a.5.5 0 0 0 .708 0l7-7z\" />\n </svg>",
onPress: this.handleFinish
}
];
instance.setToolbarItems(filteredItems.concat(customItems));
};
App.handleFinish = function (event) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, App.Instance.applyOperations([{ type: "flattenAnnotations" }])
//await downloadDocument();
];
case 1:
_a.sent();
return [2 /*return*/];
}
});
});
};
App.downloadDocument = function () {
return __awaiter(this, void 0, void 0, function () {
function downloadPdf(blob) {
var a = document.createElement("a");
a.href = blob;
a.style.display = "none";
a.download = "download.pdf";
a.setAttribute("download", "download.pdf");
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
}
var buffer, supportsDownloadAttribute, blob, reader_1, objectUrl;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, App.Instance.exportPDF({ flatten: true })];
case 1:
buffer = _a.sent();
supportsDownloadAttribute = HTMLAnchorElement.prototype.hasOwnProperty("download");
blob = new Blob([buffer], { type: "application/pdf" });
if (!supportsDownloadAttribute) {
reader_1 = new FileReader();
reader_1.onloadend = function () {
var dataUrl = reader_1.result;
downloadPdf(dataUrl);
};
reader_1.readAsDataURL(blob);
}
else {
objectUrl = window.URL.createObjectURL(blob);
downloadPdf(objectUrl);
window.URL.revokeObjectURL(objectUrl);
}
return [2 /*return*/];
}
});
});
};
App.createSignatureAnnotation = function (id, x, y, top, left, pageIndex) {
var annotation = new PSPDFKit.Annotations.WidgetAnnotation({