diff --git a/client/src/pages/admin-gallery.tsx b/client/src/pages/admin-gallery.tsx index d2a0456..bfaf3ba 100644 --- a/client/src/pages/admin-gallery.tsx +++ b/client/src/pages/admin-gallery.tsx @@ -140,12 +140,31 @@ function FocalPointEditor({ const handlePreviewClick = (e: React.MouseEvent) => { const rect = e.currentTarget.getBoundingClientRect(); - const clickX = (e.clientX - rect.left) / rect.width; - const clickY = (e.clientY - rect.top) / rect.height; - const currentPos = point || { x: 50, y: 15 }; - const newX = Math.round(Math.max(0, Math.min(100, currentPos.x + (clickX - 0.5) * 30))); - const newY = Math.round(Math.max(0, Math.min(100, currentPos.y + (clickY - 0.5) * 30))); - setPoint({ x: newX, y: newY }); + const contW = rect.width; + const contH = rect.height; + const cx = e.clientX - rect.left; + const cy = e.clientY - rect.top; + + const imgW = image.width; + const imgH = image.height; + + const px = (point?.x ?? 50) / 100; + const py = (point?.y ?? 15) / 100; + + const scale = Math.max(contW / imgW, contH / imgH); + const scaledW = imgW * scale; + const scaledH = imgH * scale; + + const overflowX = scaledW - contW; + const overflowY = scaledH - contH; + + const origX = (cx + overflowX * px) / scaledW * 100; + const origY = (cy + overflowY * py) / scaledH * 100; + + setPoint({ + x: Math.round(Math.max(0, Math.min(100, origX))), + y: Math.round(Math.max(0, Math.min(100, origY))), + }); }; const handleZoomIn = () => setZoom((z) => Math.min(z + 0.5, 4)); diff --git a/server/cloudinary-gallery-map.json b/server/cloudinary-gallery-map.json index 41dd794..da1ecd6 100644 --- a/server/cloudinary-gallery-map.json +++ b/server/cloudinary-gallery-map.json @@ -7,7 +7,6 @@ "Julia Buchner 1 .jpg": "folx-gallery/Julia_Buchner_1_", "John Prisco 1.jpg": "folx-gallery/John_Prisco_1", "Mosaik 4.jpg": "folx-gallery/Mosaik_4", - "Acarina 1 (1).jpg": "folx-gallery/Acarina_1__1_", "Grazer Spitzbuam 2.jpg": "folx-gallery/Grazer_Spitzbuam_2", "Maibritt 1 (1).jpg": "folx-gallery/Maibritt_1__1_", "Sellraintaler Exklusiv 2.jpg": "folx-gallery/Sellraintaler_Exklusiv_2", @@ -78,7 +77,6 @@ "Grazer Spitzbuam 1.jpg": "folx-gallery/Grazer_Spitzbuam_1", "Arina 1.jpg": "folx-gallery/Arina_1", "Maibritt 2.jpg": "folx-gallery/Maibritt_2", - "Acarina 1.jpg": "folx-gallery/Acarina_1", "Aufwärts 1.jpg": "folx-gallery/Aufw_rts_1", "Aufwärts 2.jpg": "folx-gallery/Aufw_rts_2", "Sellraintaler Exklusiv 1.jpg": "folx-gallery/Sellraintaler_Exklusiv_1", diff --git a/server/gallery-focal-points.json b/server/gallery-focal-points.json index 7095de3..a9c7e0f 100644 --- a/server/gallery-focal-points.json +++ b/server/gallery-focal-points.json @@ -50,5 +50,33 @@ "DSC08350.jpg": { "x": 51, "y": 33 + }, + "Berny Blank 1.jpg": { + "x": 44, + "y": 31 + }, + "Christa Fartek und Robert F 1 .jpg": { + "x": 49, + "y": 27 + }, + "Die 3 K rntner 1.jpg": { + "x": 28, + "y": 36 + }, + "Die Zwirn 2.jpg": { + "x": 50, + "y": 29 + }, + "DSC07177.jpg": { + "x": 0, + "y": 0 + }, + "DSC07217.jpg": { + "x": 52, + "y": 0 + }, + "Adriana 1.jpg": { + "x": 100, + "y": 23 } } \ No newline at end of file