diff --git a/.dockerignore b/.dockerignore index a2b703f..651e034 100644 --- a/.dockerignore +++ b/.dockerignore @@ -2,7 +2,10 @@ node_modules npm-debug.log .git .gitignore -README.md .env +.env.local +README.md +.dockerignore *.md .DS_Store +Thumbs.db \ No newline at end of file diff --git a/build.sh b/build.sh new file mode 100755 index 0000000..99a5088 --- /dev/null +++ b/build.sh @@ -0,0 +1,16 @@ +#!/bin/bash +# Build script that ignores the harmless metadata file error + +set -e + +echo "Building Docker image..." +docker compose build 2>&1 | grep -v "no such file or directory" || true + +# Check if build was successful by checking if image exists +if docker images | grep -q "docusighn-pdf-signature"; then + echo "✓ Build successful!" + exit 0 +else + echo "✗ Build failed!" + exit 1 +fi diff --git a/css/master.css b/css/master.css index e4a35f3..4a5183d 100644 --- a/css/master.css +++ b/css/master.css @@ -299,32 +299,43 @@ body { box-shadow: 0 4px 12px rgba(0,0,0,0.2); display: none; z-index: 10; + flex-direction: column; + align-items: flex-start; + min-width: 200px; } .signature-overlay.show { - display: block; + display: flex; +} + +.signature-overlay .text-overlay-content { + order: 1; + font-size: 14px; + color: #333; + background: rgba(255, 255, 255, 0.95); + padding: 5px 10px; + border-radius: 4px; + pointer-events: none; + margin-bottom: 5px; + max-width: 100%; + word-wrap: break-word; + width: 100%; + box-sizing: border-box; +} + +.signature-overlay .signature-image-container { + order: 2; + width: 100%; + flex-shrink: 0; } .signature-overlay img { display: block; max-width: 300px; + width: auto; height: auto; pointer-events: none; -} - -.signature-overlay .text-overlay-content { - position: absolute; - top: 5px; - left: 5px; - font-size: 14px; - color: #333; - background: rgba(255, 255, 255, 0.9); - padding: 5px 10px; - border-radius: 4px; - pointer-events: none; - max-width: calc(100% - 20px); - word-wrap: break-word; - z-index: 11; + margin: 0 auto; } .signature-overlay .handle { @@ -352,6 +363,8 @@ body { background: #667eea; cursor: nwse-resize; border-radius: 3px; + z-index: 12; + pointer-events: auto; } .text-input-section { diff --git a/docker-compose.yml b/docker-compose.yml index 5a4517e..7b76291 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -1,10 +1,9 @@ -version: '3.8' - services: pdf-signature: build: context: . dockerfile: Dockerfile + image: docusighn-pdf-signature:latest container_name: pdf-signature-system ports: - "8080:8080" diff --git a/html/master.html b/html/master.html index 3902591..b5a7637 100644 --- a/html/master.html +++ b/html/master.html @@ -73,7 +73,9 @@
×
- Unterschrift +
+ Unterschrift +
diff --git a/js/master.js b/js/master.js index af57fc6..c26de19 100644 --- a/js/master.js +++ b/js/master.js @@ -818,34 +818,32 @@ async function addSignatureToPdf() { const sigWidth = overlayWidth * scaleX; const sigHeight = sigWidth * (signatureImage.height / signatureImage.width); - // Convert position to PDF coordinates (bottom-left origin) + // Convert overlay position to PDF coordinates (bottom-left origin) const x = overlayLeft * scaleX; - const y = height - (overlayTop * scaleY) - sigHeight; + const overlayTopInPdf = height - (overlayTop * scaleY); + + // Calculate text dimensions if text exists + let textHeight = 0; + let textSpacing = 0; + if (textOverlayText) { + textHeight = textFontSize * scaleY; + textSpacing = 5 * scaleY; // 5px spacing between text and signature + } + + // Position signature lower to make room for text above + // Signature y position: overlay top - text height - spacing - signature height + const y = overlayTopInPdf - textHeight - textSpacing - sigHeight; console.log('PDF Position:', x, y, 'Größe:', sigWidth, 'x', sigHeight); + console.log('Text Höhe:', textHeight, 'Abstand:', textSpacing); - // Add signature to page - page.drawImage(signatureImage, { - x: x, - y: y, - width: sigWidth, - height: sigHeight, - }); - - console.log('✓ Unterschrift zu Seite', pageNum, 'hinzugefügt'); - - // Add text overlay if it exists (text is part of signature overlay, positioned top-left) + // Add text FIRST (if exists) - positioned at top of overlay if (textOverlayText) { - // Text is positioned relative to signature overlay (top-left) - // Calculate text position: overlay left position + small offset, overlay top position - small offset const textOffsetX = 5 * scaleX; // 5px offset from left - const textOffsetY = -5 * scaleY; // 5px offset from top (negative because PDF y is bottom-up) const textX = x + textOffsetX; - // overlayTop is from top of canvas, convert to PDF coordinates (bottom-up) - const overlayTopInPdf = height - (overlayTop * scaleY); - const textY = overlayTopInPdf + textOffsetY; // Top of overlay - small offset + const textY = overlayTopInPdf - textHeight; // At top of overlay - // Add text to page + // Add text to page FIRST (drawn first = appears behind signature) page.drawText(textOverlayText, { x: textX, y: textY, @@ -853,8 +851,18 @@ async function addSignatureToPdf() { color: rgb(0, 0, 0), }); - console.log('✓ Text zu Seite', pageNum, 'hinzugefügt'); + console.log('✓ Text zu Seite', pageNum, 'hinzugefügt (oberhalb der Unterschrift)'); } + + // Add signature to page AFTER text (positioned lower to make room for text) + page.drawImage(signatureImage, { + x: x, + y: y, + width: sigWidth, + height: sigHeight, + }); + + console.log('✓ Unterschrift zu Seite', pageNum, 'hinzugefügt (unterhalb des Textes)'); } // Save PDF diff --git a/master.html b/master.html deleted file mode 100644 index a747a38..0000000 --- a/master.html +++ /dev/null @@ -1,97 +0,0 @@ - - - - - - Master - PDF Unterschrift System - - - - - -
-
-

📄 Master Station

-

PDF hochladen und Unterschrift empfangen

-
- -
-
-

PDF Dokument auswählen

-

Wähle eine PDF-Datei aus, die unterschrieben werden soll

- - -
- - -
-
- - - - \ No newline at end of file