@sequent-org/moodboard 1.2.30 → 1.2.33

package/package.json

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

package/src/core/ApiClient.js

@@ -45,22 +45,6 @@ export class ApiClient {
             // Фильтруем объекты изображений и файлов - убираем избыточные данные
             const cleanedData = this._cleanObjectData(boardData);
 
-            // Диагностика размеров изображений перед отправкой
-            try {
-                const images = Array.isArray(cleanedData?.objects)
-                    ? cleanedData.objects.filter(o => o && o.type === 'image')
-                    : [];
-                images.forEach((o) => {
-                    console.log('🧪 SAVE image size', {
-                        id: o.id,
-                        width: o.width,
-                        height: o.height,
-                        propWidth: o.properties?.width,
-                        propHeight: o.properties?.height
-                    });
-                });
-            } catch (_) {}
-
             const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');
 
             const response = await fetch('/api/moodboard/save', {

package/src/core/SaveManager.js

@@ -157,41 +157,6 @@ export class SaveManager {
                     data: saveData,
                     timestamp: new Date().toISOString()
                 });
-
-                // Диагностика: по флагу проверяем, что сервер отдает те же размеры на чтение
-                try {
-                    if (typeof window !== 'undefined' && window.MOODBOARD_DEBUG_VERIFY_LOAD === true) {
-                        const boardId = saveData?.id;
-                        if (boardId) {
-                            const verifyUrl = `${this.options.loadEndpoint}/${boardId}`;
-                            const resp = await fetch(verifyUrl, {
-                                method: 'GET',
-                                headers: {
-                                    'Accept': 'application/json',
-                                    'X-Requested-With': 'XMLHttpRequest'
-                                }
-                            });
-                            if (resp.ok) {
-                                const result = await resp.json();
-                                const data = result?.data || result;
-                                const imgs = Array.isArray(data?.objects) ? data.objects.filter(o => o && o.type === 'image') : [];
-                                imgs.forEach((o) => {
-                                    console.log('🧪 VERIFY LOAD after save image size', {
-                                        id: o.id,
-                                        width: o.width,
-                                        height: o.height,
-                                        propWidth: o.properties?.width,
-                                        propHeight: o.properties?.height
-                                    });
-                                });
-                            } else {
-                                console.warn('⚠️ VERIFY LOAD failed:', resp.status, resp.statusText);
-                            }
-                        }
-                    }
-                } catch (e) {
-                    console.warn('⚠️ VERIFY LOAD exception:', e?.message || e);
-                }
             } else {
                 throw new Error(response.message || 'Ошибка сохранения');
             }

package/src/core/index.js

@@ -1067,80 +1067,84 @@ export class CoreMoodBoard {
             const object = objects.find(obj => obj.id === data.object);
             const objectType = object ? object.type : null;
 
-            // Сохраняем пропорции для фреймов, кроме произвольных (lockedAspect=false)
-            if ((objectType === 'frame' || (objectType === 'image' && object?.properties?.isEmojiIcon)) && data.size) {
-                const lockedAspect = !!(object?.properties && (object.properties.lockedAspect === true));
+            // Сохраняем пропорции:
+            // - всегда для изображений (включая эмоджи-иконки, которые квадратные)
+            // - для фреймов только если lockedAspect=true
+            if (data.size && (objectType === 'image' || objectType === 'frame')) {
                 const isEmoji = (objectType === 'image' && object?.properties?.isEmojiIcon);
-                if (!lockedAspect && !isEmoji) {
-                    // произвольные фреймы — без ограничений
-                } else {
-                const start = this._activeResize?.startSize || { width: object.width, height: object.height };
-                const aspect = isEmoji ? 1 : ((start.width > 0 && start.height > 0) ? (start.width / start.height) : (object.width / Math.max(1, object.height)));
-                let w = Math.max(1, data.size.width);
-                let h = Math.max(1, data.size.height);
-                const hndl = (this._activeResize?.handle || '').toLowerCase();
-                if (isEmoji) {
-                    // Делаем квадрат, фиксируя противоположную сторону к старту
-                    const s = Math.max(w, h);
-                    // Вычислим позицию сразу, чтобы не было дрейфа правой/нижней границы
+                const isImage = (objectType === 'image');
+                const lockedAspect = objectType === 'frame'
+                    ? !!(object?.properties && object.properties.lockedAspect === true)
+                    : true; // для изображений всегда держим аспект
+
+                if (lockedAspect || isImage || isEmoji) {
+                    const start = this._activeResize?.startSize || { width: object.width, height: object.height };
+                    const startW = Math.max(1, start.width);
+                    const startH = Math.max(1, start.height);
+                    const aspect = isEmoji ? 1 : (startW / startH);
+
+                    let w = Math.max(1, data.size.width);
+                    let h = Math.max(1, data.size.height);
+                    const hndl = (this._activeResize?.handle || '').toLowerCase();
+
+                    if (isEmoji) {
+                        // Квадрат
+                        const s = Math.max(w, h);
+                        if (!data.position && this._activeResize && this._activeResize.objectId === data.object) {
+                            const startPos = this._activeResize.startPosition;
+                            const sw = this._activeResize.startSize.width;
+                            const sh = this._activeResize.startSize.height;
+                            let x = startPos.x;
+                            let y = startPos.y;
+                            if (hndl.includes('w')) { x = startPos.x + (sw - s); }
+                            if (hndl.includes('n')) { y = startPos.y + (sh - s); }
+                            const isEdge = ['n','s','e','w'].includes(hndl);
+                            if (isEdge) {
+                                if (hndl === 'n' || hndl === 's') x = startPos.x + Math.round((sw - s) / 2);
+                                if (hndl === 'e' || hndl === 'w') y = startPos.y + Math.round((sh - s) / 2);
+                            }
+                            data.position = { x: Math.round(x), y: Math.round(y) };
+                        }
+                        w = s; h = s;
+                    } else {
+                        // Поддержка аспекта (для images всегда; для frames — если lockedAspect)
+                        const dw = Math.abs(w - startW);
+                        const dh = Math.abs(h - startH);
+                        if (dw >= dh) { h = Math.round(w / aspect); } else { w = Math.round(h * aspect); }
+                    }
+
+                    // Минимальная площадь — только для фреймов (как раньше)
+                    if (objectType === 'frame') {
+                        const minArea = 1800;
+                        const area = Math.max(1, w * h);
+                        if (area < minArea) {
+                            const scale = Math.sqrt(minArea / area);
+                            w = Math.round(w * scale);
+                            h = Math.round(h * scale);
+                        }
+                    }
+
+                    data.size = { width: w, height: h };
+
+                    // Компенсация позиции по зафиксированной стороне
                     if (!data.position && this._activeResize && this._activeResize.objectId === data.object) {
                         const startPos = this._activeResize.startPosition;
                         const sw = this._activeResize.startSize.width;
                         const sh = this._activeResize.startSize.height;
                         let x = startPos.x;
                         let y = startPos.y;
-                        if (hndl.includes('w')) { x = startPos.x + (sw - s); }
-                        if (hndl.includes('n')) { y = startPos.y + (sh - s); }
+                        if (hndl.includes('w')) { x = startPos.x + (sw - data.size.width); }
+                        if (hndl.includes('n')) { y = startPos.y + (sh - data.size.height); }
                         const isEdge = ['n','s','e','w'].includes(hndl);
                         if (isEdge) {
-                            if (hndl === 'n' || hndl === 's') x = startPos.x + Math.round((sw - s) / 2);
-                            if (hndl === 'e' || hndl === 'w') y = startPos.y + Math.round((sh - s) / 2);
+                            if (hndl === 'n' || hndl === 's') {
+                                x = startPos.x + Math.round((sw - data.size.width) / 2);
+                            } else if (hndl === 'e' || hndl === 'w') {
+                                y = startPos.y + Math.round((sh - data.size.height) / 2);
+                            }
                         }
                         data.position = { x: Math.round(x), y: Math.round(y) };
                     }
-                    w = s; h = s;
-                } else {
-                    // Обычная поддержка аспекта для фреймов
-                    const dw = Math.abs(w - start.width);
-                    const dh = Math.abs(h - start.height);
-                    if (dw >= dh) { h = Math.round(w / aspect); } else { w = Math.round(h * aspect); }
-                }
-                 // Минимальная площадь — только для фреймов
-                 if (!isEmoji) {
-                     const minArea = 1800;
-                     const area = Math.max(1, w * h);
-                     if (area < minArea) {
-                         const scale = Math.sqrt(minArea / area);
-                         w = Math.round(w * scale);
-                         h = Math.round(h * scale);
-                     }
-                 }
-                 data.size = { width: w, height: h };
-
-                // Если позиция известна (фиксированная противоположная сторона) — откорректируем её
-                if (!data.position && this._activeResize && this._activeResize.objectId === data.object) {
-                    const hndl = (this._activeResize.handle || '').toLowerCase();
-                    const startPos = this._activeResize.startPosition;
-                    const sw = this._activeResize.startSize.width;
-                    const sh = this._activeResize.startSize.height;
-                    let x = startPos.x;
-                    let y = startPos.y;
-                    // Базовая привязка противоположной стороны
-                    if (hndl.includes('w')) { x = startPos.x + (sw - w); }
-                    if (hndl.includes('n')) { y = startPos.y + (sh - h); }
-                    // Симметрическая компенсация по перпендикулярной оси для edge-хэндлов
-                    const isEdge = ['n','s','e','w'].includes(hndl);
-                    if (isEdge) {
-                        if (hndl === 'n' || hndl === 's') {
-                            // Вверх/вниз: верх или низ фиксируется, ширина меняется симметрично относительно центра
-                            x = startPos.x + Math.round((sw - w) / 2);
-                        } else if (hndl === 'e' || hndl === 'w') {
-                            // Вправо/влево: левая или правая фиксируется, высота меняется симметрично относительно центра
-                            y = startPos.y + Math.round((sh - h) / 2);
-                        }
-                    }
-                    data.position = { x: Math.round(x), y: Math.round(y) };
-                }
                 }
             }
 

package/src/moodboard/DataManager.js

@@ -9,18 +9,10 @@ export class DataManager {
     /**
      * Загружает данные в MoodBoard
      */
-    async loadData(data) {
+    loadData(data) {
         if (!data) return;
         
-        // Восстанавливаем отсутствующие URL изображений по imageId перед созданием объектов
-        try {
-            const apiClient = this.coreMoodboard?.apiClient;
-            if (apiClient && typeof apiClient.restoreObjectUrls === 'function') {
-                data = await apiClient.restoreObjectUrls(data);
-            }
-        } catch (e) {
-            console.warn('⚠️ Не удалось восстановить URL изображений по imageId:', e?.message || e);
-        }
+
         
         // Очищаем доску перед загрузкой
         this.clearBoard();
@@ -31,19 +23,6 @@ export class DataManager {
             
             data.objects.forEach((objectData, index) => {
                 try {
-                    // Диагностика размеров изображений на загрузке до создания
-                    if (objectData && objectData.type === 'image') {
-                        try {
-                            console.log('🧪 LOAD image size (before create)', {
-                                id: objectData.id,
-                                width: objectData.width,
-                                height: objectData.height,
-                                propWidth: objectData.properties?.width,
-                                propHeight: objectData.properties?.height
-                            });
-                        } catch (_) {}
-                    }
-
                     // Используем полные данные объекта, включая ID
                     const createdObject = this.coreMoodboard.createObjectFromData(objectData);
 

package/src/moodboard/MoodBoard.js

@@ -344,7 +344,7 @@ export class MoodBoard {
             
             if (!boardId || !this.options.apiUrl) {
                 console.log('📦 MoodBoard: нет boardId или apiUrl, загружаем пустую доску');
-                await this.dataManager.loadData(this.data || { objects: [] });
+                this.dataManager.loadData(this.data || { objects: [] });
                 
                 // Вызываем коллбек onLoad
                 if (typeof this.options.onLoad === 'function') {
@@ -374,25 +374,10 @@ export class MoodBoard {
             }
             
             const boardData = await response.json();
-
-            // Диагностика: лог размеров изображений прямо из ответа API до любой обработки
-            try {
-                const objects = (boardData && boardData.data && Array.isArray(boardData.data.objects)) ? boardData.data.objects : [];
-                const images = objects.filter(o => o && o.type === 'image');
-                images.forEach((o) => {
-                    console.log('🧪 API LOAD payload image size', {
-                        id: o.id,
-                        width: o.width,
-                        height: o.height,
-                        propWidth: o.properties?.width,
-                        propHeight: o.properties?.height
-                    });
-                });
-            } catch (_) {}
             
             if (boardData && boardData.data) {
                 console.log('✅ MoodBoard: данные загружены с сервера', boardData.data);
-                await this.dataManager.loadData(boardData.data);
+                this.dataManager.loadData(boardData.data);
                 
                 // Вызываем коллбек onLoad
                 if (typeof this.options.onLoad === 'function') {
@@ -400,7 +385,7 @@ export class MoodBoard {
                 }
             } else {
                 console.log('📦 MoodBoard: нет данных с сервера, загружаем пустую доску');
-                await this.dataManager.loadData(this.data || { objects: [] });
+                this.dataManager.loadData(this.data || { objects: [] });
                 
                 // Вызываем коллбек onLoad
                 if (typeof this.options.onLoad === 'function') {