@sequent-org/moodboard 1.0.0

package/src/core/ApiClient.js

@@ -0,0 +1,309 @@
+// src/core/ApiClient.js
+export class ApiClient {
+    constructor(baseUrl, authToken = null) {
+        this.baseUrl = baseUrl;
+        this.authToken = authToken;
+    }
+
+    async getBoard(boardId) {
+        try {
+            const response = await fetch(`/api/moodboard/${boardId}`, {
+                method: 'GET',
+                headers: {
+                    'Accept': 'application/json',
+                    'X-Requested-With': 'XMLHttpRequest'
+                },
+                credentials: 'same-origin'
+            });
+
+            if (!response.ok) {
+                throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+            }
+
+            const result = await response.json();
+            
+            if (result.success) {
+                return { data: result.data };
+            } else {
+                throw new Error(result.message || 'Ошибка загрузки доски');
+            }
+        } catch (error) {
+            console.warn('API: Ошибка загрузки доски, используем заглушку:', error);
+            // Fallback к заглушке
+            return {
+                data: {
+                    id: boardId,
+                    name: 'Demo Board',
+                    objects: []
+                }
+            };
+        }
+    }
+
+    async saveBoard(boardId, boardData) {
+        try {
+            // Фильтруем объекты изображений и файлов - убираем избыточные данные
+            const cleanedData = this._cleanObjectData(boardData);
+
+            const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');
+
+            const response = await fetch('/api/moodboard/save', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'Accept': 'application/json',
+                    'X-CSRF-TOKEN': csrfToken,
+                    'X-Requested-With': 'XMLHttpRequest'
+                },
+                credentials: 'same-origin',
+                body: JSON.stringify({
+                    boardId: boardId,
+                    boardData: cleanedData
+                })
+            });
+
+            if (!response.ok) {
+                throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+            }
+            
+            const result = await response.json();
+            
+            if (result.success) {
+                return { success: true, data: result };
+            } else {
+                throw new Error(result.message || 'Ошибка сохранения доски');
+            }
+        } catch (error) {
+            console.error('ApiClient: Ошибка сохранения доски:', error);
+            throw error;
+        }
+    }
+
+    /**
+     * Очищает данные объектов от избыточной информации
+     * @private
+     */
+    _cleanObjectData(boardData) {
+        if (!boardData || !boardData.objects) {
+            return boardData;
+        }
+
+        const cleanedObjects = boardData.objects.map(obj => {
+            if (obj.type === 'image') {
+                console.log('🧹 DEBUG _cleanImageData: обрабатываем изображение:', {
+                    id: obj.id,
+                    imageId: obj.imageId,
+                    hasSrc: !!obj.src,
+                    hasPropertiesSrc: !!obj.properties?.src,
+                    srcIsBase64: !!(obj.src && obj.src.startsWith('data:')),
+                    propertiesSrcIsBase64: !!(obj.properties?.src && obj.properties.src.startsWith('data:'))
+                });
+                
+                const cleanedObj = { ...obj };
+                
+                // Если есть imageId, убираем src для экономии места
+                if (obj.imageId && typeof obj.imageId === 'string' && obj.imageId.trim().length > 0) {
+                    console.log('🧹 DEBUG _cleanImageData: у изображения есть imageId, убираем src');
+                    
+                    // Убираем src с верхнего уровня
+                    if (cleanedObj.src) {
+                        delete cleanedObj.src;
+                        console.log('🧹 DEBUG: удален src с верхнего уровня');
+                    }
+                    
+                    // Убираем src из properties
+                    if (cleanedObj.properties?.src) {
+                        cleanedObj.properties = { ...cleanedObj.properties };
+                        delete cleanedObj.properties.src;
+                        console.log('🧹 DEBUG: удален src из properties');
+                    }
+                }
+                // Если нет imageId, предупреждаем о base64
+                else {
+                    console.log('🧹 DEBUG _cleanImageData: у изображения НЕТ imageId, оставляем src как есть');
+                    if (cleanedObj.properties?.src && cleanedObj.properties.src.startsWith('data:')) {
+                        console.warn('❌ Изображение сохраняется с base64 в properties, так как нет imageId:', cleanedObj.id);
+                    }
+                    if (cleanedObj.src && cleanedObj.src.startsWith('data:')) {
+                        console.warn('❌ Изображение сохраняется с base64 в src, так как нет imageId:', cleanedObj.id);
+                    }
+                    if (!obj.imageId) {
+                        console.warn('❌ У изображения отсутствует imageId:', cleanedObj.id);
+                    }
+                }
+                
+                return cleanedObj;
+            }
+            
+            if (obj.type === 'file') {
+                console.log('🧹 DEBUG _cleanObjectData: обрабатываем файл:', {
+                    id: obj.id,
+                    fileId: obj.fileId,
+                    hasContent: !!obj.content,
+                    hasPropertiesContent: !!obj.properties?.content
+                });
+                
+                const cleanedObj = { ...obj };
+                
+                // Если есть fileId, убираем content для экономии места
+                if (obj.fileId && typeof obj.fileId === 'string' && obj.fileId.trim().length > 0) {
+                    console.log('🧹 DEBUG _cleanObjectData: у файла есть fileId, убираем content');
+                    
+                    // Убираем content с верхнего уровня
+                    if (cleanedObj.content) {
+                        delete cleanedObj.content;
+                        console.log('🧹 DEBUG: удален content с верхнего уровня');
+                    }
+                    
+                    // Убираем content из properties
+                    if (cleanedObj.properties?.content) {
+                        cleanedObj.properties = { ...cleanedObj.properties };
+                        delete cleanedObj.properties.content;
+                        console.log('🧹 DEBUG: удален content из properties');
+                    }
+                }
+                // Если нет fileId, предупреждаем о наличии content
+                else {
+                    console.log('🧹 DEBUG _cleanObjectData: у файла НЕТ fileId, оставляем content как есть');
+                    if (cleanedObj.properties?.content) {
+                        console.warn('❌ Файл сохраняется с content в properties, так как нет fileId:', cleanedObj.id);
+                    }
+                    if (cleanedObj.content) {
+                        console.warn('❌ Файл сохраняется с content, так как нет fileId:', cleanedObj.id);
+                    }
+                    if (!obj.fileId) {
+                        console.warn('❌ У файла отсутствует fileId:', cleanedObj.id);
+                    }
+                }
+                
+                return cleanedObj;
+            }
+            
+            return obj;
+        });
+
+        return {
+            ...boardData,
+            objects: cleanedObjects
+        };
+    }
+
+    /**
+     * Восстанавливает URL изображений и файлов при загрузке
+     */
+    async restoreObjectUrls(boardData) {
+        if (!boardData || !boardData.objects) {
+            return boardData;
+        }
+
+        const restoredObjects = await Promise.all(
+            boardData.objects.map(async (obj) => {
+                if (obj.type === 'image') {
+                    console.log('🔗 DEBUG restoreImageUrls: обрабатываем изображение:', {
+                        id: obj.id,
+                        imageId: obj.imageId,
+                        hasSrc: !!obj.src,
+                        hasPropertiesSrc: !!obj.properties?.src
+                    });
+                    
+                    if (obj.imageId && (!obj.src && !obj.properties?.src)) {
+                        console.log('🔗 DEBUG: восстанавливаем URL для изображения');
+                        try {
+                            // Формируем URL изображения
+                            const imageUrl = `/api/images/${obj.imageId}/file`;
+                            
+                            return {
+                                ...obj,
+                                src: imageUrl,
+                                properties: {
+                                    ...obj.properties,
+                                    src: imageUrl
+                                }
+                            };
+                        } catch (error) {
+                            console.warn(`Не удалось восстановить URL для изображения ${obj.imageId}:`, error);
+                            return obj;
+                        }
+                    } else {
+                        console.log('🔗 DEBUG: изображение уже имеет URL или нет imageId, оставляем как есть');
+                        return obj;
+                    }
+                }
+                
+                if (obj.type === 'file') {
+                    console.log('🔗 DEBUG restoreObjectUrls: обрабатываем файл:', {
+                        id: obj.id,
+                        fileId: obj.fileId,
+                        hasUrl: !!obj.url,
+                        hasPropertiesUrl: !!obj.properties?.url
+                    });
+                    
+                    if (obj.fileId) {
+                        console.log('🔗 DEBUG: восстанавливаем данные для файла');
+                        try {
+                            // Формируем URL файла для скачивания
+                            const fileUrl = `/api/files/${obj.fileId}/download`;
+                            
+                            // Создаем обновленный объект с восстановленными данными
+                            const restoredObj = {
+                                ...obj,
+                                url: fileUrl,
+                                properties: {
+                                    ...obj.properties,
+                                    url: fileUrl
+                                }
+                            };
+                            
+                            // Пытаемся восстановить актуальные метаданные файла с сервера
+                            // (Это будет выполнено асинхронно, чтобы не блокировать загрузку)
+                            setTimeout(async () => {
+                                try {
+                                    const response = await fetch(`/api/files/${obj.fileId}`, {
+                                        headers: {
+                                            'Accept': 'application/json',
+                                            'X-Requested-With': 'XMLHttpRequest'
+                                        },
+                                        credentials: 'same-origin'
+                                    });
+                                    
+                                    if (response.ok) {
+                                        const result = await response.json();
+                                        if (result.success && result.data) {
+                                            console.log('🔄 Обновляем метаданные файла с сервера:', result.data);
+                                            // Эмитим событие для обновления метаданных файла в состоянии
+                                            // (это будет обработано в core, если EventBus доступен)
+                                            if (typeof window !== 'undefined' && window.moodboardEventBus) {
+                                                window.moodboardEventBus.emit('file:metadata:updated', {
+                                                    objectId: obj.id,
+                                                    fileId: obj.fileId,
+                                                    metadata: result.data
+                                                });
+                                            }
+                                        }
+                                    }
+                                } catch (error) {
+                                    console.warn(`Не удалось обновить метаданные файла ${obj.fileId}:`, error);
+                                }
+                            }, 100);
+                            
+                            return restoredObj;
+                        } catch (error) {
+                            console.warn(`Не удалось восстановить данные для файла ${obj.fileId}:`, error);
+                            return obj;
+                        }
+                    } else {
+                        console.log('🔗 DEBUG: файл не имеет fileId, оставляем как есть');
+                        return obj;
+                    }
+                }
+                
+                return obj;
+            })
+        );
+
+        return {
+            ...boardData,
+            objects: restoredObjects
+        };
+    }
+}

