reverted copying image change

This commit is contained in:
Simon Pocrnjič 2026-03-18 21:54:14 +01:00
parent f8d1579cb2
commit d54fc9914d

View File

@ -42,9 +42,6 @@ const dragStartTY = ref(0);
const MAX_SCALE = 8;
// Image context menu state
const contextMenu = ref({ visible: false, x: 0, y: 0 });
const imageCursorClass = computed(() => {
if (isDragging.value && hasMoved.value) return "cursor-grabbing";
if (imageScale.value > fitScale.value + 0.01) return "cursor-grab";
@ -159,42 +156,9 @@ const handleMouseDown = (e) => {
window.addEventListener("mouseup", onMouseUp);
};
const closeContextMenu = () => {
contextMenu.value.visible = false;
window.removeEventListener("click", closeContextMenu);
};
const handleContextMenu = (e) => {
e.preventDefault();
contextMenu.value = { visible: true, x: e.clientX, y: e.clientY };
setTimeout(() => window.addEventListener("click", closeContextMenu), 0);
};
const copyImageToClipboard = async () => {
closeContextMenu();
const img = imageRef.value;
if (!img) return;
const displayW = Math.round(img.naturalWidth * fitScale.value);
const displayH = Math.round(img.naturalHeight * fitScale.value);
const canvas = document.createElement("canvas");
canvas.width = displayW;
canvas.height = displayH;
const ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, displayW, displayH);
canvas.toBlob(async (blob) => {
if (!blob) return;
try {
await navigator.clipboard.write([new ClipboardItem({ "image/png": blob })]);
} catch (err) {
console.error("Copy failed", err);
}
}, "image/png");
};
onUnmounted(() => {
window.removeEventListener("mousemove", onMouseMove);
window.removeEventListener("mouseup", onMouseUp);
window.removeEventListener("click", closeContextMenu);
});
const fileExtension = computed(() => {
@ -373,7 +337,6 @@ watch(
transition: isDragging ? 'none' : 'transform 0.12s ease',
}"
@load="handleImageLoad"
@contextmenu.prevent="handleContextMenu"
/>
<!-- Zoom level badge -->
<div
@ -399,21 +362,6 @@ watch(
>
Kolesce za povečavo / pomanjšavo · Povleči za premik
</div>
<!-- Custom context menu -->
<Teleport to="body">
<div
v-if="contextMenu.visible"
class="fixed z-[9999] min-w-36 rounded-md border bg-popover shadow-md py-1 text-sm text-popover-foreground"
:style="{ top: contextMenu.y + 'px', left: contextMenu.x + 'px' }"
>
<button
class="w-full text-left px-3 py-1.5 hover:bg-accent hover:text-accent-foreground rounded-sm"
@click.stop="copyImageToClipboard"
>
Kopiraj sliko
</button>
</div>
</Teleport>
</div>
</template>