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

FEATURE signature: show full pages - can select zone

Browse Source
This commit is contained in:
nobohan 2024-11-25 12:32:11 +01:00 committed by Julien Fastré
parent c2882b1079
commit da37a3db5f
Signed by: julienfastre
GPG Key ID: BDE2190974723FCB
1 changed files with 34 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -467,9 +467,24 @@ async function downloadAndOpen(): Promise<Blob> {
return raw;
}
const addCanvasEvents = () => {
if (multiPage.value) {
Array.from(Array(pageCount.value).keys()).map((p) => {
const canvas = getCanvas(p + 1);
canvas.addEventListener(
"pointerup",
(e) => canvasClick(e, canvas),
false
);
});
} else {
const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
canvas.addEventListener("pointerup", (e) => canvasClick(e, canvas), false);
}
};
const initPdf = () => {
const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement;
canvas.addEventListener("pointerup", canvasClick, false);
addCanvasEvents();
setTimeout(drawAllZones, 800);
};
@ -477,9 +492,11 @@ async function toggleMultiPage() {
if (multiPage.value) {
await setAllPages();
setTimeout(drawAllZones, 200);
addCanvasEvents();
} else {
await setPage(1);
await setPage(page.value);
setTimeout(drawAllZones, 200);
addCanvasEvents();
}
}
@ -509,14 +526,22 @@ const selectZone = (z: SignatureZone, canvas: HTMLCanvasElement) => {
userSignatureZone.value = z;
const ctx = canvas.getContext("2d");
if (ctx) {
setPage(page.value);
if (multiPage.value) {
setPage(parseInt(canvas.id.split("-")[1]));
} else {
setPage(page.value);
}
setTimeout(drawAllZones, 200);
}
};
const selectZoneEvent = (e: PointerEvent, canvas: HTMLCanvasElement) =>
signature.zones
.filter((z) => z.PDFPage.index + 1 === page.value)
.filter(
(z) =>
multiPage.value ||
(z.PDFPage.index + 1 === page.value && !multiPage.value)
)
.map((z) => {
if (
hitSignature(z, [e.offsetX, e.offsetY], canvas.width, canvas.height)
@ -531,12 +556,10 @@ const selectZoneEvent = (e: PointerEvent, canvas: HTMLCanvasElement) =>
}
});
const canvasClick = (e: PointerEvent) => {
const canvas = document.querySelectorAll("canvas")[0] as HTMLCanvasElement; //TODO change canvas as a function of multiOption
const canvasClick = (e: PointerEvent, canvas: HTMLCanvasElement) =>
canvasEvent.value === "select"
? selectZoneEvent(e, canvas)
: addZoneEvent(e, canvas);
};
const turnPage = async (upOrDown: number) => {
//userSignatureZone.value = null; // desactivate the reset of the zone when turning page
@ -558,8 +581,7 @@ const turnSignature = async (upOrDown: number) => {
let currentZone = signature.zones[zoneIndex];
if (currentZone) {
page.value = currentZone.PDFPage.index + 1;
userSignatureZone.value = currentZone;
const canvas = document.querySelectorAll("canvas")[0];
const canvas = getCanvas(currentZone.PDFPage.index + 1);
selectZone(currentZone, canvas);
}
};
@ -614,7 +636,6 @@ const drawAllZones = () => {
(z.PDFPage.index + 1 === page.value && !multiPage.value)
)
.map((z) => {
console.log('drawAllZones: z is ', z)
const canvas = getCanvas(z.PDFPage.index + 1);
const ctx = canvas.getContext("2d");
if (ctx) {
@ -767,14 +788,14 @@ init();
</script>
<style scoped lang="scss">
#canvas {
canvas {
box-shadow: 0 20px 20px rgba(0, 0, 0, 0.2);
}
.onAddZone {
cursor: not-allowed;
#canvas {
canvas {
cursor: copy;
}
}