Michael/Socialflow
1
0 Fork 0
mirror of https://github.com/R0m1k3/Socialflow.git synced 2026-10-23 15:08:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

Improve image editor by correctly displaying ribbons on uploaded images

Browse Source 
Update client/src/pages/image-editor.tsx to fix ribbon positioning logic and ensure ribbons are displayed correctly based on user-defined positions.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: ae4037a0-2a6f-4530-9bac-79b543286bda
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/397bca8c-984f-43ff-841a-10897aeb8140/ae4037a0-2a6f-4530-9bac-79b543286bda/Hpj2VzR
This commit is contained in:
michaelschal committed 2025-10-11 09:24:57 +00:00
1 parent 838c2079a6
commit 0d4d847421
2 files changed
+2 -2
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

attached_assets/image_1760174660512.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.7 KiB

client/src/pages/image-editor.tsx
+2 -2
View File
@@ -125,14 +125,14 @@ export default function ImageEditor() {
// Draw ribbon if enabled // Draw ribbon if enabled
if (ribbon.enabled && ribbon.text) { if (ribbon.enabled && ribbon.text) {
const ribbonSize = 150; const ribbonSize = 150;
const positions = { const positions: Record<string, { x: number; y: number; rotation: number }> = {
top_left: { x: 0, y: 0, rotation: 0 }, top_left: { x: 0, y: 0, rotation: 0 },
top_right: { x: width - ribbonSize, y: 0, rotation: 90 }, top_right: { x: width - ribbonSize, y: 0, rotation: 90 },
bottom_left: { x: 0, y: height - ribbonSize, rotation: -90 }, bottom_left: { x: 0, y: height - ribbonSize, rotation: -90 },
bottom_right: { x: width - ribbonSize, y: height - ribbonSize, rotation: 180 } bottom_right: { x: width - ribbonSize, y: height - ribbonSize, rotation: 180 }
}; };
const pos = positions[ribbon.position as keyof typeof positions]; const pos = positions[ribbon.position] || positions.top_left;
ctx.save(); ctx.save();
ctx.translate(pos.x + ribbonSize / 2, pos.y + ribbonSize / 2); ctx.translate(pos.x + ribbonSize / 2, pos.y + ribbonSize / 2);