@sequent-org/moodboard 1.2.118 → 1.2.119

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sequent-org/moodboard",
-  "version": "1.2.118",
+  "version": "1.2.119",
   "type": "module",
   "description": "Interactive moodboard",
   "main": "./src/index.js",

package/src/core/events/Events.js

@@ -28,6 +28,7 @@ export const Events = {
 		GroupResizeStart: 'tool:group:resize:start',
 		GroupResizeUpdate: 'tool:group:resize:update',
 		GroupResizeEnd: 'tool:group:resize:end',
+		RotateStart: 'tool:rotate:start',
 		RotateUpdate: 'tool:rotate:update',
 		RotateEnd: 'tool:rotate:end',
 		GroupRotateStart: 'tool:group:rotate:start',

package/src/core/index.js

@@ -1042,8 +1042,8 @@ export class CoreMoodBoard {
                 if (!obj || !pixiObj) continue;
                 this._groupResizeSnapshot.set(id, {
                     size: { width: obj.width, height: obj.height },
-                    // Позицию берем из PIXI (центр с учетом pivot), чтобы избежать смещения при первом ресайзе
-                    position: { x: pixiObj.x, y: pixiObj.y },
+                    // В snapshot фиксируем top-left как в state, чтобы не смешивать системы координат.
+                    position: { x: obj.position.x, y: obj.position.y },
                     type: obj.type || null
                 });
             }
@@ -1343,7 +1343,6 @@ export class CoreMoodBoard {
                         if (!newPos) newPos = calcNew;
                     }
                     const command = new ResizeObjectCommand(
-                        this, 
                         this, 
                         data.object, 
                         data.oldSize, 
@@ -1402,7 +1401,8 @@ export class CoreMoodBoard {
 
         this.eventBus.on(Events.Tool.GroupRotateUpdate, (data) => {
             // Поворачиваем каждый объект вокруг общего центра с сохранением относительного смещения
-            const center = this._groupRotateCenter || { x: 0, y: 0 };
+            const center = this._groupRotateCenter;
+            if (!center) return;
             const rad = (data.angle || 0) * Math.PI / 180;
             const cos = Math.cos(rad);
             const sin = Math.sin(rad);
@@ -1431,14 +1431,22 @@ export class CoreMoodBoard {
 
         this.eventBus.on(Events.Tool.GroupRotateEnd, (data) => {
             // Оформляем как батч-команду GroupRotateCommand
-            const center = this._groupRotateCenter || { x: 0, y: 0 };
+            const center = this._groupRotateCenter;
+            if (!center) return;
             const changes = [];
             for (const id of data.objects) {
                 const start = this._groupRotateStart?.get(id);
                 const pixiObject = this.pixi.objects.get(id);
                 if (!start || !pixiObject) continue;
                 const toAngle = pixiObject.rotation * 180 / Math.PI;
-                const toPos = { x: pixiObject.x, y: pixiObject.y };
+                const objState = this.state.state.objects.find(o => o.id === id);
+                const toPos = objState?.position
+                    ? { x: objState.position.x, y: objState.position.y }
+                    : (() => {
+                        const halfW = (pixiObject.width || 0) / 2;
+                        const halfH = (pixiObject.height || 0) / 2;
+                        return { x: pixiObject.x - halfW, y: pixiObject.y - halfH };
+                    })();
                 if (Math.abs(start.angle - toAngle) > 0.1 || Math.abs(start.position.x - toPos.x) > 0.1 || Math.abs(start.position.y - toPos.y) > 0.1) {
                     changes.push({ id, fromAngle: start.angle, toAngle, fromPos: start.position, toPos });
                 }

package/src/ui/HtmlHandlesLayer.js

@@ -691,7 +691,7 @@ export class HtmlHandlesLayer {
                             el.style.width = `${Math.max(1, Math.round(endCSS.width))}px`;
                             el.style.height = 'auto';
                             const measured = Math.max(1, Math.round(el.scrollHeight));
-                            const worldH2 = (measured * res) / s;
+                            const worldH2 = (measured * rendererRes) / s;
                             const fixData = {
                                 object: id,
                                 size: { width: worldW, height: worldH2 },
@@ -981,7 +981,30 @@ export class HtmlHandlesLayer {
             const req = { selection: [] };
             this.eventBus.emit(Events.Tool.GetSelection, req);
             const objects = req.selection || [];
-            this.eventBus.emit(Events.Tool.GroupRotateStart, { objects });
+            // Центр поворота должен передаваться в world-координатах.
+            // При отсутствии core/pixi (например, в изолированных тестах) используем CSS-центр как fallback.
+            let centerWorldX = centerX;
+            let centerWorldY = centerY;
+            try {
+                const world = this.core?.pixi?.worldLayer || this.core?.pixi?.app?.stage;
+                const s = world?.scale?.x || 1;
+                const tx = world?.x || 0;
+                const ty = world?.y || 0;
+                const rendererRes = (this.core?.pixi?.app?.renderer?.resolution) || 1;
+                const containerRect = this.container?.getBoundingClientRect ? this.container.getBoundingClientRect() : { left: 0, top: 0 };
+                const view = this.core?.pixi?.app?.view || null;
+                const viewRect = view && view.getBoundingClientRect ? view.getBoundingClientRect() : { left: 0, top: 0 };
+                const offsetLeft = viewRect.left - containerRect.left;
+                const offsetTop = viewRect.top - containerRect.top;
+                const screenX = centerX - offsetLeft;
+                const screenY = centerY - offsetTop;
+                centerWorldX = ((screenX * rendererRes) - tx) / s;
+                centerWorldY = ((screenY * rendererRes) - ty) / s;
+            } catch (_) {}
+            this.eventBus.emit(Events.Tool.GroupRotateStart, {
+                objects,
+                center: { x: centerWorldX, y: centerWorldY },
+            });
         }
         
         const onRotateMove = (ev) => {