@elixpo/lixsketch 5.5.20 → 5.5.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react/{CopyPaste-KJZ34MIP.js → CopyPaste-5OWPTCQ5.js} +43 -11
- package/dist/react/CopyPaste-5OWPTCQ5.js.map +7 -0
- package/dist/react/{EventDispatcher-XDRQS7BD.js → EventDispatcher-O7HCQQNM.js} +13 -13
- package/dist/react/Frame-RLSMJJSK.js +11 -0
- package/dist/react/{GraphEngine-KQXHNTZQ.js → GraphEngine-MM6ALA2N.js} +105 -148
- package/dist/react/{GraphEngine-KQXHNTZQ.js.map → GraphEngine-MM6ALA2N.js.map} +2 -2
- package/dist/react/IconShape-7OPXAKLK.js +10 -0
- package/dist/react/ImageShape-T7UEHP4A.js +10 -0
- package/dist/react/Line-WWQFBNX5.js +10 -0
- package/dist/react/{SceneSerializer-VY3HY4PF.js → SceneSerializer-RDISX4X7.js} +36 -8
- package/dist/react/SceneSerializer-RDISX4X7.js.map +7 -0
- package/dist/react/{Selection-U2AR6NQS.js → Selection-ZL3G6IAO.js} +4 -4
- package/dist/react/{SketchEngine-ZFYUTKET.js → SketchEngine-MYKRKRJG.js} +21 -21
- package/dist/react/{UndoRedo-BZ6W4QTV.js → UndoRedo-NL7KLR5B.js} +2 -2
- package/dist/react/{arrowTool-LKFSZKXC.js → arrowTool-CNVGM6RX.js} +3 -3
- package/dist/react/{chunk-SBSM3GQD.js → chunk-2THKDSWW.js} +4 -4
- package/dist/react/{chunk-JOPQ27YH.js → chunk-4BLMNGTR.js} +3 -3
- package/dist/react/{chunk-C62SXFBL.js → chunk-4TAS67SL.js} +23 -22
- package/dist/react/chunk-4TAS67SL.js.map +7 -0
- package/dist/react/{chunk-7VBI7S7T.js → chunk-AH4PWNEB.js} +10 -11
- package/dist/react/chunk-AH4PWNEB.js.map +7 -0
- package/dist/react/{chunk-RFHMFWVR.js → chunk-EDSKEM6E.js} +70 -6
- package/dist/react/chunk-EDSKEM6E.js.map +7 -0
- package/dist/react/{chunk-R5QXEVZ5.js → chunk-GC3KTQDA.js} +74 -15
- package/dist/react/chunk-GC3KTQDA.js.map +7 -0
- package/dist/react/{chunk-2V7G2PLX.js → chunk-GPIYXREE.js} +3 -3
- package/dist/react/{chunk-73VLPCBC.js → chunk-HFQZYCHJ.js} +3 -3
- package/dist/react/{chunk-C72OHQLE.js → chunk-ILGAFR56.js} +3 -3
- package/dist/react/{chunk-75G7XSZU.js → chunk-KVAQPCUH.js} +17 -3
- package/dist/react/chunk-KVAQPCUH.js.map +7 -0
- package/dist/react/{chunk-WEWMB35W.js → chunk-OFGJJKPH.js} +3 -3
- package/dist/react/{chunk-6G3ITAS5.js → chunk-SZD7DKYJ.js} +18 -9
- package/dist/react/chunk-SZD7DKYJ.js.map +7 -0
- package/dist/react/{chunk-MYYBFZD3.js → chunk-U3TB4KRS.js} +45 -6
- package/dist/react/chunk-U3TB4KRS.js.map +7 -0
- package/dist/react/{chunk-UQBT7F4K.js → chunk-V2QTYSBK.js} +2 -2
- package/dist/react/{chunk-2I3GH65Z.js → chunk-XFQECTTF.js} +44 -19
- package/dist/react/chunk-XFQECTTF.js.map +7 -0
- package/dist/react/{chunk-O64N5JPO.js → chunk-YF3TK7SC.js} +2 -2
- package/dist/react/{circleTool-RDOIMKKV.js → circleTool-KICNRQCI.js} +4 -4
- package/dist/react/{codeTool-VBDB2ES6.js → codeTool-NCQ73R6M.js} +4 -4
- package/dist/react/{frameTool-Z5ZDCX6H.js → frameTool-Y6KB67DO.js} +4 -4
- package/dist/react/{freehandTool-AAQCTMVM.js → freehandTool-MMULHCQ7.js} +4 -4
- package/dist/react/{iconTool-5WNDHI5T.js → iconTool-LSW2DYGB.js} +4 -4
- package/dist/react/{imageTool-ECPMT3BL.js → imageTool-2DSR32RX.js} +4 -4
- package/dist/react/index.js +141 -66
- package/dist/react/index.js.map +3 -3
- package/dist/react/{lineTool-XLOOZE3E.js → lineTool-N5I7IGT7.js} +4 -4
- package/dist/react/{rectangleTool-AEYDDJCA.js → rectangleTool-YUT7ZK2E.js} +4 -4
- package/dist/react/{textTool-5IJKTWVQ.js → textTool-IQOYPELP.js} +5 -5
- package/package.json +1 -1
- package/src/core/CopyPaste.js +38 -4
- package/src/core/GraphEngine.js +129 -185
- package/src/core/SceneSerializer.js +30 -0
- package/src/core/Selection.js +12 -11
- package/src/core/UndoRedo.js +47 -3
- package/src/react/components/canvas/MultiSelectActions.jsx +4 -1
- package/src/react/components/sidebars/IconSidebar.jsx +14 -23
- package/src/react/components/sidebars/ImageSidebar.jsx +47 -24
- package/src/react/store/useUIStore.js +71 -14
- package/src/shapes/Frame.js +19 -2
- package/src/shapes/IconShape.js +23 -25
- package/src/shapes/ImageShape.js +79 -4
- package/src/tools/frameTool.js +19 -9
- package/src/tools/iconTool.js +60 -25
- package/src/tools/imageTool.js +77 -13
- package/dist/react/CopyPaste-KJZ34MIP.js.map +0 -7
- package/dist/react/Frame-QLBAVLGW.js +0 -11
- package/dist/react/IconShape-32EYI2MA.js +0 -10
- package/dist/react/ImageShape-MYP2DVVH.js +0 -10
- package/dist/react/Line-FCCF2BOB.js +0 -10
- package/dist/react/SceneSerializer-VY3HY4PF.js.map +0 -7
- package/dist/react/chunk-2I3GH65Z.js.map +0 -7
- package/dist/react/chunk-6G3ITAS5.js.map +0 -7
- package/dist/react/chunk-75G7XSZU.js.map +0 -7
- package/dist/react/chunk-7VBI7S7T.js.map +0 -7
- package/dist/react/chunk-C62SXFBL.js.map +0 -7
- package/dist/react/chunk-MYYBFZD3.js.map +0 -7
- package/dist/react/chunk-R5QXEVZ5.js.map +0 -7
- package/dist/react/chunk-RFHMFWVR.js.map +0 -7
- /package/dist/react/{EventDispatcher-XDRQS7BD.js.map → EventDispatcher-O7HCQQNM.js.map} +0 -0
- /package/dist/react/{Frame-QLBAVLGW.js.map → Frame-RLSMJJSK.js.map} +0 -0
- /package/dist/react/{IconShape-32EYI2MA.js.map → IconShape-7OPXAKLK.js.map} +0 -0
- /package/dist/react/{ImageShape-MYP2DVVH.js.map → ImageShape-T7UEHP4A.js.map} +0 -0
- /package/dist/react/{Line-FCCF2BOB.js.map → Line-WWQFBNX5.js.map} +0 -0
- /package/dist/react/{Selection-U2AR6NQS.js.map → Selection-ZL3G6IAO.js.map} +0 -0
- /package/dist/react/{SketchEngine-ZFYUTKET.js.map → SketchEngine-MYKRKRJG.js.map} +0 -0
- /package/dist/react/{UndoRedo-BZ6W4QTV.js.map → UndoRedo-NL7KLR5B.js.map} +0 -0
- /package/dist/react/{arrowTool-LKFSZKXC.js.map → arrowTool-CNVGM6RX.js.map} +0 -0
- /package/dist/react/{chunk-SBSM3GQD.js.map → chunk-2THKDSWW.js.map} +0 -0
- /package/dist/react/{chunk-JOPQ27YH.js.map → chunk-4BLMNGTR.js.map} +0 -0
- /package/dist/react/{chunk-2V7G2PLX.js.map → chunk-GPIYXREE.js.map} +0 -0
- /package/dist/react/{chunk-73VLPCBC.js.map → chunk-HFQZYCHJ.js.map} +0 -0
- /package/dist/react/{chunk-C72OHQLE.js.map → chunk-ILGAFR56.js.map} +0 -0
- /package/dist/react/{chunk-WEWMB35W.js.map → chunk-OFGJJKPH.js.map} +0 -0
- /package/dist/react/{chunk-UQBT7F4K.js.map → chunk-V2QTYSBK.js.map} +0 -0
- /package/dist/react/{chunk-O64N5JPO.js.map → chunk-YF3TK7SC.js.map} +0 -0
- /package/dist/react/{circleTool-RDOIMKKV.js.map → circleTool-KICNRQCI.js.map} +0 -0
- /package/dist/react/{codeTool-VBDB2ES6.js.map → codeTool-NCQ73R6M.js.map} +0 -0
- /package/dist/react/{frameTool-Z5ZDCX6H.js.map → frameTool-Y6KB67DO.js.map} +0 -0
- /package/dist/react/{freehandTool-AAQCTMVM.js.map → freehandTool-MMULHCQ7.js.map} +0 -0
- /package/dist/react/{iconTool-5WNDHI5T.js.map → iconTool-LSW2DYGB.js.map} +0 -0
- /package/dist/react/{imageTool-ECPMT3BL.js.map → imageTool-2DSR32RX.js.map} +0 -0
- /package/dist/react/{lineTool-XLOOZE3E.js.map → lineTool-N5I7IGT7.js.map} +0 -0
- /package/dist/react/{rectangleTool-AEYDDJCA.js.map → rectangleTool-YUT7ZK2E.js.map} +0 -0
- /package/dist/react/{textTool-5IJKTWVQ.js.map → textTool-IQOYPELP.js.map} +0 -0
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/shapes/ImageShape.js"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable */\n// ImageShape class - extracted from imageTool.js\n// Depends on globals: svg, shapes, currentShape\n\nimport { updateAttachedArrows as updateArrowsForShape } from \"../tools/arrowTool.js\";\nlet isDragging = false;\nlet hoveredFrameImage = null;\nfunction selectImage() {} // stub - image selection handled by imageTool\n\nclass ImageShape {\n constructor(element) {\n this.element = element;\n this.shapeName = 'image';\n this.type = 'image';\n this.shapeID = element.shapeID || `image-${String(Date.now()).slice(0, 8)}-${Math.floor(Math.random() * 10000)}`;\n this.isAIGenerated = element.getAttribute('data-ai-generated') === 'true';\n this.aiModel = element.getAttribute('data-ai-model') || null;\n\n // Frame attachment properties\n this.parentFrame = null;\n\n // Upload pipeline state\n this.uploadStatus = 'pending'; // 'pending' | 'uploading' | 'done' | 'failed'\n this.uploadAbortController = null;\n this._uploadIndicator = null;\n\n // Update element attributes\n this.element.setAttribute('type', 'image');\n this.element.shapeID = this.shapeID;\n\n // Create a group wrapper for the image to work with frames properly\n this.group = document.createElementNS('http://www.w3.org/2000/svg', 'g');\n this.group.setAttribute('id', this.shapeID);\n\n // Move the image element into the group\n if (this.element.parentNode) {\n this.element.parentNode.removeChild(this.element);\n }\n this.group.appendChild(this.element);\n this._aiBadge = null;\n this._aiBadgeObserver = null;\n if (this.isAIGenerated) this.showAIBadge();\n svg.appendChild(this.group);\n }\n\n showAIBadge() {\n if (this._aiBadge) return;\n const ns = 'http://www.w3.org/2000/svg';\n const badge = document.createElementNS(ns, 'g');\n badge.setAttribute('class', 'ai-image-badge');\n badge.setAttribute('aria-label', 'AI generated image');\n badge.style.pointerEvents = 'none';\n\n const background = document.createElementNS(ns, 'rect');\n background.setAttribute('width', '32');\n background.setAttribute('height', '18');\n background.setAttribute('rx', '6');\n background.setAttribute('fill', '#7c5ce0');\n background.setAttribute('stroke', 'rgba(255,255,255,0.72)');\n background.setAttribute('stroke-width', '1');\n badge.appendChild(background);\n\n const label = document.createElementNS(ns, 'text');\n label.textContent = '\u2726 AI';\n label.setAttribute('x', '16');\n label.setAttribute('y', '12.5');\n label.setAttribute('fill', '#ffffff');\n label.setAttribute('font-family', 'system-ui, sans-serif');\n label.setAttribute('font-size', '9');\n label.setAttribute('font-weight', '700');\n label.setAttribute('text-anchor', 'middle');\n badge.appendChild(label);\n\n this.group.appendChild(badge);\n this._aiBadge = badge;\n this.updateAIBadgePosition();\n\n if (typeof MutationObserver !== 'undefined') {\n this._aiBadgeObserver = new MutationObserver(() => this.updateAIBadgePosition());\n this._aiBadgeObserver.observe(this.element, {\n attributes: true,\n attributeFilter: ['x', 'y', 'width', 'height', 'transform'],\n });\n }\n }\n\n updateAIBadgePosition() {\n if (!this._aiBadge) return;\n const x = Number.isFinite(this.x) ? this.x + 6 : 6;\n const y = Number.isFinite(this.y) ? this.y + 6 : 6;\n this._aiBadge.setAttribute('transform', `translate(${x}, ${y})`);\n const imageTransform = this.element.getAttribute('transform');\n if (imageTransform) {\n this._aiBadge.setAttribute('transform', `${imageTransform} translate(${x}, ${y})`);\n }\n }\n\n showUploadIndicator() {\n if (this._uploadIndicator) return;\n const g = document.createElementNS('http://www.w3.org/2000/svg', 'g');\n g.setAttribute('class', 'upload-indicator');\n\n const x = this.x + 6;\n const y = this.y + 6;\n\n // Background circle\n const bg = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\n bg.setAttribute('cx', x + 10);\n bg.setAttribute('cy', y + 10);\n bg.setAttribute('r', 12);\n bg.setAttribute('fill', 'rgba(0,0,0,0.7)');\n g.appendChild(bg);\n\n // Caution/loading icon (\u26A1 style triangle)\n const icon = document.createElementNS('http://www.w3.org/2000/svg', 'polygon');\n icon.setAttribute('points', `${x+10},${y+3} ${x+17},${y+16} ${x+3},${y+16}`);\n icon.setAttribute('fill', 'none');\n icon.setAttribute('stroke', '#FBBF24');\n icon.setAttribute('stroke-width', '1.5');\n icon.setAttribute('stroke-linejoin', 'round');\n g.appendChild(icon);\n\n // Exclamation mark inside\n const line = document.createElementNS('http://www.w3.org/2000/svg', 'line');\n line.setAttribute('x1', x + 10);\n line.setAttribute('y1', y + 8);\n line.setAttribute('x2', x + 10);\n line.setAttribute('y2', y + 12);\n line.setAttribute('stroke', '#FBBF24');\n line.setAttribute('stroke-width', '1.5');\n line.setAttribute('stroke-linecap', 'round');\n g.appendChild(line);\n\n const dot = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\n dot.setAttribute('cx', x + 10);\n dot.setAttribute('cy', y + 14.5);\n dot.setAttribute('r', 0.8);\n dot.setAttribute('fill', '#FBBF24');\n g.appendChild(dot);\n\n // Pulsing animation\n const animate = document.createElementNS('http://www.w3.org/2000/svg', 'animate');\n animate.setAttribute('attributeName', 'opacity');\n animate.setAttribute('values', '1;0.4;1');\n animate.setAttribute('dur', '1.5s');\n animate.setAttribute('repeatCount', 'indefinite');\n g.appendChild(animate);\n\n // Apply same transform as image (rotation)\n const transform = this.element.getAttribute('transform');\n if (transform) g.setAttribute('transform', transform);\n\n g.style.pointerEvents = 'none';\n this.group.appendChild(g);\n this._uploadIndicator = g;\n }\n\n removeUploadIndicator() {\n if (this._uploadIndicator && this._uploadIndicator.parentNode) {\n this._uploadIndicator.parentNode.removeChild(this._uploadIndicator);\n }\n this._uploadIndicator = null;\n }\n\n updateUploadIndicatorPosition() {\n if (!this._uploadIndicator) return;\n const x = this.x + 6;\n const y = this.y + 6;\n\n const bg = this._uploadIndicator.querySelector('circle');\n if (bg) { bg.setAttribute('cx', x + 10); bg.setAttribute('cy', y + 10); }\n\n const icon = this._uploadIndicator.querySelector('polygon');\n if (icon) icon.setAttribute('points', `${x+10},${y+3} ${x+17},${y+16} ${x+3},${y+16}`);\n\n const line = this._uploadIndicator.querySelector('line');\n if (line) {\n line.setAttribute('x1', x + 10); line.setAttribute('y1', y + 8);\n line.setAttribute('x2', x + 10); line.setAttribute('y2', y + 12);\n }\n\n const dots = this._uploadIndicator.querySelectorAll('circle');\n if (dots[1]) { dots[1].setAttribute('cx', x + 10); dots[1].setAttribute('cy', y + 14.5); }\n\n const transform = this.element.getAttribute('transform');\n if (transform) this._uploadIndicator.setAttribute('transform', transform);\n }\n \n // Position and dimension properties for frame compatibility\n get x() {\n return parseFloat(this.element.getAttribute('x'));\n }\n \n set x(value) {\n this.element.setAttribute('x', value);\n this.element.setAttribute('data-shape-x', value);\n }\n \n get y() {\n return parseFloat(this.element.getAttribute('y'));\n }\n \n set y(value) {\n this.element.setAttribute('y', value);\n this.element.setAttribute('data-shape-y', value);\n }\n \n get width() {\n return parseFloat(this.element.getAttribute('width'));\n }\n \n set width(value) {\n this.element.setAttribute('width', value);\n this.element.setAttribute('data-shape-width', value);\n }\n \n get height() {\n return parseFloat(this.element.getAttribute('height'));\n }\n \n set height(value) {\n this.element.setAttribute('height', value);\n this.element.setAttribute('data-shape-height', value);\n }\n \n get rotation() {\n const transform = this.element.getAttribute('transform');\n if (transform) {\n const rotateMatch = transform.match(/rotate\\(([^,]+)/);\n if (rotateMatch) {\n return parseFloat(rotateMatch[1]);\n }\n }\n return 0;\n }\n \n set rotation(value) {\n const centerX = this.x + this.width / 2;\n const centerY = this.y + this.height / 2;\n this.element.setAttribute('transform', `rotate(${value}, ${centerX}, ${centerY})`);\n this.element.setAttribute('data-shape-rotation', value);\n }\n\n move(dx, dy) {\n this.x += dx;\n this.y += dy;\n\n // Update transform for rotation\n const centerX = this.x + this.width / 2;\n const centerY = this.y + this.height / 2;\n this.element.setAttribute('transform', `rotate(${this.rotation}, ${centerX}, ${centerY})`);\n\n // Only update frame containment if we're actively dragging the shape itself\n // and not being moved by a parent frame\n if (isDragging && !this.isBeingMovedByFrame) {\n this.updateFrameContainment();\n }\n\n this.updateAttachedArrows();\n }\n\n updateAttachedArrows() {\n updateArrowsForShape(this);\n }\n\n updateFrameContainment() {\n // Don't update if we're being moved by a frame\n if (this.isBeingMovedByFrame) return;\n \n let targetFrame = null;\n \n // Find which frame this shape is over\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n shapes.forEach(shape => {\n if (shape.shapeName === 'frame' && shape.isShapeInFrame(this)) {\n targetFrame = shape;\n }\n });\n }\n \n // If we have a parent frame and we're being dragged, temporarily remove clipping\n if (this.parentFrame && isDragging) {\n this.parentFrame.temporarilyRemoveFromFrame(this);\n }\n \n // Update frame highlighting\n if (hoveredFrameImage && hoveredFrameImage !== targetFrame) {\n hoveredFrameImage.removeHighlight();\n }\n \n if (targetFrame && targetFrame !== hoveredFrameImage) {\n targetFrame.highlightFrame();\n }\n \n hoveredFrameImage = targetFrame;\n }\n\n contains(x, y) {\n const imgX = this.x;\n const imgY = this.y;\n const imgWidth = this.width;\n const imgHeight = this.height;\n \n // Simple bounding box check (could be enhanced for rotation)\n return x >= imgX && x <= imgX + imgWidth && y >= imgY && y <= imgY + imgHeight;\n }\n\n // Add draw method for consistency with other shapes\n draw() {\n this.updateAIBadgePosition();\n }\n\n remove() {\n if (this.group?.parentNode) this.group.parentNode.removeChild(this.group);\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n const index = shapes.indexOf(this);\n if (index !== -1) shapes.splice(index, 1);\n }\n }\n\n restore() {\n if (svg && this.group && !this.group.parentNode) svg.appendChild(this.group);\n if (typeof shapes !== 'undefined' && Array.isArray(shapes) && !shapes.includes(this)) shapes.push(this);\n this.updateAIBadgePosition();\n }\n\n // Add methods for frame compatibility\n removeSelection() {\n // Remove selection outlines from SVG\n svg.querySelectorAll(\".selection-outline\").forEach(el => el.remove());\n // Remove resize/rotation anchors if present\n svg.querySelectorAll(\".resize-anchor, .rotation-anchor\").forEach(el => el.remove());\n }\n\n selectShape() {\n // Image interaction state lives in imageTool. Use its bridge so\n // programmatically-created images (graphs, restored scenes, paste)\n // receive the same drag/resize controls as pointer-selected images.\n if (typeof window.__selectImageElement === 'function') {\n window.__selectImageElement(this.element, { force: true });\n }\n }\n}\n\nexport { ImageShape };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -10,13 +10,13 @@ import {
|
|
|
10
10
|
import {
|
|
11
11
|
cleanupAttachments,
|
|
12
12
|
updateAttachedArrows
|
|
13
|
-
} from "./chunk-
|
|
13
|
+
} from "./chunk-YF3TK7SC.js";
|
|
14
14
|
import {
|
|
15
15
|
pushCreateAction,
|
|
16
16
|
pushDeleteAction,
|
|
17
17
|
pushFrameAttachmentAction,
|
|
18
18
|
pushTransformAction
|
|
19
|
-
} from "./chunk-
|
|
19
|
+
} from "./chunk-U3TB4KRS.js";
|
|
20
20
|
|
|
21
21
|
// src/tools/imageTool.js
|
|
22
22
|
var isDraggingImage = false;
|
|
@@ -41,8 +41,13 @@ var aspect_ratio_lock = true;
|
|
|
41
41
|
var minImageSize = 20;
|
|
42
42
|
var draggedShapeInitialFrameImage = null;
|
|
43
43
|
var hoveredFrameImage = null;
|
|
44
|
-
var ROOM_IMAGE_LIMIT_BYTES = 5 * 1024 * 1024;
|
|
45
44
|
if (!window.__roomImageBytesUsed) window.__roomImageBytesUsed = 0;
|
|
45
|
+
function getRoomImageLimitBytes() {
|
|
46
|
+
return Number(window.__roomImageLimitBytes) || 2 * 1024 * 1024;
|
|
47
|
+
}
|
|
48
|
+
function usesPersonalCloudinary() {
|
|
49
|
+
return Boolean(window.__personalCloudinary?.connected && window.__personalCloudinary?.useForUploads);
|
|
50
|
+
}
|
|
46
51
|
function wrapImageElement(element) {
|
|
47
52
|
const imageShape = new ImageShape(element);
|
|
48
53
|
return imageShape;
|
|
@@ -60,16 +65,49 @@ async function uploadImageToCloudinary(imageShape) {
|
|
|
60
65
|
try {
|
|
61
66
|
const compressed = await compressImage(href);
|
|
62
67
|
if (signal.aborted) return;
|
|
68
|
+
const roomLimit = getRoomImageLimitBytes();
|
|
69
|
+
const oldSize = imageShape.element.__fileSize || 0;
|
|
70
|
+
if (!usesPersonalCloudinary() && (window.__roomImageBytesUsed || 0) - oldSize + compressed.compressedSize > roomLimit) {
|
|
71
|
+
throw new Error(`Room image limit reached (${Math.round(roomLimit / (1024 * 1024))} MB)`);
|
|
72
|
+
}
|
|
73
|
+
if (usesPersonalCloudinary()) {
|
|
74
|
+
const personalForm = new FormData();
|
|
75
|
+
personalForm.append("file", compressed.blob, `image_${Date.now()}`);
|
|
76
|
+
personalForm.append("sessionId", sessionId);
|
|
77
|
+
const personalResponse = await fetch("/api/images/personal-upload", {
|
|
78
|
+
method: "POST",
|
|
79
|
+
body: personalForm,
|
|
80
|
+
signal
|
|
81
|
+
});
|
|
82
|
+
const personalData = await personalResponse.json().catch(() => ({}));
|
|
83
|
+
if (!personalResponse.ok || !personalData.url) {
|
|
84
|
+
throw new Error(personalData.error || "Personal Cloudinary upload failed");
|
|
85
|
+
}
|
|
86
|
+
imageShape.element.setAttribute("href", personalData.url);
|
|
87
|
+
imageShape.element.setAttribute("data-href", personalData.url);
|
|
88
|
+
imageShape.element.setAttribute("data-cloudinary-id", personalData.publicId);
|
|
89
|
+
imageShape.element.setAttribute("data-storage-provider", "user_cloudinary");
|
|
90
|
+
imageShape.element.setAttribute("data-storage-cloud-name", personalData.cloudName || "");
|
|
91
|
+
imageShape.element.__fileSize = 0;
|
|
92
|
+
imageShape.element.setAttribute("data-file-size", "0");
|
|
93
|
+
window.__roomImageBytesUsed = Math.max(0, (window.__roomImageBytesUsed || 0) - oldSize);
|
|
94
|
+
imageShape.uploadStatus = "done";
|
|
95
|
+
return;
|
|
96
|
+
}
|
|
63
97
|
const signRes = await fetch(`${workerUrl}/api/images/sign`, {
|
|
64
98
|
method: "POST",
|
|
65
99
|
headers: { "Content-Type": "application/json" },
|
|
66
100
|
body: JSON.stringify({
|
|
67
101
|
sessionId,
|
|
68
|
-
filename: `img_${Date.now()}
|
|
102
|
+
filename: `img_${Date.now()}`,
|
|
103
|
+
sizeBytes: compressed.compressedSize
|
|
69
104
|
}),
|
|
70
105
|
signal
|
|
71
106
|
});
|
|
72
|
-
if (!signRes.ok)
|
|
107
|
+
if (!signRes.ok) {
|
|
108
|
+
const errorBody = await signRes.json().catch(() => ({}));
|
|
109
|
+
throw new Error(errorBody.message || "Failed to get upload signature");
|
|
110
|
+
}
|
|
73
111
|
const signData = await signRes.json();
|
|
74
112
|
if (signal.aborted) return;
|
|
75
113
|
const formData = new FormData();
|
|
@@ -86,13 +124,24 @@ async function uploadImageToCloudinary(imageShape) {
|
|
|
86
124
|
if (!uploadRes.ok) throw new Error("Cloudinary upload failed");
|
|
87
125
|
const uploadData = await uploadRes.json();
|
|
88
126
|
if (signal.aborted) return;
|
|
127
|
+
await fetch(`${workerUrl}/api/images/complete`, {
|
|
128
|
+
method: "POST",
|
|
129
|
+
headers: { "Content-Type": "application/json" },
|
|
130
|
+
body: JSON.stringify({
|
|
131
|
+
sessionId,
|
|
132
|
+
publicId: uploadData.public_id || signData.publicId,
|
|
133
|
+
sizeBytes: uploadData.bytes || compressed.compressedSize
|
|
134
|
+
}),
|
|
135
|
+
signal
|
|
136
|
+
}).catch(() => {
|
|
137
|
+
});
|
|
89
138
|
const cloudUrl = uploadData.secure_url || uploadData.url;
|
|
90
139
|
imageShape.element.setAttribute("href", cloudUrl);
|
|
91
140
|
imageShape.element.setAttribute("data-href", cloudUrl);
|
|
92
141
|
imageShape.element.setAttribute("data-cloudinary-id", uploadData.public_id);
|
|
93
|
-
const oldSize = imageShape.element.__fileSize || 0;
|
|
94
142
|
const newSize = uploadData.bytes || compressed.compressedSize;
|
|
95
143
|
imageShape.element.__fileSize = newSize;
|
|
144
|
+
imageShape.element.setAttribute("data-file-size", String(newSize));
|
|
96
145
|
window.__roomImageBytesUsed = Math.max(0, (window.__roomImageBytesUsed || 0) - oldSize + newSize);
|
|
97
146
|
imageShape.uploadStatus = "done";
|
|
98
147
|
console.log(`[ImageUpload] Uploaded to Cloudinary: ${cloudUrl} (${(newSize / 1024).toFixed(1)}KB)`);
|
|
@@ -151,17 +200,19 @@ var handleImageUpload = async (file) => {
|
|
|
151
200
|
isImageToolActive = false;
|
|
152
201
|
return;
|
|
153
202
|
}
|
|
154
|
-
|
|
203
|
+
const roomImageLimitBytes = getRoomImageLimitBytes();
|
|
204
|
+
const personalStorage = usesPersonalCloudinary();
|
|
205
|
+
if (!personalStorage && window.__roomImageBytesUsed + file.size > roomImageLimitBytes) {
|
|
155
206
|
const usedMB = (window.__roomImageBytesUsed / (1024 * 1024)).toFixed(2);
|
|
156
207
|
const fileMB = (file.size / (1024 * 1024)).toFixed(2);
|
|
157
|
-
alert(`Room image limit reached (
|
|
208
|
+
alert(`Room image limit reached (${Math.round(roomImageLimitBytes / (1024 * 1024))} MB). Used: ${usedMB} MB, this file: ${fileMB} MB. Delete some images to free space.`);
|
|
158
209
|
isImageToolActive = false;
|
|
159
210
|
return;
|
|
160
211
|
}
|
|
161
|
-
const maxSize =
|
|
212
|
+
const maxSize = personalStorage ? 20 * 1024 * 1024 : roomImageLimitBytes;
|
|
162
213
|
if (file.size > maxSize) {
|
|
163
214
|
console.error("File size too large");
|
|
164
|
-
alert(
|
|
215
|
+
alert(`Image file is too large. Please select an image smaller than ${Math.round(maxSize / (1024 * 1024))} MB.`);
|
|
165
216
|
return;
|
|
166
217
|
}
|
|
167
218
|
console.log("Processing image file:", file.name, "Size:", file.size, "Type:", file.type);
|
|
@@ -346,6 +397,7 @@ var handleMouseDownImage = async (e) => {
|
|
|
346
397
|
});
|
|
347
398
|
const placedFileSize = window.__pendingImageFileSize || 0;
|
|
348
399
|
finalImage.__fileSize = placedFileSize;
|
|
400
|
+
finalImage.setAttribute("data-file-size", String(placedFileSize));
|
|
349
401
|
window.__roomImageBytesUsed = (window.__roomImageBytesUsed || 0) + placedFileSize;
|
|
350
402
|
window.__pendingImageFileSize = 0;
|
|
351
403
|
finalImage.addEventListener("click", selectImage);
|
|
@@ -392,8 +444,8 @@ var handleMouseUpImage = (e) => {
|
|
|
392
444
|
hoveredFrameImage = null;
|
|
393
445
|
}
|
|
394
446
|
};
|
|
395
|
-
function selectImage(event) {
|
|
396
|
-
if (!isSelectionToolActive) return;
|
|
447
|
+
function selectImage(event, force = false) {
|
|
448
|
+
if (!isSelectionToolActive && !force) return;
|
|
397
449
|
event.stopPropagation();
|
|
398
450
|
if (selectedImage) {
|
|
399
451
|
removeSelectionOutline();
|
|
@@ -904,9 +956,11 @@ function deleteCurrentImage() {
|
|
|
904
956
|
const match = imgHref.match(/\/upload\/(?:v\d+\/)?(lixsketch\/.+?)(?:\.\w+)?$/);
|
|
905
957
|
if (match) {
|
|
906
958
|
const publicId = match[1];
|
|
959
|
+
const isPersonal = selectedImage.getAttribute("data-storage-provider") === "user_cloudinary";
|
|
907
960
|
const workerUrl = window.__WORKER_URL;
|
|
908
|
-
|
|
909
|
-
|
|
961
|
+
const deleteUrl = isPersonal ? "/api/images/personal-delete" : workerUrl ? `${workerUrl}/api/images/delete` : null;
|
|
962
|
+
if (deleteUrl) {
|
|
963
|
+
fetch(deleteUrl, {
|
|
910
964
|
method: "DELETE",
|
|
911
965
|
headers: { "Content-Type": "application/json" },
|
|
912
966
|
body: JSON.stringify({ publicId })
|
|
@@ -940,6 +994,11 @@ document.addEventListener("keydown", (e) => {
|
|
|
940
994
|
}
|
|
941
995
|
});
|
|
942
996
|
window.uploadImageToCloudinary = uploadImageToCloudinary;
|
|
997
|
+
window.__selectImageElement = function(element, { force = false } = {}) {
|
|
998
|
+
if (!element) return;
|
|
999
|
+
selectImage({ target: element, stopPropagation: () => {
|
|
1000
|
+
} }, force);
|
|
1001
|
+
};
|
|
943
1002
|
window.openImageFilePicker = function() {
|
|
944
1003
|
isImageToolActive = true;
|
|
945
1004
|
const fileInput = document.createElement("input");
|
|
@@ -979,4 +1038,4 @@ export {
|
|
|
979
1038
|
handleMouseDownImage,
|
|
980
1039
|
handleMouseUpImage
|
|
981
1040
|
};
|
|
982
|
-
//# sourceMappingURL=chunk-
|
|
1041
|
+
//# sourceMappingURL=chunk-GC3KTQDA.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/tools/imageTool.js"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable */\n// Image tool event handlers - extracted from imageTool.js\nimport { pushCreateAction, pushDeleteAction, pushTransformAction, pushFrameAttachmentAction } from '../core/UndoRedo.js';\nimport { updateAttachedArrows as updateArrowsForShape, cleanupAttachments } from './arrowTool.js';\nimport { compressImage } from '../utils/imageCompressor.js';\nimport { isAllowedImage, IMAGE_ACCEPT_ATTR } from '../utils/allowedImageTypes.js';\nimport { registerRotationAnchor } from '../core/ScreenSpaceControls.js';\n\n\nlet isDraggingImage = false;\nlet imageToPlace = null;\nlet imageX = 0;\nlet imageY = 0;\nlet scaleFactor = 0.2;\nlet currentImageElement = null;\n\nlet selectedImage = null;\nlet originalX, originalY, originalWidth, originalHeight;\nlet currentAnchor = null;\nlet isDragging = false;\nlet isRotatingImage = false;\nlet dragOffsetX, dragOffsetY;\nlet startRotationMouseAngle = null;\nlet startImageRotation = null;\nlet imageRotation = 0;\nlet aspect_ratio_lock = true;\nconst minImageSize = 20;\n\n// Frame attachment variables\nlet draggedShapeInitialFrameImage = null;\nlet hoveredFrameImage = null;\n\nif (!window.__roomImageBytesUsed) window.__roomImageBytesUsed = 0;\n\nfunction getRoomImageLimitBytes() {\n return Number(window.__roomImageLimitBytes) || 2 * 1024 * 1024;\n}\n\nfunction usesPersonalCloudinary() {\n return Boolean(window.__personalCloudinary?.connected && window.__personalCloudinary?.useForUploads);\n}\n\n\n// Convert SVG element to our ImageShape class\nfunction wrapImageElement(element) {\n const imageShape = new ImageShape(element);\n return imageShape;\n}\n\n/**\n * Async image upload pipeline:\n * 1. Show loading indicator on the image\n * 2. Compress the image adaptively\n * 3. Get a signed upload URL from the worker\n * 4. Upload compressed image to Cloudinary\n * 5. Replace the base64 href with Cloudinary URL\n * 6. Remove loading indicator\n */\nasync function uploadImageToCloudinary(imageShape) {\n const workerUrl = window.__WORKER_URL;\n const sessionId = window.__sessionID;\n if (!workerUrl || !sessionId) return;\n\n const href = imageShape.element.getAttribute('href') || '';\n if (!href.startsWith('data:')) return; // already a URL, skip\n\n imageShape.uploadStatus = 'uploading';\n imageShape.uploadAbortController = new AbortController();\n const signal = imageShape.uploadAbortController.signal;\n\n imageShape.showUploadIndicator();\n\n try {\n // Step 1: Compress\n const compressed = await compressImage(href);\n if (signal.aborted) return;\n\n const roomLimit = getRoomImageLimitBytes();\n const oldSize = imageShape.element.__fileSize || 0;\n if (!usesPersonalCloudinary() && (window.__roomImageBytesUsed || 0) - oldSize + compressed.compressedSize > roomLimit) {\n throw new Error(`Room image limit reached (${Math.round(roomLimit / (1024 * 1024))} MB)`);\n }\n\n if (usesPersonalCloudinary()) {\n const personalForm = new FormData();\n personalForm.append('file', compressed.blob, `image_${Date.now()}`);\n personalForm.append('sessionId', sessionId);\n const personalResponse = await fetch('/api/images/personal-upload', {\n method: 'POST',\n body: personalForm,\n signal,\n });\n const personalData = await personalResponse.json().catch(() => ({}));\n if (!personalResponse.ok || !personalData.url) {\n throw new Error(personalData.error || 'Personal Cloudinary upload failed');\n }\n imageShape.element.setAttribute('href', personalData.url);\n imageShape.element.setAttribute('data-href', personalData.url);\n imageShape.element.setAttribute('data-cloudinary-id', personalData.publicId);\n imageShape.element.setAttribute('data-storage-provider', 'user_cloudinary');\n imageShape.element.setAttribute('data-storage-cloud-name', personalData.cloudName || '');\n imageShape.element.__fileSize = 0;\n imageShape.element.setAttribute('data-file-size', '0');\n window.__roomImageBytesUsed = Math.max(0, (window.__roomImageBytesUsed || 0) - oldSize);\n imageShape.uploadStatus = 'done';\n return;\n }\n\n // Step 2: Get signed upload params\n const signRes = await fetch(`${workerUrl}/api/images/sign`, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({\n sessionId,\n filename: `img_${Date.now()}`,\n sizeBytes: compressed.compressedSize,\n }),\n signal,\n });\n if (!signRes.ok) {\n const errorBody = await signRes.json().catch(() => ({}));\n throw new Error(errorBody.message || 'Failed to get upload signature');\n }\n const signData = await signRes.json();\n if (signal.aborted) return;\n\n // Step 3: Upload to Cloudinary\n const formData = new FormData();\n formData.append('file', compressed.blob);\n formData.append('api_key', signData.apiKey);\n formData.append('timestamp', String(signData.timestamp));\n formData.append('signature', signData.signature);\n formData.append('folder', signData.folder);\n formData.append('public_id', signData.publicId);\n\n const uploadRes = await fetch(\n `https://api.cloudinary.com/v1_1/${signData.cloudName}/image/upload`,\n { method: 'POST', body: formData, signal }\n );\n if (!uploadRes.ok) throw new Error('Cloudinary upload failed');\n const uploadData = await uploadRes.json();\n if (signal.aborted) return;\n\n await fetch(`${workerUrl}/api/images/complete`, {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({\n sessionId,\n publicId: uploadData.public_id || signData.publicId,\n sizeBytes: uploadData.bytes || compressed.compressedSize,\n }),\n signal,\n }).catch(() => {});\n\n // Step 4: Replace base64 with Cloudinary URL\n const cloudUrl = uploadData.secure_url || uploadData.url;\n imageShape.element.setAttribute('href', cloudUrl);\n imageShape.element.setAttribute('data-href', cloudUrl);\n imageShape.element.setAttribute('data-cloudinary-id', uploadData.public_id);\n\n // Update file size tracking with actual compressed size\n const newSize = uploadData.bytes || compressed.compressedSize;\n imageShape.element.__fileSize = newSize;\n imageShape.element.setAttribute('data-file-size', String(newSize));\n window.__roomImageBytesUsed = Math.max(0, (window.__roomImageBytesUsed || 0) - oldSize + newSize);\n\n imageShape.uploadStatus = 'done';\n console.log(`[ImageUpload] Uploaded to Cloudinary: ${cloudUrl} (${(newSize / 1024).toFixed(1)}KB)`);\n } catch (err) {\n if (signal.aborted) {\n console.log('[ImageUpload] Upload aborted (image deleted)');\n return;\n }\n console.warn('[ImageUpload] Upload failed:', err);\n imageShape.uploadStatus = 'failed';\n } finally {\n imageShape.removeUploadIndicator();\n imageShape.uploadAbortController = null;\n }\n}\n\ndocument.getElementById(\"importImage\")?.addEventListener('click', () => {\n console.log('Import image clicked');\n isImageToolActive = true;\n console.log('isImageToolActive set to:', isImageToolActive);\n\n // Create a file input element\n const fileInput = document.createElement('input');\n fileInput.type = 'file';\n fileInput.accept = IMAGE_ACCEPT_ATTR; // Static images only \u2014 see allowedImageTypes.js\n fileInput.style.display = 'none'; // Hide the input element\n \n // Add the input to the document temporarily\n document.body.appendChild(fileInput);\n \n let fileSelected = false;\n\n // Handle file selection\n fileInput.addEventListener('change', (event) => {\n const file = event.target.files[0];\n if (file) {\n fileSelected = true;\n handleImageUpload(file);\n }\n document.body.removeChild(fileInput);\n });\n\n // Detect cancel\n const onFocus = () => {\n window.removeEventListener('focus', onFocus);\n setTimeout(() => {\n if (!fileSelected) {\n isImageToolActive = false;\n if (window.__sketchEngine?.setActiveTool) {\n window.__sketchEngine.setActiveTool('select');\n }\n if (fileInput.parentNode) {\n document.body.removeChild(fileInput);\n }\n }\n }, 300);\n };\n window.addEventListener('focus', onFocus);\n\n // Trigger the file picker\n fileInput.click();\n});\n\n\nconst loadHardcodedImage = (imagePath) => {\n console.log('Loading hardcoded image:', imagePath);\n const img = new Image();\n img.onload = () => {\n console.log('Image loaded successfully');\n const canvas = document.createElement('canvas');\n const ctx = canvas.getContext('2d');\n canvas.width = img.width;\n canvas.height = img.height;\n ctx.drawImage(img, 0, 0);\n imageToPlace = canvas.toDataURL();\n isDraggingImage = true;\n console.log('Image ready to place, isDraggingImage:', isDraggingImage);\n };\n img.onerror = (error) => {\n console.error('Failed to load the hardcoded image:', error);\n console.error('Image path:', imagePath);\n };\n img.src = imagePath;\n};\n\nconst handleImageUpload = async (file) => {\n if (!file || !isImageToolActive) return;\n\n // Validate file type against the canonical allowlist (avif, jpeg, jpg,\n // png, bmp, svg, webp). Animated GIF, HEIC, TIFF, video, audio, and\n // arbitrary files are rejected here.\n if (!isAllowedImage(file)) {\n console.error('Rejected file type:', file.type, file.name);\n alert('Unsupported file type. Allowed: AVIF, JPEG, PNG, BMP, SVG, WebP.');\n isImageToolActive = false;\n return;\n }\n\n const roomImageLimitBytes = getRoomImageLimitBytes();\n const personalStorage = usesPersonalCloudinary();\n if (!personalStorage && window.__roomImageBytesUsed + file.size > roomImageLimitBytes) {\n const usedMB = (window.__roomImageBytesUsed / (1024 * 1024)).toFixed(2);\n const fileMB = (file.size / (1024 * 1024)).toFixed(2);\n alert(`Room image limit reached (${Math.round(roomImageLimitBytes / (1024 * 1024))} MB). Used: ${usedMB} MB, this file: ${fileMB} MB. Delete some images to free space.`);\n isImageToolActive = false;\n return;\n }\n\n const maxSize = personalStorage ? 20 * 1024 * 1024 : roomImageLimitBytes;\n if (file.size > maxSize) {\n console.error('File size too large');\n alert(`Image file is too large. Please select an image smaller than ${Math.round(maxSize / (1024 * 1024))} MB.`);\n return;\n }\n\n console.log('Processing image file:', file.name, 'Size:', file.size, 'Type:', file.type);\n\n // Read \u2192 optionally compress \u2192 place. We compress client-side BEFORE\n // placement so that consumers without an upload pipeline (VS Code\n // extension, offline npm usage) still embed a compressed data URL\n // rather than the original. SVGs are passed through unchanged because\n // rasterizing them would destroy their vector fidelity.\n try {\n const rawDataUrl = await readFileAsDataUrl(file);\n const isSvg = (file.type || '').toLowerCase() === 'image/svg+xml'\n || (file.name || '').toLowerCase().endsWith('.svg');\n\n let placedDataUrl = rawDataUrl;\n let placedSize = file.size;\n if (!isSvg) {\n try {\n const compressed = await compressImage(rawDataUrl);\n if (compressed?.dataUrl) {\n placedDataUrl = compressed.dataUrl;\n placedSize = compressed.compressedSize || placedSize;\n }\n } catch (err) {\n console.warn('[ImageTool] Pre-placement compression failed, using raw:', err);\n }\n }\n\n window.__pendingImageFileSize = placedSize;\n imageToPlace = placedDataUrl;\n isDraggingImage = true;\n console.log('Image loaded and ready to place', { size: placedSize, isSvg });\n } catch (err) {\n console.error('Error reading file:', err);\n alert('Error reading the image file. Please try again.');\n isImageToolActive = false;\n }\n};\n\nfunction readFileAsDataUrl(file) {\n return new Promise((resolve, reject) => {\n const reader = new FileReader();\n reader.onload = (e) => resolve(e.target.result);\n reader.onerror = (err) => reject(err);\n reader.readAsDataURL(file);\n });\n}\n\n// Add coordinate conversion function like in other tools\nfunction getSVGCoordsFromMouse(e) {\n const viewBox = svg.viewBox.baseVal;\n const rect = svg.getBoundingClientRect();\n const mouseX = e.clientX - rect.left;\n const mouseY = e.clientY - rect.top;\n const svgX = viewBox.x + (mouseX / rect.width) * viewBox.width;\n const svgY = viewBox.y + (mouseY / rect.height) * viewBox.height;\n return { x: svgX, y: svgY };\n}\n\n// Event handler for mousemove on the SVG\nconst handleMouseMoveImage = (e) => {\n if (!isDraggingImage || !imageToPlace || !isImageToolActive) return; // Also check isImageToolActive\n\n // Get mouse coordinates relative to the SVG element\n const { x, y } = getSVGCoordsFromMouse(e);\n imageX = x;\n imageY = y;\n\n drawMiniatureImage();\n \n // Check for frame containment while placing image (but don't apply clipping yet)\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n shapes.forEach(frame => {\n if (frame.shapeName === 'frame') {\n // Create temporary image bounds for frame checking\n const tempImageBounds = {\n x: imageX - 50, // Half of miniature width\n y: imageY - 50, // Approximate half height\n width: 100,\n height: 100\n };\n \n if (frame.isShapeInFrame(tempImageBounds)) {\n frame.highlightFrame();\n hoveredFrameImage = frame;\n } else if (hoveredFrameImage === frame) {\n frame.removeHighlight();\n hoveredFrameImage = null;\n }\n }\n });\n }\n};\n\nconst drawMiniatureImage = () => {\n if (!isDraggingImage || !imageToPlace || !isImageToolActive) return; // Also check isImageToolActive\n\n const miniatureWidth = 100; // Fixed width for miniature (adjust as needed)\n getImageAspectRatio(imageToPlace)\n .then(aspectRatio => {\n const miniatureHeight = miniatureWidth * aspectRatio; // Maintain aspect ratio\n\n // Remove the previous miniature image, if it exists\n if (currentImageElement) {\n svg.removeChild(currentImageElement);\n currentImageElement = null; // Important: clear the reference\n }\n\n // Create an SVG image element for the miniature\n currentImageElement = document.createElementNS(\"http://www.w3.org/2000/svg\", \"image\");\n currentImageElement.setAttribute(\"href\", imageToPlace);\n currentImageElement.setAttribute(\"x\", imageX - miniatureWidth / 2); \n currentImageElement.setAttribute(\"y\", imageY - miniatureHeight / 2);\n currentImageElement.setAttribute(\"width\", miniatureWidth);\n currentImageElement.setAttribute(\"height\", miniatureHeight);\n currentImageElement.setAttribute(\"preserveAspectRatio\", \"xMidYMid meet\");\n\n svg.appendChild(currentImageElement);\n })\n .catch(error => {\n console.error(\"Error getting aspect ratio:\", error);\n \n });\n};\n\nfunction getImageAspectRatio(dataUrl) {\n return new Promise((resolve, reject) => {\n const img = new Image();\n img.onload = () => {\n resolve(img.height / img.width);\n };\n img.onerror = () => {\n reject(new Error('Failed to load image for aspect ratio calculation.'));\n };\n img.src = dataUrl;\n });\n}\n\n// Update the handleMouseDownImage function to create proper group structure\nconst handleMouseDownImage = async (e) => {\n if (!isDraggingImage || !imageToPlace || !isImageToolActive) {\n // Handle image selection if selection tool is active\n if (isSelectionToolActive) {\n const clickedImage = e.target.closest('image');\n if (clickedImage) {\n selectImage({ target: clickedImage, stopPropagation: () => e.stopPropagation() });\n return;\n }\n }\n return;\n }\n\n try {\n //Get aspect ratio before we clear the temporary image data.\n let aspectRatio = await getImageAspectRatio(imageToPlace);\n\n // Remove the miniature\n if (currentImageElement) {\n svg.removeChild(currentImageElement);\n currentImageElement = null;\n }\n\n // Calculate actual dimensions of the placed image\n const placedImageWidth = 200; // Adjust as needed\n const placedImageHeight = placedImageWidth * aspectRatio;\n\n // Get SVG coordinates\n const { x: placedX, y: placedY } = getSVGCoordsFromMouse(e);\n\n // Create a new SVG image element for the final image\n const finalImage = document.createElementNS(\"http://www.w3.org/2000/svg\", \"image\");\n finalImage.setAttribute(\"href\", imageToPlace);\n finalImage.setAttribute(\"x\", placedX - placedImageWidth / 2);\n finalImage.setAttribute(\"y\", placedY - placedImageHeight / 2);\n finalImage.setAttribute(\"width\", placedImageWidth);\n finalImage.setAttribute(\"height\", placedImageHeight);\n finalImage.setAttribute(\"preserveAspectRatio\", \"xMidYMid meet\");\n\n // Store data for undo/redo\n finalImage.setAttribute('data-href', imageToPlace);\n finalImage.setAttribute('data-x', placedX - placedImageWidth / 2);\n finalImage.setAttribute('data-y', placedY - placedImageHeight / 2);\n finalImage.setAttribute('data-width', placedImageWidth);\n finalImage.setAttribute('data-height', placedImageHeight);\n \n // Add arrow attachment support data attributes\n finalImage.setAttribute('type', 'image');\n finalImage.setAttribute('data-shape-x', placedX - placedImageWidth / 2);\n finalImage.setAttribute('data-shape-y', placedY - placedImageHeight / 2);\n finalImage.setAttribute('data-shape-width', placedImageWidth);\n finalImage.setAttribute('data-shape-height', placedImageHeight);\n finalImage.setAttribute('data-shape-rotation', 0);\n finalImage.shapeID = `image-${String(Date.now()).slice(0, 8)}-${Math.floor(Math.random() * 10000)}`;\n\n // Don't add to SVG directly - let ImageShape wrapper handle it\n // svg.appendChild(finalImage);\n\n // Create ImageShape wrapper for frame functionality\n const imageShape = wrapImageElement(finalImage);\n\n // Add to shapes array for arrow attachment and frame functionality\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n shapes.push(imageShape);\n console.log('Image added to shapes array for arrow attachment and frame functionality');\n } else {\n console.warn('shapes array not found - arrows and frames may not work with images');\n }\n\n // Check for frame containment and track attachment\n const finalFrame = hoveredFrameImage;\n if (finalFrame) {\n finalFrame.addShapeToFrame(imageShape);\n // Track the attachment for undo\n pushFrameAttachmentAction(finalFrame, imageShape, 'attach', null);\n }\n\n // Add to undo stack for image creation\n pushCreateAction({\n type: 'image',\n element: imageShape,\n remove: () => {\n if (imageShape.group && imageShape.group.parentNode) {\n imageShape.group.parentNode.removeChild(imageShape.group);\n }\n // Remove from shapes array\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n const idx = shapes.indexOf(imageShape);\n if (idx !== -1) shapes.splice(idx, 1);\n }\n // Clean up arrow attachments when image is removed\n if (typeof cleanupAttachments === 'function') {\n cleanupAttachments(finalImage);\n }\n },\n restore: () => {\n svg.appendChild(imageShape.group);\n // Add back to shapes array\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n if (shapes.indexOf(imageShape) === -1) {\n shapes.push(imageShape);\n }\n }\n }\n });\n\n // Track image size for room limit\n const placedFileSize = window.__pendingImageFileSize || 0;\n finalImage.__fileSize = placedFileSize;\n finalImage.setAttribute('data-file-size', String(placedFileSize));\n window.__roomImageBytesUsed = (window.__roomImageBytesUsed || 0) + placedFileSize;\n window.__pendingImageFileSize = 0;\n\n // Add click event to the newly added image\n finalImage.addEventListener('click', selectImage);\n\n // Clear frame highlighting\n if (hoveredFrameImage) {\n hoveredFrameImage.removeHighlight();\n hoveredFrameImage = null;\n }\n\n // Auto-select the placed image and switch to selection tool\n const placedShape = imageShape;\n if (window.__sketchStoreApi) window.__sketchStoreApi.setActiveTool('select', { afterDraw: true });\n currentShape = placedShape;\n currentShape.isSelected = true;\n placedShape.selectShape();\n\n // Fire async upload pipeline. We dispatch via window.uploadImageToCloudinary\n // so embedded hosts (e.g. blogs.elixpo) can swap in a postMessage-based\n // implementation that routes uploads through the host's media API.\n const uploader = (typeof window !== 'undefined' && window.uploadImageToCloudinary) || uploadImageToCloudinary;\n uploader(imageShape).catch(err => {\n console.warn('[ImageTool] Upload pipeline error:', err);\n });\n\n } catch (error) {\n console.error(\"Error placing image:\", error);\n isDraggingImage = false;\n imageToPlace = null;\n isImageToolActive = false; // Important: Reset the tool state.\n } finally {\n isDraggingImage = false;\n imageToPlace = null;\n isImageToolActive = false; // Important: Reset the tool state.\n }\n};\n\nconst handleMouseUpImage = (e) => {\n // Only deselect if the user actually clicked (mousedown+mouseup) on a non-image area\n // of the SVG canvas \u2014 not when the mouse just leaves to the UI\n if (isSelectionToolActive && selectedImage) {\n const clickedElement = e.target;\n const isOnSVG = clickedElement === svg || clickedElement.ownerSVGElement === svg;\n const isImageElement = clickedElement.tagName === 'image';\n const isAnchorElement = clickedElement.classList.contains('resize-anchor') ||\n clickedElement.classList.contains('rotation-anchor') ||\n clickedElement.classList.contains('selection-outline');\n\n // Only deselect if mouseup is directly on the SVG background (not on any shape/anchor)\n if (isOnSVG && !isImageElement && !isAnchorElement && clickedElement === svg && !isDragging && !isRotatingImage && !currentAnchor) {\n removeSelectionOutline();\n selectedImage = null;\n if (window.__sketchStoreApi) {\n window.__sketchStoreApi.clearSelectedShapeSidebar();\n }\n }\n }\n \n // Clear frame highlighting if placing image\n if (hoveredFrameImage) {\n hoveredFrameImage.removeHighlight();\n hoveredFrameImage = null;\n }\n};\n\nfunction selectImage(event, force = false) {\n if (!isSelectionToolActive && !force) return;\n\n event.stopPropagation(); // Prevent click from propagating to the SVG\n\n if (selectedImage) {\n removeSelectionOutline();\n }\n\n selectedImage = event.target;\n \n // Get the current rotation from the image transform attribute\n const transform = selectedImage.getAttribute('transform');\n if (transform) {\n const rotateMatch = transform.match(/rotate\\(([^,]+)/);\n if (rotateMatch) {\n imageRotation = parseFloat(rotateMatch[1]);\n }\n } else {\n imageRotation = 0;\n }\n \n addSelectionOutline();\n\n // Store original dimensions for resizing\n originalX = parseFloat(selectedImage.getAttribute('x'));\n originalY = parseFloat(selectedImage.getAttribute('y'));\n originalWidth = parseFloat(selectedImage.getAttribute('width'));\n originalHeight = parseFloat(selectedImage.getAttribute('height'));\n\n // Add drag event listeners to the selected image\n selectedImage.addEventListener('pointerdown', startDrag);\n selectedImage.addEventListener('pointerup', stopDrag);\n selectedImage.addEventListener('pointerleave', stopDrag);\n\n // Set currentShape for sidebar + layer controls\n const imageShape = (typeof shapes !== 'undefined' && Array.isArray(shapes))\n ? shapes.find(s => s.shapeName === 'image' && s.element === selectedImage)\n : null;\n if (imageShape) {\n window.currentShape = imageShape;\n }\n if (typeof window.__showSidebarForShape === 'function') {\n window.__showSidebarForShape('image');\n }\n}\n\nfunction addSelectionOutline() {\n if (!selectedImage) return;\n\n const x = parseFloat(selectedImage.getAttribute('x'));\n const y = parseFloat(selectedImage.getAttribute('y'));\n const width = parseFloat(selectedImage.getAttribute('width'));\n const height = parseFloat(selectedImage.getAttribute('height'));\n\n const zoom = window.currentZoom || 1;\n const selectionPadding = 8 / zoom; // Padding around the selection\n const expandedX = x - selectionPadding;\n const expandedY = y - selectionPadding;\n const expandedWidth = width + 2 * selectionPadding;\n const expandedHeight = height + 2 * selectionPadding;\n\n // Create a dashed outline\n const outlinePoints = [\n [expandedX, expandedY],\n [expandedX + expandedWidth, expandedY],\n [expandedX + expandedWidth, expandedY + expandedHeight],\n [expandedX, expandedY + expandedHeight],\n [expandedX, expandedY]\n ];\n const pointsAttr = outlinePoints.map(p => p.join(',')).join(' ');\n const outline = document.createElementNS(\"http://www.w3.org/2000/svg\", \"polyline\");\n outline.setAttribute(\"points\", pointsAttr);\n outline.setAttribute(\"fill\", \"none\");\n outline.setAttribute(\"stroke\", \"#5B57D1\");\n outline.setAttribute(\"stroke-width\", 1.5);\n outline.setAttribute(\"stroke-dasharray\", \"4 2\");\n outline.setAttribute(\"style\", \"pointer-events: none;\");\n outline.setAttribute(\"class\", \"selection-outline\");\n\n // Apply the same rotation as the image\n const centerX = x + width / 2;\n const centerY = y + height / 2;\n outline.setAttribute('transform', `rotate(${imageRotation}, ${centerX}, ${centerY})`);\n\n svg.appendChild(outline);\n\n // Add resize anchors\n addResizeAnchors(expandedX, expandedY, expandedWidth, expandedHeight, centerX, centerY);\n \n // Add rotation anchor\n addRotationAnchor(expandedX, expandedY, expandedWidth, expandedHeight, centerX, centerY);\n}\n\nfunction removeSelectionOutline() {\n // Remove ALL selection outlines (querySelectorAll to prevent stacking)\n svg.querySelectorAll(\".selection-outline\").forEach(el => el.remove());\n\n // Remove resize anchors\n removeResizeAnchors();\n\n // Remove rotation anchor\n removeRotationAnchor();\n\n // Remove drag event listeners\n if (selectedImage) {\n selectedImage.removeEventListener('pointerdown', startDrag);\n selectedImage.removeEventListener('pointerup', stopDrag);\n selectedImage.removeEventListener('pointerleave', stopDrag);\n }\n}\n\nfunction addResizeAnchors(x, y, width, height, centerX, centerY) {\n const zoom = window.currentZoom || 1;\n const anchorSize = 10 / zoom;\n const anchorStrokeWidth = 2 / zoom;\n\n const positions = [\n { x: x, y: y }, // Top-left\n { x: x + width, y: y }, // Top-right\n { x: x, y: y + height }, // Bottom-left\n { x: x + width, y: y + height } // Bottom-right\n ];\n\n positions.forEach((pos, i) => {\n const anchor = document.createElementNS(\"http://www.w3.org/2000/svg\", \"rect\");\n anchor.setAttribute(\"x\", pos.x - anchorSize / 2);\n anchor.setAttribute(\"y\", pos.y - anchorSize / 2);\n anchor.setAttribute(\"width\", anchorSize);\n anchor.setAttribute(\"height\", anchorSize);\n anchor.setAttribute(\"fill\", \"#121212\");\n anchor.setAttribute(\"stroke\", \"#5B57D1\");\n anchor.setAttribute(\"stroke-width\", anchorStrokeWidth);\n anchor.setAttribute(\"vector-effect\", \"non-scaling-stroke\");\n anchor.setAttribute(\"class\", \"resize-anchor\");\n anchor.style.cursor = [\"nw-resize\", \"ne-resize\", \"sw-resize\", \"se-resize\"][i];\n\n // Apply the same rotation as the image\n anchor.setAttribute('transform', `rotate(${imageRotation}, ${centerX}, ${centerY})`);\n\n svg.appendChild(anchor);\n\n // Add event listeners for resizing\n anchor.addEventListener('pointerdown', startResize);\n anchor.addEventListener('pointerup', stopResize);\n });\n}\n\nfunction addRotationAnchor(x, y, width, height, centerX, centerY) {\n const zoom = window.currentZoom || 1;\n const anchorStrokeWidth = 2 / zoom;\n const rotationAnchorPos = { x: x + width / 2, y: y - 30 / zoom };\n \n const rotationAnchor = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\n rotationAnchor.setAttribute('cx', rotationAnchorPos.x);\n rotationAnchor.setAttribute('cy', rotationAnchorPos.y);\n rotationAnchor.setAttribute('r', 5 / zoom);\n rotationAnchor.setAttribute('class', 'rotation-anchor');\n rotationAnchor.setAttribute('fill', '#121212');\n rotationAnchor.setAttribute('stroke', '#5B57D1');\n rotationAnchor.setAttribute('stroke-width', anchorStrokeWidth);\n rotationAnchor.setAttribute('vector-effect', 'non-scaling-stroke');\n rotationAnchor.setAttribute('style', 'pointer-events: all;');\n \n // Apply the same rotation as the image\n rotationAnchor.setAttribute('transform', `rotate(${imageRotation}, ${centerX}, ${centerY})`);\n \n svg.appendChild(rotationAnchor);\n registerRotationAnchor(rotationAnchor, { radius: 5, edgeY: y });\n\n // Add event listeners for rotation\n rotationAnchor.addEventListener('pointerdown', startRotation);\n rotationAnchor.addEventListener('pointerup', stopRotation);\n \n rotationAnchor.addEventListener('mouseover', function () {\n if (!isRotatingImage && !isDragging) {\n rotationAnchor.style.cursor = 'grab';\n }\n });\n \n rotationAnchor.addEventListener('mouseout', function () {\n if (!isRotatingImage && !isDragging) {\n rotationAnchor.style.cursor = 'default';\n }\n });\n}\n\nfunction removeRotationAnchor() {\n svg.querySelectorAll(\".rotation-anchor\").forEach(el => el.remove());\n}\n\nfunction addAnchor(x, y, cursor) {\n const anchorSize = 8 / (window.currentZoom || 1);\n const anchor = document.createElementNS(\"http://www.w3.org/2000/svg\", \"rect\");\n anchor.setAttribute(\"x\", x);\n anchor.setAttribute(\"y\", y);\n anchor.setAttribute(\"width\", anchorSize);\n anchor.setAttribute(\"height\", anchorSize);\n anchor.setAttribute(\"fill\", \"white\");\n anchor.setAttribute(\"stroke\", \"black\");\n anchor.setAttribute(\"stroke-width\", \"1\");\n anchor.setAttribute(\"class\", \"resize-anchor\"); // For easy removal\n anchor.style.cursor = cursor;\n\n svg.appendChild(anchor);\n\n // Add event listeners for dragging\n anchor.addEventListener('pointerdown', startResize);\n anchor.addEventListener('pointerup', stopResize);\n\n}\n\nfunction removeResizeAnchors() {\n const anchors = svg.querySelectorAll(\".resize-anchor\");\n anchors.forEach(anchor => svg.removeChild(anchor));\n}\n\nfunction startResize(event) {\n event.preventDefault();\n event.stopPropagation();\n\n currentAnchor = event.target;\n \n // Store original values at the start of resize\n originalX = parseFloat(selectedImage.getAttribute('x'));\n originalY = parseFloat(selectedImage.getAttribute('y'));\n originalWidth = parseFloat(selectedImage.getAttribute('width'));\n originalHeight = parseFloat(selectedImage.getAttribute('height'));\n \n // Store original rotation\n const transform = selectedImage.getAttribute('transform');\n if (transform) {\n const rotateMatch = transform.match(/rotate\\(([^,]+)/);\n if (rotateMatch) {\n imageRotation = parseFloat(rotateMatch[1]);\n }\n }\n \n svg.addEventListener('pointermove', resizeImage);\n document.addEventListener('pointerup', stopResize);\n}\n\nfunction stopResize(event) {\n stopInteracting(); // Call the combined stop function\n document.removeEventListener('pointerup', stopResize); // Remove the global mouseup listener\n}\n\nfunction resizeImage(event) {\n if (!selectedImage || !currentAnchor) return;\n\n const { x: globalX, y: globalY } = getSVGCoordsFromMouse(event);\n\n // Use ORIGINAL center for consistent inverse rotation (avoids drift)\n const centerX = originalX + originalWidth / 2;\n const centerY = originalY + originalHeight / 2;\n\n // Convert mouse position to local coordinates accounting for rotation\n let localX = globalX;\n let localY = globalY;\n\n if (imageRotation !== 0) {\n const rotationRad = (imageRotation * Math.PI) / 180;\n const translatedX = globalX - centerX;\n const translatedY = globalY - centerY;\n localX = translatedX * Math.cos(-rotationRad) - translatedY * Math.sin(-rotationRad) + centerX;\n localY = translatedX * Math.sin(-rotationRad) + translatedY * Math.cos(-rotationRad) + centerY;\n }\n\n // Calculate resize deltas in local coordinate space\n let dx = localX - originalX;\n let dy = localY - originalY;\n\n let newWidth = originalWidth;\n let newHeight = originalHeight;\n let newX = originalX;\n let newY = originalY;\n const aspectRatio = originalHeight / originalWidth;\n\n // Track which corner is fixed (relative to original rect)\n let fixedRelX, fixedRelY;\n\n switch (currentAnchor.style.cursor) {\n case \"nw-resize\":\n newWidth = originalWidth - dx;\n newHeight = originalHeight - dy;\n if (aspect_ratio_lock) {\n newHeight = newWidth * aspectRatio;\n dy = originalHeight - newHeight;\n }\n newX = originalX + (originalWidth - newWidth);\n newY = originalY + (originalHeight - newHeight);\n fixedRelX = originalWidth; fixedRelY = originalHeight;\n break;\n case \"ne-resize\":\n newWidth = dx;\n newHeight = originalHeight - dy;\n if (aspect_ratio_lock) {\n newHeight = newWidth * aspectRatio;\n dy = originalHeight - newHeight;\n }\n newX = originalX;\n newY = originalY + (originalHeight - newHeight);\n fixedRelX = 0; fixedRelY = originalHeight;\n break;\n case \"sw-resize\":\n newWidth = originalWidth - dx;\n newHeight = dy;\n if (aspect_ratio_lock) {\n newHeight = newWidth * aspectRatio;\n dy = newHeight;\n }\n newX = originalX + (originalWidth - newWidth);\n newY = originalY;\n fixedRelX = originalWidth; fixedRelY = 0;\n break;\n case \"se-resize\":\n newWidth = dx;\n newHeight = dy;\n if (aspect_ratio_lock) {\n newHeight = newWidth * aspectRatio;\n }\n newX = originalX;\n newY = originalY;\n fixedRelX = 0; fixedRelY = 0;\n break;\n }\n\n // Ensure minimum size\n newWidth = Math.max(minImageSize, newWidth);\n newHeight = Math.max(minImageSize, newHeight);\n\n // Compensate for rotation center shift when rotated\n if (imageRotation !== 0) {\n const rad = (imageRotation * Math.PI) / 180;\n const cosR = Math.cos(rad);\n const sinR = Math.sin(rad);\n\n // Compute rotated world position of the fixed corner in the original rect\n const oldCX = originalX + originalWidth / 2;\n const oldCY = originalY + originalHeight / 2;\n const odx = (originalX + fixedRelX) - oldCX;\n const ody = (originalY + fixedRelY) - oldCY;\n const fixedWorldX = oldCX + odx * cosR - ody * sinR;\n const fixedWorldY = oldCY + odx * sinR + ody * cosR;\n\n // Determine where the fixed corner sits in the new rect (relative to new origin)\n const fixedNewRelX = fixedRelX === 0 ? 0 : newWidth;\n const fixedNewRelY = fixedRelY === 0 ? 0 : newHeight;\n\n // Solve for new origin so the fixed corner stays in place\n const ncx = newWidth / 2;\n const ncy = newHeight / 2;\n const ndx = fixedNewRelX - ncx;\n const ndy = fixedNewRelY - ncy;\n const rotX = ncx + ndx * cosR - ndy * sinR;\n const rotY = ncy + ndx * sinR + ndy * cosR;\n\n newX = fixedWorldX - rotX;\n newY = fixedWorldY - rotY;\n }\n\n // Apply the new dimensions and position\n selectedImage.setAttribute('width', newWidth);\n selectedImage.setAttribute('height', newHeight);\n selectedImage.setAttribute('x', newX);\n selectedImage.setAttribute('y', newY);\n\n // Update data attributes for arrow attachment\n selectedImage.setAttribute('data-shape-x', newX);\n selectedImage.setAttribute('data-shape-y', newY);\n selectedImage.setAttribute('data-shape-width', newWidth);\n selectedImage.setAttribute('data-shape-height', newHeight);\n\n // Reapply the rotation transform with the new center\n const newCenterX = newX + newWidth / 2;\n const newCenterY = newY + newHeight / 2;\n selectedImage.setAttribute('transform', `rotate(${imageRotation}, ${newCenterX}, ${newCenterY})`);\n\n // Update attached arrows during resize\n updateArrowsForShape(selectedImage);\n\n // Update the selection outline and anchors\n removeSelectionOutline();\n addSelectionOutline();\n}\n\nfunction stopRotation(event) {\n if (!isRotatingImage) return;\n stopInteracting();\n isRotatingImage = false;\n startRotationMouseAngle = null;\n startImageRotation = null;\n svg.removeEventListener('pointermove', rotateImage);\n document.removeEventListener('pointerup', stopRotation);\n svg.style.cursor = 'default';\n}\n\nfunction startDrag(event) {\n if (!isSelectionToolActive || !selectedImage) return;\n\n event.preventDefault();\n event.stopPropagation();\n\n isDragging = true;\n \n // Store original values at the start of drag\n originalX = parseFloat(selectedImage.getAttribute('x'));\n originalY = parseFloat(selectedImage.getAttribute('y'));\n originalWidth = parseFloat(selectedImage.getAttribute('width'));\n originalHeight = parseFloat(selectedImage.getAttribute('height'));\n \n // Store original rotation\n const transform = selectedImage.getAttribute('transform');\n if (transform) {\n const rotateMatch = transform.match(/rotate\\(([^,]+)/);\n if (rotateMatch) {\n imageRotation = parseFloat(rotateMatch[1]);\n }\n }\n\n // Find the ImageShape wrapper for frame functionality\n let imageShape = null;\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n imageShape = shapes.find(shape => shape.shapeName === 'image' && shape.element === selectedImage);\n }\n\n if (imageShape) {\n // Store initial frame state\n draggedShapeInitialFrameImage = imageShape.parentFrame || null;\n \n // Temporarily remove from frame clipping if dragging\n if (imageShape.parentFrame) {\n imageShape.parentFrame.temporarilyRemoveFromFrame(imageShape);\n }\n }\n\n const { x, y } = getSVGCoordsFromMouse(event);\n dragOffsetX = x - parseFloat(selectedImage.getAttribute('x'));\n dragOffsetY = y - parseFloat(selectedImage.getAttribute('y'));\n\n svg.addEventListener('pointermove', dragImage);\n document.addEventListener('pointerup', stopDrag);\n}\n\nfunction dragImage(event) {\n if (!isDragging || !selectedImage) return;\n\n const { x, y } = getSVGCoordsFromMouse(event);\n let newX = x - dragOffsetX;\n let newY = y - dragOffsetY;\n\n selectedImage.setAttribute('x', newX);\n selectedImage.setAttribute('y', newY);\n\n // Update data attributes for arrow attachment\n selectedImage.setAttribute('data-shape-x', newX);\n selectedImage.setAttribute('data-shape-y', newY);\n\n // Reapply the rotation transform with the new position\n const newCenterX = newX + parseFloat(selectedImage.getAttribute('width')) / 2;\n const newCenterY = newY + parseFloat(selectedImage.getAttribute('height')) / 2;\n selectedImage.setAttribute('transform', `rotate(${imageRotation}, ${newCenterX}, ${newCenterY})`);\n\n // Update frame containment for ImageShape wrapper\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n const imageShape = shapes.find(shape => shape.shapeName === 'image' && shape.element === selectedImage);\n if (imageShape) {\n imageShape.updateFrameContainment();\n }\n }\n\n // Update attached arrows during drag\n updateArrowsForShape(selectedImage);\n\n // Update the selection outline and anchors\n removeSelectionOutline();\n addSelectionOutline();\n}\n\nfunction stopDrag(event) {\n stopInteracting(); // Call the combined stop function\n document.removeEventListener('pointerup', stopDrag); // Remove the global mouseup listener\n}\n\nfunction startRotation(event) {\n event.preventDefault();\n event.stopPropagation();\n\n if (!selectedImage) return;\n\n isRotatingImage = true;\n \n // Get image center\n const imgX = parseFloat(selectedImage.getAttribute('x'));\n const imgY = parseFloat(selectedImage.getAttribute('y'));\n const imgWidth = parseFloat(selectedImage.getAttribute('width'));\n const imgHeight = parseFloat(selectedImage.getAttribute('height'));\n \n const centerX = imgX + imgWidth / 2;\n const centerY = imgY + imgHeight / 2;\n\n // Calculate initial mouse angle relative to image center\n const { x: mouseX, y: mouseY } = getSVGCoordsFromMouse(event);\n \n startRotationMouseAngle = Math.atan2(mouseY - centerY, mouseX - centerX) * 180 / Math.PI;\n startImageRotation = imageRotation;\n\n svg.addEventListener('pointermove', rotateImage);\n document.addEventListener('pointerup', stopRotation);\n \n svg.style.cursor = 'grabbing';\n}\n\nfunction rotateImage(event) {\n if (!isRotatingImage || !selectedImage) return;\n\n // Get image center\n const imgX = parseFloat(selectedImage.getAttribute('x'));\n const imgY = parseFloat(selectedImage.getAttribute('y'));\n const imgWidth = parseFloat(selectedImage.getAttribute('width'));\n const imgHeight = parseFloat(selectedImage.getAttribute('height'));\n \n const centerX = imgX + imgWidth / 2;\n const centerY = imgY + imgHeight / 2;\n\n // Calculate current mouse angle\n const { x: mouseX, y: mouseY } = getSVGCoordsFromMouse(event);\n \n const currentMouseAngle = Math.atan2(mouseY - centerY, mouseX - centerX) * 180 / Math.PI;\n const angleDiff = currentMouseAngle - startRotationMouseAngle;\n \n imageRotation = startImageRotation + angleDiff;\n imageRotation = imageRotation % 360;\n if (imageRotation < 0) imageRotation += 360;\n\n // Apply rotation transform\n selectedImage.setAttribute('transform', `rotate(${imageRotation}, ${centerX}, ${centerY})`);\n \n // Update data attribute for arrow attachment\n selectedImage.setAttribute('data-shape-rotation', imageRotation);\n\n // Update attached arrows during rotation\n updateArrowsForShape(selectedImage);\n\n // Update the selection outline and anchors\n removeSelectionOutline();\n addSelectionOutline();\n}\n\nfunction stopInteracting() {\n // Store transform data before stopping interaction\n if (selectedImage && (isDragging || isRotatingImage || currentAnchor)) {\n const newPos = {\n x: parseFloat(selectedImage.getAttribute('x')),\n y: parseFloat(selectedImage.getAttribute('y')),\n width: parseFloat(selectedImage.getAttribute('width')),\n height: parseFloat(selectedImage.getAttribute('height')),\n rotation: imageRotation\n };\n \n // Get the original rotation from the stored start rotation or current rotation\n let originalRotation = imageRotation;\n if (isRotatingImage && startImageRotation !== null) {\n originalRotation = startImageRotation;\n }\n \n const oldPos = {\n x: originalX,\n y: originalY,\n width: originalWidth,\n height: originalHeight,\n rotation: originalRotation\n };\n\n // Find the ImageShape wrapper for frame tracking\n let imageShape = null;\n if (typeof shapes !== 'undefined' && Array.isArray(shapes)) {\n imageShape = shapes.find(shape => shape.shapeName === 'image' && shape.element === selectedImage);\n }\n\n // Add frame information for undo tracking\n const oldPosWithFrame = {\n ...oldPos,\n parentFrame: draggedShapeInitialFrameImage\n };\n // Issue #34 bug #2: for drag, hoveredFrameImage tracks the actual\n // destination \u2014 imageShape.parentFrame is still the OLD frame here.\n // Resize / rotate don't move between frames, so fall back to the\n // shape's own parent for those.\n const newPosWithFrame = {\n ...newPos,\n parentFrame: isDragging\n ? (hoveredFrameImage || null)\n : (imageShape ? imageShape.parentFrame : null),\n };\n\n // Only push transform action if something actually changed\n const stateChanged = newPos.x !== oldPos.x || newPos.y !== oldPos.y || \n newPos.width !== oldPos.width || newPos.height !== oldPos.height ||\n newPos.rotation !== oldPos.rotation;\n const frameChanged = oldPosWithFrame.parentFrame !== newPosWithFrame.parentFrame;\n\n if (stateChanged || frameChanged) {\n pushTransformAction({\n type: 'image',\n element: selectedImage,\n restore: (pos) => {\n selectedImage.setAttribute('x', pos.x);\n selectedImage.setAttribute('y', pos.y);\n selectedImage.setAttribute('width', pos.width);\n selectedImage.setAttribute('height', pos.height);\n const centerX = pos.x + pos.width / 2;\n const centerY = pos.y + pos.height / 2;\n selectedImage.setAttribute('transform', `rotate(${pos.rotation}, ${centerX}, ${centerY})`);\n imageRotation = pos.rotation;\n \n // Update selection outline if image is selected\n if (selectedImage) {\n removeSelectionOutline();\n addSelectionOutline();\n }\n \n // Update data attributes for arrow attachment consistency\n selectedImage.setAttribute('data-shape-x', pos.x);\n selectedImage.setAttribute('data-shape-y', pos.y);\n selectedImage.setAttribute('data-shape-width', pos.width);\n selectedImage.setAttribute('data-shape-height', pos.height);\n selectedImage.setAttribute('data-shape-rotation', pos.rotation);\n \n // Update attached arrows\n updateArrowsForShape(selectedImage);\n }\n }, oldPosWithFrame, newPosWithFrame);\n }\n\n // Handle frame containment changes after drag\n if (isDragging && imageShape) {\n const finalFrame = hoveredFrameImage;\n \n // If shape moved to a different frame\n if (draggedShapeInitialFrameImage !== finalFrame) {\n // Remove from initial frame\n if (draggedShapeInitialFrameImage) {\n draggedShapeInitialFrameImage.removeShapeFromFrame(imageShape);\n }\n \n // Add to new frame\n if (finalFrame) {\n finalFrame.addShapeToFrame(imageShape);\n }\n \n // Track the frame change for undo\n if (frameChanged) {\n pushFrameAttachmentAction(finalFrame || draggedShapeInitialFrameImage, imageShape, \n finalFrame ? 'attach' : 'detach', draggedShapeInitialFrameImage);\n }\n } else if (draggedShapeInitialFrameImage) {\n // Shape stayed in same frame, restore clipping\n draggedShapeInitialFrameImage.restoreToFrame(imageShape);\n }\n }\n \n draggedShapeInitialFrameImage = null;\n }\n\n // Clear frame highlighting\n if (hoveredFrameImage) {\n hoveredFrameImage.removeHighlight();\n hoveredFrameImage = null;\n }\n\n isDragging = false;\n isRotatingImage = false;\n svg.removeEventListener('pointermove', dragImage);\n svg.removeEventListener('pointermove', resizeImage);\n svg.removeEventListener('pointermove', rotateImage);\n currentAnchor = null;\n startRotationMouseAngle = null;\n startImageRotation = null;\n\n // Update originalX, originalY, originalWidth and originalHeight after dragging/resizing is complete\n if (selectedImage) {\n originalX = parseFloat(selectedImage.getAttribute('x'));\n originalY = parseFloat(selectedImage.getAttribute('y'));\n originalWidth = parseFloat(selectedImage.getAttribute('width'));\n originalHeight = parseFloat(selectedImage.getAttribute('height'));\n \n // Update the current rotation from the image transform\n const transform = selectedImage.getAttribute('transform');\n if (transform) {\n const rotateMatch = transform.match(/rotate\\(([^,]+)/);\n if (rotateMatch) {\n imageRotation = parseFloat(rotateMatch[1]);\n }\n }\n \n // Update data attributes for arrow attachment consistency\n selectedImage.setAttribute('data-shape-x', originalX);\n selectedImage.setAttribute('data-shape-y', originalY);\n selectedImage.setAttribute('data-shape-width', originalWidth);\n selectedImage.setAttribute('data-shape-height', originalHeight);\n selectedImage.setAttribute('data-shape-rotation', imageRotation);\n \n // Update attached arrows after interaction ends\n updateArrowsForShape(selectedImage);\n }\n}\n\n// Add delete functionality for images\nfunction deleteCurrentImage() {\n if (selectedImage) {\n // Find the ImageShape wrapper\n let imageShape = (typeof shapes !== 'undefined' && Array.isArray(shapes))\n ? shapes.find(s => s.shapeName === 'image' && s.element === selectedImage)\n : null;\n\n // Abort any in-progress upload\n if (imageShape?.uploadAbortController) {\n imageShape.uploadAbortController.abort();\n imageShape.removeUploadIndicator();\n }\n\n // Release image bytes from room limit\n const freedBytes = selectedImage.__fileSize || 0;\n window.__roomImageBytesUsed = Math.max(0, (window.__roomImageBytesUsed || 0) - freedBytes);\n\n // If image is hosted on Cloudinary, delete it from storage\n const imgHref = selectedImage.getAttribute('href') || selectedImage.getAttributeNS('http://www.w3.org/1999/xlink', 'href') || '';\n if (imgHref.includes('cloudinary.com') || imgHref.includes('res.cloudinary')) {\n const match = imgHref.match(/\\/upload\\/(?:v\\d+\\/)?(lixsketch\\/.+?)(?:\\.\\w+)?$/);\n if (match) {\n const publicId = match[1];\n const isPersonal = selectedImage.getAttribute('data-storage-provider') === 'user_cloudinary';\n const workerUrl = window.__WORKER_URL;\n const deleteUrl = isPersonal ? '/api/images/personal-delete' : (workerUrl ? `${workerUrl}/api/images/delete` : null);\n if (deleteUrl) {\n fetch(deleteUrl, {\n method: 'DELETE',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({ publicId }),\n }).catch(err => console.warn('[ImageTool] Cloudinary cleanup failed:', err));\n }\n }\n }\n\n if (imageShape) {\n const idx = shapes.indexOf(imageShape);\n if (idx !== -1) shapes.splice(idx, 1);\n\n // Remove the group (which contains the image)\n if (imageShape.group && imageShape.group.parentNode) {\n imageShape.group.parentNode.removeChild(imageShape.group);\n }\n }\n \n // Fallback: if no ImageShape wrapper found, remove the image directly\n if (!imageShape && selectedImage.parentNode) {\n selectedImage.parentNode.removeChild(selectedImage);\n }\n \n // Clean up any arrow attachments before deleting\n if (typeof cleanupAttachments === 'function') {\n cleanupAttachments(selectedImage);\n }\n \n // Push delete action for undo\n if (imageShape) {\n pushDeleteAction(imageShape);\n }\n \n // Clean up selection\n removeSelectionOutline();\n selectedImage = null;\n }\n}\n\ndocument.addEventListener('keydown', (e) => {\n if (e.key === 'Delete' && selectedImage) {\n deleteCurrentImage();\n }\n});\n\n// Expose upload pipeline globally so generated/pasted images can use it\nwindow.uploadImageToCloudinary = uploadImageToCloudinary;\n\n// Programmatic selection bridge used by generated vector-image shapes.\n// Keeping the selection state in this module prevents a second, divergent\n// implementation of image dragging and screen-space resize controls.\nwindow.__selectImageElement = function(element, { force = false } = {}) {\n if (!element) return;\n selectImage({ target: element, stopPropagation: () => {} }, force);\n};\n\n// Window bridge: allow React UI to trigger the file picker\nwindow.openImageFilePicker = function() {\n isImageToolActive = true;\n const fileInput = document.createElement('input');\n fileInput.type = 'file';\n fileInput.accept = IMAGE_ACCEPT_ATTR;\n fileInput.style.display = 'none';\n document.body.appendChild(fileInput);\n\n let fileSelected = false;\n\n fileInput.addEventListener('change', (event) => {\n const file = event.target.files[0];\n if (file) {\n fileSelected = true;\n handleImageUpload(file);\n }\n document.body.removeChild(fileInput);\n });\n\n // Detect cancel: when focus returns to window without a file being selected\n const onFocus = () => {\n window.removeEventListener('focus', onFocus);\n // Delay to let 'change' fire first if a file was selected\n setTimeout(() => {\n if (!fileSelected) {\n // User cancelled \u2014 switch back to select tool\n isImageToolActive = false;\n if (window.__sketchEngine?.setActiveTool) {\n window.__sketchEngine.setActiveTool('select');\n }\n if (fileInput.parentNode) {\n document.body.removeChild(fileInput);\n }\n }\n }, 300);\n };\n window.addEventListener('focus', onFocus);\n\n fileInput.click();\n};\n\nexport { handleMouseDownImage, handleMouseMoveImage, handleMouseUpImage };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -3,14 +3,14 @@ import {
|
|
|
3
3
|
calculateSnap,
|
|
4
4
|
clearSnapGuides,
|
|
5
5
|
updateAttachedArrows
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-YF3TK7SC.js";
|
|
7
7
|
import {
|
|
8
8
|
pushCreateAction,
|
|
9
9
|
pushDeleteAction,
|
|
10
10
|
pushFrameAttachmentAction,
|
|
11
11
|
pushOptionsChangeAction,
|
|
12
12
|
pushTransformAction
|
|
13
|
-
} from "./chunk-
|
|
13
|
+
} from "./chunk-U3TB4KRS.js";
|
|
14
14
|
|
|
15
15
|
// src/tools/freehandTool.js
|
|
16
16
|
function getThemeStroke() {
|
|
@@ -561,4 +561,4 @@ export {
|
|
|
561
561
|
handleMouseMove,
|
|
562
562
|
handleMouseUp
|
|
563
563
|
};
|
|
564
|
-
//# sourceMappingURL=chunk-
|
|
564
|
+
//# sourceMappingURL=chunk-GPIYXREE.js.map
|
|
@@ -5,7 +5,7 @@ import {
|
|
|
5
5
|
import {
|
|
6
6
|
cleanupAttachments,
|
|
7
7
|
updateAttachedArrows
|
|
8
|
-
} from "./chunk-
|
|
8
|
+
} from "./chunk-YF3TK7SC.js";
|
|
9
9
|
import {
|
|
10
10
|
pushCreateAction,
|
|
11
11
|
pushDeleteActionWithAttachments,
|
|
@@ -14,7 +14,7 @@ import {
|
|
|
14
14
|
pushTransformAction,
|
|
15
15
|
setTextReferences,
|
|
16
16
|
updateSelectedElement
|
|
17
|
-
} from "./chunk-
|
|
17
|
+
} from "./chunk-U3TB4KRS.js";
|
|
18
18
|
|
|
19
19
|
// src/tools/codeTool.js
|
|
20
20
|
function getThemeStroke() {
|
|
@@ -1601,4 +1601,4 @@ export {
|
|
|
1601
1601
|
getCodeLanguage,
|
|
1602
1602
|
getSelectedCodeBlock
|
|
1603
1603
|
};
|
|
1604
|
-
//# sourceMappingURL=chunk-
|
|
1604
|
+
//# sourceMappingURL=chunk-HFQZYCHJ.js.map
|
|
@@ -2,14 +2,14 @@
|
|
|
2
2
|
import {
|
|
3
3
|
calculateSnap,
|
|
4
4
|
clearSnapGuides
|
|
5
|
-
} from "./chunk-
|
|
5
|
+
} from "./chunk-YF3TK7SC.js";
|
|
6
6
|
import {
|
|
7
7
|
pushCreateAction,
|
|
8
8
|
pushDeleteAction,
|
|
9
9
|
pushFrameAttachmentAction,
|
|
10
10
|
pushOptionsChangeAction,
|
|
11
11
|
pushTransformAction
|
|
12
|
-
} from "./chunk-
|
|
12
|
+
} from "./chunk-U3TB4KRS.js";
|
|
13
13
|
|
|
14
14
|
// src/tools/lineTool.js
|
|
15
15
|
function getThemeStroke() {
|
|
@@ -450,4 +450,4 @@ export {
|
|
|
450
450
|
handleMouseMove,
|
|
451
451
|
handleMouseUp
|
|
452
452
|
};
|
|
453
|
-
//# sourceMappingURL=chunk-
|
|
453
|
+
//# sourceMappingURL=chunk-ILGAFR56.js.map
|
|
@@ -395,11 +395,14 @@ var Frame = class {
|
|
|
395
395
|
labelText.textContent = this.frameName || "Frame";
|
|
396
396
|
labelText.style.cursor = "pointer";
|
|
397
397
|
labelText.style.userSelect = "none";
|
|
398
|
+
labelText.style.pointerEvents = "all";
|
|
398
399
|
if (this.rotation !== 0) {
|
|
399
400
|
const centerX = this.x + this.width / 2;
|
|
400
401
|
const centerY = this.y + this.height / 2;
|
|
401
402
|
labelText.setAttribute("transform", `rotate(${this.rotation}, ${centerX}, ${centerY})`);
|
|
402
403
|
}
|
|
404
|
+
labelText.addEventListener("pointerdown", (e) => e.stopPropagation());
|
|
405
|
+
labelText.addEventListener("click", (e) => e.stopPropagation());
|
|
403
406
|
labelText.addEventListener("dblclick", (e) => {
|
|
404
407
|
e.stopPropagation();
|
|
405
408
|
this.startLabelEdit(labelText);
|
|
@@ -408,6 +411,10 @@ var Frame = class {
|
|
|
408
411
|
this.labelElement = labelText;
|
|
409
412
|
}
|
|
410
413
|
startLabelEdit(labelElement) {
|
|
414
|
+
if (this._labelEditor) {
|
|
415
|
+
this._labelEditor.querySelector("input")?.focus();
|
|
416
|
+
return;
|
|
417
|
+
}
|
|
411
418
|
const foreignObject = document.createElementNS("http://www.w3.org/2000/svg", "foreignObject");
|
|
412
419
|
foreignObject.setAttribute("x", this.x + 5);
|
|
413
420
|
foreignObject.setAttribute("y", this.y - 20);
|
|
@@ -439,12 +446,16 @@ var Frame = class {
|
|
|
439
446
|
`;
|
|
440
447
|
foreignObject.appendChild(input);
|
|
441
448
|
this.group.appendChild(foreignObject);
|
|
449
|
+
this._labelEditor = foreignObject;
|
|
442
450
|
labelElement.style.display = "none";
|
|
443
451
|
setTimeout(() => {
|
|
444
452
|
input.focus();
|
|
445
453
|
input.select();
|
|
446
454
|
}, 10);
|
|
455
|
+
let finished = false;
|
|
447
456
|
const finishEdit = () => {
|
|
457
|
+
if (finished) return;
|
|
458
|
+
finished = true;
|
|
448
459
|
const newName = input.value.trim() || "Frame";
|
|
449
460
|
if (newName !== oldName) {
|
|
450
461
|
pushTransformAction(
|
|
@@ -468,7 +479,8 @@ var Frame = class {
|
|
|
468
479
|
);
|
|
469
480
|
}
|
|
470
481
|
this.frameName = newName;
|
|
471
|
-
|
|
482
|
+
foreignObject.remove();
|
|
483
|
+
this._labelEditor = null;
|
|
472
484
|
labelElement.style.display = "block";
|
|
473
485
|
labelElement.textContent = this.frameName;
|
|
474
486
|
this.labelElement = labelElement;
|
|
@@ -480,7 +492,9 @@ var Frame = class {
|
|
|
480
492
|
finishEdit();
|
|
481
493
|
} else if (e.key === "Escape") {
|
|
482
494
|
e.preventDefault();
|
|
483
|
-
|
|
495
|
+
finished = true;
|
|
496
|
+
foreignObject.remove();
|
|
497
|
+
this._labelEditor = null;
|
|
484
498
|
labelElement.style.display = "block";
|
|
485
499
|
}
|
|
486
500
|
});
|
|
@@ -1237,4 +1251,4 @@ var Frame = class {
|
|
|
1237
1251
|
export {
|
|
1238
1252
|
Frame
|
|
1239
1253
|
};
|
|
1240
|
-
//# sourceMappingURL=chunk-
|
|
1254
|
+
//# sourceMappingURL=chunk-KVAQPCUH.js.map
|