package/src/core/EventBus.js

@@ -0,0 +1,42 @@
+export class EventBus {
+    constructor() {
+        this.events = new Map();
+    }
+
+    on(event, callback) {
+        if (!this.events.has(event)) {
+            this.events.set(event, new Set());
+        }
+        this.events.get(event).add(callback);
+    }
+
+    off(event, callback) {
+        const callbacks = this.events.get(event);
+        if (callbacks) {
+            callbacks.delete(callback);
+
+            // Если callback'ов больше нет, удаляем событие из Map
+            if (callbacks.size === 0) {
+                this.events.delete(event);
+            }
+        }
+    }
+
+    emit(event, data) {
+        const callbacks = this.events.get(event);
+        if (callbacks) {
+            callbacks.forEach(callback => {
+                try {
+                    callback(data);
+                } catch (error) {
+                    // Логируем ошибку, но продолжаем выполнение
+                    console.error(`Error in event callback for '${event}':`, error);
+                }
+            });
+        }
+    }
+
+    removeAllListeners() {
+        this.events.clear();
+    }
+}

package/src/core/HistoryManager.js

@@ -0,0 +1,261 @@
+/**
+ * Управляет историей команд для функции Undo/Redo
+ */
+import { Events } from './events/Events.js';
+export class HistoryManager {
+    constructor(eventBus, options = {}) {
+        this.eventBus = eventBus;
+        this.options = {
+            maxHistorySize: 50, // Максимальное количество команд в истории
+            mergeTimeout: 1000, // Время в мс для объединения похожих команд
+            ...options
+        };
+
+        // История выполненных команд
+        this.history = [];
+        // Текущая позиция в истории
+        this.currentIndex = -1;
+        // Флаг для предотвращения зацикливания при undo/redo
+        this.isExecutingCommand = false;
+
+        this.initEventListeners();
+    }
+
+    initEventListeners() {
+        // Слушаем события клавиатуры
+        this.eventBus.on(Events.Keyboard.Undo, () => {
+            this.undo();
+        });
+
+        this.eventBus.on(Events.Keyboard.Redo, () => {
+            this.redo();
+        });
+
+        // Для отладки
+        this.eventBus.on(Events.History.Debug, () => {
+            this.debugHistory();
+        });
+    }
+
+    /**
+     * Выполнить команду и добавить в историю
+     */
+    executeCommand(command) {
+        if (this.isExecutingCommand) {
+            // Если мы в процессе undo/redo, не добавляем в историю
+            this._executeCommandSafely(command);
+            return;
+        }
+
+
+
+        // Проверяем, можно ли объединить с последней командой
+        const lastCommand = this.getLastCommand();
+        if (lastCommand && 
+            lastCommand.canMergeWith(command) && 
+            (command.timestamp - lastCommand.timestamp) < this.options.mergeTimeout) {
+            
+
+            lastCommand.mergeWith(command);
+            this.eventBus.emit('history:changed', {
+                canUndo: this.canUndo(),
+                canRedo: this.canRedo(),
+                historySize: this.history.length
+            });
+            return;
+        }
+
+        // Выполняем команду
+        this._executeCommandSafely(command);
+
+        // Удаляем все команды после текущей позиции (если есть)
+        if (this.currentIndex < this.history.length - 1) {
+            this.history = this.history.slice(0, this.currentIndex + 1);
+        }
+
+        // Добавляем новую команду
+        this.history.push(command);
+        this.currentIndex++;
+
+        // Ограничиваем размер истории
+        if (this.history.length > this.options.maxHistorySize) {
+            this.history.shift();
+            this.currentIndex--;
+        }
+
+        // Уведомляем об изменении истории
+        this.eventBus.emit(Events.History.Changed, {
+            canUndo: this.canUndo(),
+            canRedo: this.canRedo(),
+            historySize: this.history.length,
+            currentCommand: command.toString()
+        });
+
+
+    }
+
+    /**
+     * Безопасно выполняет команду (поддерживает синхронные и асинхронные команды)
+     * @private
+     */
+    _executeCommandSafely(command) {
+        try {
+            const result = command.execute();
+            // Если команда возвращает Promise, обрабатываем асинхронно
+            if (result && typeof result.then === 'function') {
+                result.catch(error => {
+                    console.error('Ошибка выполнения асинхронной команды:', error);
+                });
+            }
+        } catch (error) {
+            console.error('Ошибка выполнения команды:', error);
+        }
+    }
+
+    /**
+     * Отменить последнюю команду
+     */
+    undo() {
+        if (!this.canUndo()) {
+
+            return false;
+        }
+
+        const command = this.history[this.currentIndex];
+
+
+        this.isExecutingCommand = true;
+        try {
+            command.undo();
+            this.currentIndex--;
+            
+            this.eventBus.emit(Events.History.Changed, {
+                canUndo: this.canUndo(),
+                canRedo: this.canRedo(),
+                historySize: this.history.length,
+                lastUndone: command.toString()
+            });
+
+
+            return true;
+        } catch (error) {
+            console.error('❌ Ошибка при отмене команды:', error);
+            return false;
+        } finally {
+            this.isExecutingCommand = false;
+        }
+    }
+
+    /**
+     * Повторить отмененную команду
+     */
+    redo() {
+        if (!this.canRedo()) {
+
+            return false;
+        }
+
+        this.currentIndex++;
+        const command = this.history[this.currentIndex];
+
+
+        this.isExecutingCommand = true;
+        try {
+            this._executeCommandSafely(command);
+            
+            this.eventBus.emit(Events.History.Changed, {
+                canUndo: this.canUndo(),
+                canRedo: this.canRedo(),
+                historySize: this.history.length,
+                lastRedone: command.toString()
+            });
+
+
+            return true;
+        } catch (error) {
+            console.error('❌ Ошибка при повторе команды:', error);
+            this.currentIndex--; // Откатываем индекс при ошибке
+            return false;
+        } finally {
+            this.isExecutingCommand = false;
+        }
+    }
+
+    /**
+     * Можно ли отменить команду
+     */
+    canUndo() {
+        return this.currentIndex >= 0;
+    }
+
+    /**
+     * Можно ли повторить команду
+     */
+    canRedo() {
+        return this.currentIndex < this.history.length - 1;
+    }
+
+    /**
+     * Получить последнюю команду
+     */
+    getLastCommand() {
+        if (this.history.length === 0) return null;
+        return this.history[this.history.length - 1];
+    }
+
+    /**
+     * Очистить историю
+     */
+    clear() {
+        this.history = [];
+        this.currentIndex = -1;
+        
+        this.eventBus.emit(Events.History.Changed, {
+            canUndo: false,
+            canRedo: false,
+            historySize: 0
+        });
+
+
+    }
+
+    /**
+     * Получить информацию об истории (для отладки)
+     */
+    getHistoryInfo() {
+        return {
+            totalCommands: this.history.length,
+            currentIndex: this.currentIndex,
+            canUndo: this.canUndo(),
+            canRedo: this.canRedo(),
+            commands: this.history.map((cmd, index) => ({
+                index,
+                isCurrent: index === this.currentIndex,
+                command: cmd.toString()
+            }))
+        };
+    }
+
+    /**
+     * Вывести историю в консоль (для отладки)
+     */
+    debugHistory() {
+        // Отладочная информация об истории команд
+        const info = this.getHistoryInfo();
+        console.group('📚 История команд');
+        console.table(info.commands);
+        console.log(`Позиция: ${this.currentIndex + 1}/${this.history.length}`);
+        console.log(`Undo: ${this.canUndo()}, Redo: ${this.canRedo()}`);
+        console.groupEnd();
+    }
+
+    /**
+     * Уничтожить менеджер истории
+     */
+    destroy() {
+        this.clear();
+        this.eventBus.removeAllListeners(Events.Keyboard.Undo);
+        this.eventBus.removeAllListeners(Events.Keyboard.Redo);
+        this.eventBus.removeAllListeners(Events.History.Debug);
+    }
+}