Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

Signature: keep selected zone when turning pages

Browse Source
This commit is contained in:
nobohan 2024-09-12 11:31:31 +02:00
parent f8a986d59b
commit 3c987e0b8d
1 changed files with 23 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
src/Bundle/ChillDocStoreBundle/Resources/public/vuejs/DocumentSignature/App.vue
View File

@ -229,7 +229,7 @@ async function downloadAndOpen(): Promise<Blob> {
const initPdf = () => {
const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
canvas.addEventListener("pointerup", canvasClick, false);
setTimeout(() => addZones(page.value), 800);
setTimeout(() => drawAllZones(page.value), 800);
};
const scaleXToCanvas = (x: number, canvasWidth: number, PDFWidth: number) =>
@ -259,11 +259,11 @@ const selectZone = (z: SignatureZone, canvas: HTMLCanvasElement) => {
const ctx = canvas.getContext("2d");
if (ctx) {
setPage(page.value);
setTimeout(() => drawZone(z, ctx, canvas.width, canvas.height), 200);
setTimeout(() => drawAllZones(page.value), 200);
}
};
const selectZoneOnCanvas = (e: PointerEvent, canvas: HTMLCanvasElement) =>
const selectZoneEvent = (e: PointerEvent, canvas: HTMLCanvasElement) =>
signature.zones
.filter((z) => z.PDFPage.index + 1 === page.value)
.map((z) => {
@ -283,15 +283,15 @@ const selectZoneOnCanvas = (e: PointerEvent, canvas: HTMLCanvasElement) =>
const canvasClick = (e: PointerEvent) => {
const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
canvasEvent.value === "select"
? selectZoneOnCanvas(e, canvas)
: addZoneOnCanvas(e, canvas);
? selectZoneEvent(e, canvas)
: addZoneEvent(e, canvas);
};
const turnPage = async (upOrDown: number) => {
userSignatureZone.value = null;
//userSignatureZone.value = null; // desactivate the reset of the zone when turning page
page.value = page.value + upOrDown;
await setPage(page.value);
setTimeout(() => addZones(page.value), 200);
setTimeout(() => drawAllZones(page.value), 200);
};
const turnSignature = async (upOrDown: number) => {
@ -351,19 +351,24 @@ const drawZone = (
ctx.fillStyle = unselectedBlue;
ctx.fillText("Choisir cette", xText, yText - 12);
ctx.fillText("zone de signature", xText, yText + 12);
// ctx.strokeStyle = "#c6c6c6"; // halo
// ctx.strokeText("Choisir cette", xText, yText - 12);
// ctx.strokeText("zone de signature", xText, yText + 12);
}
};
const addZones = (page: number) => {
const drawAllZones = (page: number) => {
const canvas = document.querySelectorAll("canvas")[0];
const ctx = canvas.getContext("2d");
if (ctx) {
signature.zones
.filter((z) => z.PDFPage.index + 1 === page)
.map((z) => drawZone(z, ctx, canvas.width, canvas.height));
.map((z) => {
if (userSignatureZone.value) {
if (userSignatureZone.value?.index === z.index) {
drawZone(z, ctx, canvas.width, canvas.height);
}
} else {
drawZone(z, ctx, canvas.width, canvas.height);
}
});
}
};
@ -447,7 +452,7 @@ const confirmSign = () => {
const undoSign = async () => {
signature.zones = signature.zones.filter((z) => z.index !== null);
await setPage(page.value);
setTimeout(() => addZones(page.value), 200);
setTimeout(() => drawAllZones(page.value), 200);
userSignatureZone.value = null;
adding.value = false;
};
@ -458,7 +463,8 @@ const toggleAddZone = () => {
: (canvasEvent.value = "select");
};
const addZoneOnCanvas = (e: PointerEvent, canvas: HTMLCanvasElement) => {
const addZoneEvent = async (e: PointerEvent, canvas: HTMLCanvasElement) => {
userSignatureZone.value = null;
const BOX_WIDTH = 180;
const BOX_HEIGHT = 90;
const PDFPageHeight = canvas.height;
@ -485,7 +491,8 @@ const addZoneOnCanvas = (e: PointerEvent, canvas: HTMLCanvasElement) => {
};
signature.zones.push(newZone);
setTimeout(() => addZones(page.value), 200);
await setPage(page.value);
setTimeout(() => drawAllZones(page.value), 200);
canvasEvent.value = "select";
adding.value = true;
};
@ -494,7 +501,7 @@ const removeNewZone = async () => {
signature.zones = signature.zones.filter((z) => z.index !== null);
userSignatureZone.value = null;
await setPage(page.value);
setTimeout(() => addZones(page.value), 200);
setTimeout(() => drawAllZones(page.value), 200);
canvasEvent.value = "select";
adding.value = false;
};