@sequent-org/moodboard 1.4.45 → 1.4.48

package/package.json

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

package/src/core/events/Events.js

@@ -70,6 +70,7 @@ export const Events = {
 		ZoomSelection: 'ui:zoom:selection',
 		ZoomPercent: 'ui:zoom:percent',
 		RevitShowInModel: 'ui:revit:show-in-model',
+		Model3dShowInViewer: 'ui:model3d:show-in-viewer',
 		MinimapGetData: 'ui:minimap:get-data',
 		MinimapCenterOn: 'ui:minimap:center-on',
 		TextEditStart: 'ui:text:edit:start',

package/src/core/flows/ClipboardFlow.js

@@ -286,8 +286,36 @@ export function setupClipboardFlow(core) {
         }
     });
 
-    core.eventBus.on(Events.UI.PasteImageAt, async ({ x, y, src, name, skipUpload, aiMessageId }) => {
+    core.eventBus.on(Events.UI.PasteImageAt, async ({ x, y, src, name, skipUpload, aiMessageId, objectType, modelUrl, format }) => {
         if (!src) return;
+
+        // Отдельный путь для 3D-скрина: без resolveRevitImagePayload и без загрузки на сервер
+        if (objectType === 'model3d-screenshot-img') {
+            const world = core.pixi.worldLayer || core.pixi.app.stage;
+            const s = world?.scale?.x || 1;
+            const worldX = (x - (world?.x || 0)) / s;
+            const worldY = (y - (world?.y || 0)) / s;
+            const placeModel3d = (natW, natH) => {
+                const ar = (natW > 0 && natH > 0) ? natW / natH : 1;
+                const w = 300;
+                const h = Math.max(1, Math.round(w / ar));
+                const created = core.createObject(
+                    'model3d-screenshot-img',
+                    { x: Math.round(worldX - Math.round(w / 2)), y: Math.round(worldY - Math.round(h / 2)) },
+                    { src, name: name || 'ai-3d-model', width: w, height: h, modelUrl, format }
+                );
+                if (skipUpload && created?.id) {
+                    core._pendingPersistAckVisibilityIds?.delete(created.id);
+                    core._setObjectVisibility?.(created.id, true);
+                }
+            };
+            const img = new Image();
+            img.onload = () => placeModel3d(img.naturalWidth, img.naturalHeight);
+            img.onerror = () => placeModel3d(0, 0);
+            img.src = src;
+            return;
+        }
+
         const uploaded = await ensureServerImage({ src, name, skipUpload });
         if (!uploaded?.src) return;
         const world = core.pixi.worldLayer || core.pixi.app.stage;

package/src/core/flows/Model3dFlow.js

@@ -0,0 +1,15 @@
+import { Events } from '../events/Events.js';
+
+export function setupModel3dFlow(core) {
+    core.eventBus.on(Events.UI.Model3dShowInViewer, ({ objectId, modelUrl, format }) => {
+        if (!modelUrl || typeof modelUrl !== 'string') {
+            return;
+        }
+
+        if (typeof core.options?.onShowModel3dInViewer === 'function') {
+            core.options.onShowModel3dInViewer({ objectId, modelUrl, format });
+        } else {
+            console.warn('[Model3dFlow] onShowModel3dInViewer не задан в options. objectId:', objectId, 'modelUrl:', modelUrl);
+        }
+    });
+}

package/src/core/index.js

@@ -17,6 +17,7 @@ import { setupClipboardFlow, setupClipboardKeyboardFlow } from './flows/Clipboar
 import { setupObjectLifecycleFlow } from './flows/ObjectLifecycleFlow.js';
 import { setupLayerAndViewportFlow } from './flows/LayerAndViewportFlow.js';
 import { setupRevitFlow } from './flows/RevitFlow.js';
+import { setupModel3dFlow } from './flows/Model3dFlow.js';
 import { setupSaveFlow } from './flows/SaveFlow.js';
 import {
     logMindmapCompoundDebug,
@@ -133,6 +134,7 @@ export class CoreMoodBoard {
         setupTransformFlow(this);
         setupObjectLifecycleFlow(this);
         setupRevitFlow(this);
+        setupModel3dFlow(this);
     }
 
     /**
@@ -432,7 +434,7 @@ export class CoreMoodBoard {
             },
             ...extraData
         };
-        if (type === 'image' || type === 'revit-screenshot-img' || type === 'file') {
+        if (type === 'image' || type === 'revit-screenshot-img' || type === 'model3d-screenshot-img' || type === 'file') {
             const propSrc = typeof properties?.src === 'string' ? properties.src.trim() : '';
             const propUrl = typeof properties?.url === 'string' ? properties.url.trim() : '';
             const normalizedSrc = propSrc || propUrl;
@@ -557,7 +559,7 @@ export class CoreMoodBoard {
             properties: objectData.properties || {},
             existingObjects: this.state?.state?.objects || [],
         });
-        if (objectData.type === 'image' || objectData.type === 'revit-screenshot-img' || objectData.type === 'file') {
+        if (objectData.type === 'image' || objectData.type === 'revit-screenshot-img' || objectData.type === 'model3d-screenshot-img' || objectData.type === 'file') {
             const topSrc = typeof objectData.src === 'string' ? objectData.src.trim() : '';
             const propSrc = typeof objectData.properties?.src === 'string' ? objectData.properties.src.trim() : '';
             const topUrl = typeof objectData.url === 'string' ? objectData.url.trim() : '';

package/src/moodboard/bootstrap/MoodBoardUiFactory.js

@@ -18,6 +18,7 @@ import { TextPropertiesPanel } from '../../ui/TextPropertiesPanel.js';
 import { FramePropertiesPanel } from '../../ui/FramePropertiesPanel.js';
 import { NotePropertiesPanel } from '../../ui/NotePropertiesPanel.js';
 import { FilePropertiesPanel } from '../../ui/FilePropertiesPanel.js';
+import { ImagePropertiesPanel } from '../../ui/ImagePropertiesPanel.js';
 import { ConnectorPropertiesPanel } from '../../ui/ConnectorPropertiesPanel.js';
 import { ShapePropertiesPanel } from '../../ui/ShapePropertiesPanel.js';
 import { DrawingPropertiesPanel } from '../../ui/DrawingPropertiesPanel.js';
@@ -151,6 +152,7 @@ function initHtmlLayersAndPanels(board) {
     board.framePropertiesPanel = new FramePropertiesPanel(board.coreMoodboard.eventBus, board.canvasContainer, board.coreMoodboard);
     board.notePropertiesPanel = new NotePropertiesPanel(board.coreMoodboard.eventBus, board.canvasContainer, board.coreMoodboard);
     board.filePropertiesPanel = new FilePropertiesPanel(board.coreMoodboard.eventBus, board.canvasContainer, board.coreMoodboard);
+    board.imagePropertiesPanel = new ImagePropertiesPanel(board.coreMoodboard.eventBus, board.canvasContainer, board.coreMoodboard);
     board.connectorPropertiesPanel = new ConnectorPropertiesPanel(board.coreMoodboard.eventBus, board.canvasContainer, board.coreMoodboard);
     board.shapePropertiesPanel = new ShapePropertiesPanel(board.coreMoodboard.eventBus, board.canvasContainer, board.coreMoodboard);
     board.drawingPropertiesPanel = new DrawingPropertiesPanel(board.coreMoodboard.eventBus, board.canvasContainer, board.coreMoodboard);

package/src/objects/Model3dScreenshotImageObject.js

@@ -0,0 +1,8 @@
+import { ImageObject } from './ImageObject.js';
+
+/**
+ * Model3dScreenshotImageObject
+ * Специализированный тип для превью 3D-моделей.
+ * Визуально и по трансформациям полностью повторяет ImageObject.
+ */
+export class Model3dScreenshotImageObject extends ImageObject {}

package/src/objects/ObjectFactory.js

@@ -5,6 +5,7 @@ import { TextObject } from './TextObject.js';
 import { EmojiObject } from './EmojiObject.js';
 import { ImageObject } from './ImageObject.js';
 import { RevitScreenshotImageObject } from './RevitScreenshotImageObject.js';
+import { Model3dScreenshotImageObject } from './Model3dScreenshotImageObject.js';
 import { CommentObject } from './CommentObject.js';
 import { NoteObject } from './NoteObject.js';
 import { FileObject } from './FileObject.js';
@@ -25,6 +26,7 @@ export class ObjectFactory {
         ['emoji', EmojiObject],
         ['image', ImageObject],
         ['revit-screenshot-img', RevitScreenshotImageObject],
+        ['model3d-screenshot-img', Model3dScreenshotImageObject],
         ['comment', CommentObject],
         ['note', NoteObject],
         ['file', FileObject],

package/src/services/ai/AiClient.js

@@ -141,6 +141,175 @@ export class AiClient {
         }
         return res.json();
     }
+
+    /**
+     * Отправляет джоб генерации 3D-модели.
+     * @param {object} args
+     * @param {string} [args.provider='hunyuan-3d']
+     * @param {string} [args.mode='image'] 'text'|'image'|'multi'
+     * @param {string} [args.prompt]
+     * @param {File} [args.image]
+     * @param {Array<{file: File, viewType: string}>} [args.multiViewImages]
+     * @param {string} [args.model='3.1']
+     * @param {string} [args.generateType]
+     * @param {number} [args.faceCount]
+     * @param {boolean} [args.pbr]
+     * @param {string} [args.downloadFormat]
+     * @param {AbortSignal} [args.signal]
+     * @returns {Promise<{jobId: string}>}
+     */
+    async submit3dModel({ provider = 'hunyuan-3d', mode = 'image', prompt, image, multiViewImages, model = '3.1', generateType, faceCount, pbr, downloadFormat, signal }) {
+        const body = { mode, model, downloadFormat };
+        if (generateType !== undefined) body.generateType = generateType;
+        if (faceCount !== undefined) body.faceCount = faceCount;
+        if (pbr !== undefined) body.pbr = pbr;
+
+        if (mode === 'text') {
+            body.prompt = prompt;
+        } else if (mode === 'multi') {
+            if (Array.isArray(multiViewImages) && multiViewImages.length) {
+                body.multiViewImages = await Promise.all(
+                    multiViewImages.map(async ({ file, viewType }) => {
+                        const [encoded] = await filesToBase64([file]);
+                        return { ...encoded, viewType };
+                    })
+                );
+            }
+        } else {
+            if (image) {
+                const [encoded] = await filesToBase64([image]);
+                body.image = encoded;
+            }
+        }
+
+        const res = await this._fetch(`${this._baseUrl}/${provider}/model3d`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json', 'Accept': 'application/json' },
+            body: JSON.stringify(body),
+            signal
+        });
+        if (!res.ok) {
+            const detail = await safeReadError(res);
+            throw new Error(`AiClient.submit3dModel (${res.status}): ${detail}`);
+        }
+        return res.json();
+    }
+
+    /**
+     * Опрашивает статус джоба 3D-модели.
+     * @param {string} jobId
+     * @param {AbortSignal} [signal]
+     * @param {string} [provider='hunyuan-3d']
+     * @param {string} [format]
+     * @returns {Promise<object>}
+     */
+    async poll3dModel(jobId, signal, provider = 'hunyuan-3d', format) {
+        const url = `${this._baseUrl}/${provider}/model3d/${jobId}${format ? `?format=${format}` : ''}`;
+        const res = await this._fetch(url, {
+            method: 'GET',
+            headers: { 'Accept': 'application/json' },
+            signal
+        });
+        if (!res.ok) {
+            const detail = await safeReadError(res);
+            throw new Error(`AiClient.poll3dModel (${res.status}): ${detail}`);
+        }
+        return res.json();
+    }
+
+    /**
+     * Отправляет джоб генерации видео.
+     * @param {object} args
+     * @param {string} [args.provider='gemini-video']
+     * @param {string} args.prompt
+     * @param {string} [args.negativePrompt]
+     * @param {string} [args.model]
+     * @param {string} [args.ratio]
+     * @param {string} [args.resolution]
+     * @param {number} [args.duration]
+     * @param {number} [args.seed]
+     * @param {File[]} [args.referenceImages]
+     * @param {AbortSignal} [args.signal]
+     * @returns {Promise<{jobId: string}>}
+     */
+    async submitVideo({ provider = 'gemini-video', signal, referenceImages: files, ...payload }) {
+        const referenceImages = await filesToBase64(files);
+        const body = referenceImages ? { ...payload, referenceImages } : payload;
+        const res = await this._fetch(`${this._baseUrl}/${provider}/video`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json', 'Accept': 'application/json' },
+            body: JSON.stringify(body),
+            signal
+        });
+        if (!res.ok) {
+            const detail = await safeReadError(res);
+            throw new Error(`AiClient.submitVideo (${res.status}): ${detail}`);
+        }
+        return res.json();
+    }
+
+    /**
+     * Опрашивает статус джоба генерации видео.
+     * @param {string} jobId
+     * @param {AbortSignal} [signal]
+     * @param {string} [provider='gemini-video']
+     * @returns {Promise<object>}
+     */
+    async pollVideo(jobId, signal, provider = 'gemini-video') {
+        const res = await this._fetch(`${this._baseUrl}/${provider}/video/${jobId}`, {
+            method: 'GET',
+            headers: { 'Accept': 'application/json' },
+            signal
+        });
+        if (!res.ok) {
+            const detail = await safeReadError(res);
+            throw new Error(`AiClient.pollVideo (${res.status}): ${detail}`);
+        }
+        return res.json();
+    }
+
+    /**
+     * Отправляет джоб конвертации GLB -> FBX/STL.
+     * @param {object} args
+     * @param {string} args.glbUrl
+     * @param {string} args.format 'fbx'|'stl'
+     * @param {AbortSignal} [args.signal]
+     * @returns {Promise<{jobId: string}>}
+     */
+    async submitConvert3d({ glbUrl, format, signal }) {
+        const res = await this._fetch(`${this._baseUrl}/convert3d`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json', 'Accept': 'application/json' },
+            body: JSON.stringify({ glbUrl, format }),
+            signal
+        });
+        if (!res.ok) {
+            const detail = await safeReadError(res);
+            throw new Error(`AiClient.submitConvert3d (${res.status}): ${detail}`);
+        }
+        return res.json();
+    }
+
+    /**
+     * Опрашивает статус джоба конвертации.
+     * @param {string} jobId
+     * @param {AbortSignal} [signal]
+     * @param {string} [format]
+     * @returns {Promise<object>}
+     */
+    async pollConvert3d(jobId, signal, format) {
+        const url = `${this._baseUrl}/convert3d/${jobId}${format ? `?format=${format}` : ''}`;
+        const res = await this._fetch(url, {
+            method: 'GET',
+            headers: { 'Accept': 'application/json' },
+            signal
+        });
+        if (!res.ok) {
+            const detail = await safeReadError(res);
+            throw new Error(`AiClient.pollConvert3d (${res.status}): ${detail}`);
+        }
+        return res.json();
+    }
 }
 
 /**
@@ -221,12 +390,22 @@ function safeJson(text) {
 }
 
 async function safeReadError(res) {
+    const fallback = res.statusText || `HTTP ${res.status}`;
     try {
         const text = await res.text();
         const json = safeJson(text);
-        return json?.error ? json.error : (text || res.statusText);
+        if (json?.error) {
+            return typeof json.error === 'string' ? json.error : fallback;
+        }
+        // Не отдаём в UI сырой HTML/стектрейс (Laravel debug-страница) или
+        // слишком длинное тело — показываем лаконичный статус вместо «простыни».
+        const trimmed = (text || '').trim();
+        if (!trimmed || trimmed.startsWith('<') || trimmed.length > 200) {
+            return fallback;
+        }
+        return trimmed;
     } catch {
-        return res.statusText;
+        return fallback;
     }
 }
 

package/src/services/ai/Model3dSessionController.js

@@ -0,0 +1,238 @@
+/**
+ * Контроллер сессии генерации 3D-модели (Hunyuan 3D).
+ *
+ * Одна ответственность: оркестрирует submit -> poll-цикл через AiClient,
+ * держит состояние джоба и уведомляет подписчиков об изменениях.
+ * Не знает про DOM, доску и UI.
+ *
+ * Состояние:
+ *   - status: 'idle' | 'submitting' | 'polling' | 'done' | 'error'
+ *   - progress: number (0–100)
+ *   - stage: 'geometry' | 'texture' | 'convert' | null
+ *   - error: string | null
+ *   - jobId: string | null
+ *   - result: { previewBase64, mimeType, modelUrl, format } | null
+ */
+
+const POLL_INTERVAL_MS = 2500;
+const JOB_TIMEOUT_MS = 600_000; // 600с: покрывает оба джоба (генерация + конвертация)
+
+export class Model3dSessionController {
+    /**
+     * @param {object} deps
+     * @param {import('./AiClient.js').AiClient} deps.aiClient
+     */
+    constructor({ aiClient }) {
+        this._client = aiClient;
+        this._listeners = new Set();
+        this._abort = null;
+
+        this._state = {
+            status: 'idle',
+            progress: 0,
+            stage: null,
+            error: null,
+            jobId: null,
+            result: null
+        };
+    }
+
+    getState() {
+        return this._state;
+    }
+
+    /**
+     * @param {function} listener
+     * @returns {function} unsubscribe
+     */
+    subscribe(listener) {
+        this._listeners.add(listener);
+        return () => this._listeners.delete(listener);
+    }
+
+    /**
+     * Запускает двухфазный джоб: генерация -> (опционально) конвертация.
+     * @param {object} args
+     * @param {string} [args.mode='image'] 'text'|'image'|'multi'
+     * @param {string} [args.prompt]
+     * @param {File} [args.image]
+     * @param {Array<{file: File, viewType: string}>} [args.multiViewImages]
+     * @param {string} [args.model='3.1']
+     * @param {string} [args.generateType]
+     * @param {number} [args.faceCount]
+     * @param {boolean} [args.pbr]
+     * @param {string} [args.downloadFormat='glb']
+     * @param {AbortSignal} [args.signal]
+     * @returns {Promise<void>}
+     */
+    async start({ mode = 'image', prompt, image, multiViewImages, model = '3.1', generateType, faceCount, pbr, downloadFormat = 'glb', signal: externalSignal } = {}) {
+        if (this._abort) this.abort();
+
+        const abort = new AbortController();
+        this._abort = abort;
+        const { signal } = abort;
+
+        if (externalSignal) {
+            if (externalSignal.aborted) { abort.abort(); return; }
+            externalSignal.addEventListener('abort', () => abort.abort(), { once: true });
+        }
+
+        this._setState({ status: 'submitting', progress: 0, stage: null, error: null, jobId: null, result: null });
+
+        const timeoutId = setTimeout(() => {
+            if (this._abort === abort) {
+                abort.abort();
+                this._setState({ status: 'error', error: 'Таймаут: джоб превысил 600 секунд' });
+            }
+        }, JOB_TIMEOUT_MS);
+
+        try {
+            const { jobId } = await this._client.submit3dModel({
+                mode, prompt, image, multiViewImages, model, generateType, faceCount, pbr, downloadFormat, signal
+            });
+            if (signal.aborted) return;
+
+            this._setState({ status: 'polling', jobId });
+
+            const genResult = await this._pollLoop(jobId, signal, downloadFormat);
+            if (!genResult || signal.aborted) return;
+
+            if (!genResult.needsConvert) {
+                const { previewBase64, mimeType, modelUrl, format } = genResult;
+                this._setState({ status: 'done', progress: 100, stage: null, result: { previewBase64, mimeType, modelUrl, format } });
+                return;
+            }
+
+            // Фаза 2: конвертация GLB -> FBX/STL
+            const { previewBase64: genPreview, mimeType: genMime, sourceGlbUrl } = genResult;
+            this._setState({ stage: 'convert', progress: 0 });
+
+            const { jobId: convertJobId } = await this._client.submitConvert3d({
+                glbUrl: sourceGlbUrl, format: downloadFormat, signal
+            });
+            if (signal.aborted) return;
+
+            this._setState({ jobId: convertJobId });
+
+            const convResult = await this._pollConvertLoop(convertJobId, signal, downloadFormat);
+            if (!convResult || signal.aborted) return;
+
+            this._setState({
+                status: 'done',
+                progress: 100,
+                stage: null,
+                result: { previewBase64: genPreview, mimeType: genMime, modelUrl: convResult.modelUrl, format: convResult.format }
+            });
+        } catch (err) {
+            if (err?.name === 'AbortError' || signal.aborted) return;
+            this._setState({ status: 'error', error: err?.message || 'Ошибка запроса' });
+        } finally {
+            clearTimeout(timeoutId);
+            if (this._abort === abort) this._abort = null;
+        }
+    }
+
+    /** Прерывает submit или поллинг. */
+    abort() {
+        if (this._abort) {
+            try { this._abort.abort(); } catch { /* noop */ }
+            this._abort = null;
+        }
+    }
+
+    async _pollLoop(jobId, signal, format) {
+        while (!signal.aborted) {
+            await sleep(POLL_INTERVAL_MS, signal);
+            if (signal.aborted) return null;
+
+            let data;
+            try {
+                data = await this._client.poll3dModel(jobId, signal, undefined, format);
+            } catch (err) {
+                if (err?.name === 'AbortError' || signal.aborted) return null;
+                this._setState({ status: 'error', error: err?.message || 'Ошибка поллинга' });
+                return null;
+            }
+
+            const { status, progress, stage, error } = data;
+
+            if (status === 'done') {
+                return data;
+            }
+
+            if (status === 'error') {
+                this._setState({ status: 'error', error: error || 'Ошибка джоба' });
+                return null;
+            }
+
+            // 'pending' | 'running' — обновляем прогресс
+            this._setState({
+                progress: progress ?? this._state.progress,
+                stage: stage ?? this._state.stage
+            });
+        }
+        return null;
+    }
+
+    async _pollConvertLoop(jobId, signal, format) {
+        while (!signal.aborted) {
+            await sleep(POLL_INTERVAL_MS, signal);
+            if (signal.aborted) return null;
+
+            let data;
+            try {
+                data = await this._client.pollConvert3d(jobId, signal, format);
+            } catch (err) {
+                if (err?.name === 'AbortError' || signal.aborted) return null;
+                this._setState({ status: 'error', error: err?.message || 'Ошибка конвертации' });
+                return null;
+            }
+
+            const { status, progress, error } = data;
+
+            if (status === 'done') {
+                return data;
+            }
+
+            if (status === 'error') {
+                this._setState({ status: 'error', error: error || 'Ошибка конвертации' });
+                return null;
+            }
+
+            this._setState({ progress: progress ?? this._state.progress });
+        }
+        return null;
+    }
+
+    _setState(patch) {
+        this._state = { ...this._state, ...patch };
+        this._emit();
+    }
+
+    _emit() {
+        for (const listener of this._listeners) {
+            try { listener(this._state); } catch (err) {
+                console.error('[Model3dSession] listener error:', err);
+            }
+        }
+    }
+}
+
+/**
+ * Promise, который разрешается через ms миллисекунд или отклоняется по AbortSignal.
+ * @param {number} ms
+ * @param {AbortSignal} [signal]
+ */
+function sleep(ms, signal) {
+    return new Promise((resolve, reject) => {
+        if (signal?.aborted) {
+            reject(new DOMException('Aborted', 'AbortError'));
+            return;
+        }
+        const id = setTimeout(resolve, ms);
+        signal?.addEventListener('abort', () => {
+            clearTimeout(id);
+            reject(new DOMException('Aborted', 'AbortError'));
+        }, { once: true });
+    });
+}