Prima implementazione pagina "Attività"

2026-06-08 09:25:29 +02:00
parent 4661922633
commit b7955f0e1f
34 changed files with 1582 additions and 266 deletions
@@ -0,0 +1,78 @@
+window.signaturePad = {
+    instances: {},
+
+    init(canvasId, dotNetRef) {
+        const canvas = document.getElementById(canvasId);
+        if (!canvas) return;
+
+        const ctx = canvas.getContext('2d');
+        ctx.strokeStyle = '#1a1a2e';
+        ctx.lineWidth = 2;
+        ctx.lineCap = 'round';
+        ctx.lineJoin = 'round';
+
+        let drawing = false;
+
+        function getPos(e) {
+            const rect = canvas.getBoundingClientRect();
+            const src = e.touches ? e.touches[0] : e;
+            return {
+                x: (src.clientX - rect.left) * (canvas.width / rect.width),
+                y: (src.clientY - rect.top) * (canvas.height / rect.height)
+            };
+        }
+
+        function start(e) {
+            e.preventDefault();
+            drawing = true;
+            const pos = getPos(e);
+            ctx.beginPath();
+            ctx.moveTo(pos.x, pos.y);
+        }
+
+        function move(e) {
+            if (!drawing) return;
+            e.preventDefault();
+            const pos = getPos(e);
+            ctx.lineTo(pos.x, pos.y);
+            ctx.stroke();
+        }
+
+        function end(e) {
+            if (!drawing) return;
+            drawing = false;
+            ctx.closePath();
+            if (dotNetRef) {
+                dotNetRef.invokeMethodAsync('OnSignatureChanged', canvas.toDataURL('image/png'));
+            }
+        }
+
+        canvas.addEventListener('mousedown', start);
+        canvas.addEventListener('mousemove', move);
+        canvas.addEventListener('mouseup', end);
+        canvas.addEventListener('mouseleave', end);
+        canvas.addEventListener('touchstart', start, { passive: false });
+        canvas.addEventListener('touchmove', move, { passive: false });
+        canvas.addEventListener('touchend', end);
+
+        this.instances[canvasId] = { canvas, ctx };
+    },
+
+    clear(canvasId) {
+        const instance = this.instances[canvasId];
+        if (!instance) return;
+        instance.ctx.clearRect(0, 0, instance.canvas.width, instance.canvas.height);
+    },
+
+    getDataUrl(canvasId) {
+        const instance = this.instances[canvasId];
+        return instance ? instance.canvas.toDataURL('image/png') : null;
+    },
+
+    isEmpty(canvasId) {
+        const instance = this.instances[canvasId];
+        if (!instance) return true;
+        const data = instance.ctx.getImageData(0, 0, instance.canvas.width, instance.canvas.height).data;
+        return !data.some(v => v !== 0);
+    }
+};