@sequent-org/ifc-viewer 1.2.4-ci.45.0 → 1.2.4-ci.47.0

package/README.md

@@ -341,7 +341,7 @@ import '@sequent-org/ifc-viewer/style.css'
 - Одновременно активна только одна плоскость
 
 ### Загрузка файлов
-- **📁 Загрузить** - Кнопка выбора IFC файла пользователем
+- **📁 Загрузить** - Кнопка выбора файла модели пользователем
 
 ## 🧪 Тестирование
 
@@ -359,8 +359,18 @@ npm run test:manual
 ## 📦 Поддерживаемые форматы
 
 - `.ifc` - стандартные IFC файлы
+- `.ifs` - вариант IFC (если используется в вашем пайплайне)
 - `.ifczip` - архивы IFC
 - `.zip` - ZIP архивы с IFC файлами
+- `.fbx` - FBX модели (базовая поддержка)
+- `.glb` - glTF Binary (рекомендуется для загрузки из файла)
+- `.gltf` - glTF JSON (часто требует внешние .bin/текстуры; надёжнее грузить по URL)
+- `.obj` - Wavefront OBJ (можно загружать один OBJ или OBJ+MTL(+текстуры) через мультивыбор файлов)
+- `.3ds` - 3D Studio (3DS) (рекомендуется загружать .3ds + текстуры через мультивыбор файлов)
+- `.stl` - STL (ASCII/Binary). Обычно без материалов/цветов — отображается с дефолтным материалом.
+- `.dae` - COLLADA (DAE) (можно загружать .dae + текстуры через мультивыбор файлов)
+
+Добавление новых форматов делается через реестр загрузчиков (`ModelLoaderRegistry`): регистрируете новый `XxxModelLoader`, и UI/точки входа загрузки остаются без изменений.
 
 ## 🔧 Troubleshooting
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sequent-org/ifc-viewer",
   "private": false,
-  "version": "1.2.4-ci.45.0",
+  "version": "1.2.4-ci.47.0",
   "type": "module",
   "description": "IFC 3D model viewer component for web applications - fully self-contained with local IFCLoader",
   "main": "src/index.js",

package/src/IfcViewer.js

@@ -13,6 +13,14 @@
 import { Viewer } from "./viewer/Viewer.js";
 import { IfcService } from "./ifc/IfcService.js";
 import { IfcTreeView } from "./ifc/IfcTreeView.js";
+import { ModelLoaderRegistry } from "./model-loading/ModelLoaderRegistry.js";
+import { IfcModelLoader } from "./model-loading/loaders/IfcModelLoader.js";
+import { FbxModelLoader } from "./model-loading/loaders/FbxModelLoader.js";
+import { GltfModelLoader } from "./model-loading/loaders/GltfModelLoader.js";
+import { ObjModelLoader } from "./model-loading/loaders/ObjModelLoader.js";
+import { TdsModelLoader } from "./model-loading/loaders/TdsModelLoader.js";
+import { StlModelLoader } from "./model-loading/loaders/StlModelLoader.js";
+import { DaeModelLoader } from "./model-loading/loaders/DaeModelLoader.js";
 import './style.css';
 
 
@@ -23,6 +31,8 @@ export class IfcViewer {
    * @param {HTMLElement|string} options.container - Контейнер для рендера (элемент или селектор)
    * @param {string} [options.ifcUrl] - URL для загрузки IFC файла
    * @param {File} [options.ifcFile] - File объект для загрузки IFC файла
+   * @param {string} [options.modelUrl] - URL для загрузки модели (любой поддерживаемый формат)
+   * @param {File} [options.modelFile] - File объект модели (любой поддерживаемый формат)
    * @param {string} [options.wasmUrl] - URL для загрузки WASM файла web-ifc
    * @param {boolean} [options.useTestPreset=true] - Включать ли пресет "Тест" по умолчанию (рекомендованные тени/визуал)
    * @param {boolean} [options.showSidebar=false] - Показывать ли боковую панель с деревом
@@ -51,6 +61,9 @@ export class IfcViewer {
     this.options = {
       ifcUrl: options.ifcUrl || null,
       ifcFile: options.ifcFile || null,
+      // Универсальные поля для будущих форматов (не ломают обратную совместимость)
+      modelUrl: options.modelUrl || null,
+      modelFile: options.modelFile || null,
       wasmUrl: options.wasmUrl || null,
       // По умолчанию включаем пресет "Тест" для корректного вида теней (как в демо-настройках)
       useTestPreset: options.useTestPreset !== false,
@@ -66,8 +79,12 @@ export class IfcViewer {
     this.viewer = null;
     this.ifcService = null;
     this.ifcTreeView = null;
+    /** @type {ModelLoaderRegistry|null} */
+    this.modelLoaders = null;
     this.isInitialized = false;
     this.currentModel = null;
+    this.currentLoadResult = null;
+    this.currentCapabilities = null;
 
     // DOM элементы интерфейса
     this.elements = {
@@ -115,6 +132,7 @@ export class IfcViewer {
       // Инициализируем компоненты
       this._initViewer();
       this._initIfcService();
+      this._initModelLoaders();
       this._initTreeView();
 
       // Применяем дефолтный пресет пакета (полностью независим от index.html)
@@ -157,16 +175,22 @@ export class IfcViewer {
    * @returns {Promise<Object|null>} - Загруженная модель или null при ошибке
    */
   async loadModel(source) {
-    if (!this.ifcService) {
+    if (!this.viewer) {
       throw new Error('IfcViewer: не инициализирован. Вызовите init() сначала');
     }
+    if (!this.modelLoaders) this._initModelLoaders();
 
     try {
-      let model = null;
-      const loadSource = source || this.options.ifcUrl || this.options.ifcFile;
+      let result = null;
+      const loadSource =
+        source ||
+        this.options.modelUrl ||
+        this.options.modelFile ||
+        this.options.ifcUrl ||
+        this.options.ifcFile;
       
       if (!loadSource) {
-        throw new Error('Не указан источник IFC модели');
+        throw new Error('Не указан источник модели');
       }
 
       // Показываем прелоадер если есть
@@ -174,18 +198,42 @@ export class IfcViewer {
 
       // Загружаем модель в зависимости от типа источника
       if (typeof loadSource === 'string') {
-        model = await this.ifcService.loadUrl(loadSource);
+        result = await this.modelLoaders.loadUrl(loadSource, {
+          viewer: this.viewer,
+          wasmUrl: this.options.wasmUrl,
+          logger: console,
+        });
+      } else if (Array.isArray(loadSource) || (typeof FileList !== 'undefined' && loadSource instanceof FileList)) {
+        const files = Array.from(loadSource).filter(Boolean);
+        result = (files.length > 1)
+          ? await this.modelLoaders.loadFiles(files, {
+            viewer: this.viewer,
+            wasmUrl: this.options.wasmUrl,
+            logger: console,
+          })
+          : await this.modelLoaders.loadFile(files[0], {
+            viewer: this.viewer,
+            wasmUrl: this.options.wasmUrl,
+            logger: console,
+          });
       } else if (loadSource instanceof File) {
-        model = await this.ifcService.loadFile(loadSource);
+        result = await this.modelLoaders.loadFile(loadSource, {
+          viewer: this.viewer,
+          wasmUrl: this.options.wasmUrl,
+          logger: console,
+        });
       } else {
         throw new Error('Неподдерживаемый тип источника модели');
       }
 
-      if (model) {
-        this.currentModel = model;
+      if (result?.object3D) {
+        this.currentLoadResult = result;
+        this.currentCapabilities = result.capabilities || null;
+        this.currentModel = result.object3D;
+        this._syncIfcOnlyControls();
         
         // Обновляем дерево структуры
-        await this._updateTreeView(model);
+        await this._updateTreeView(result.object3D);
         
         // Обновляем информационную панель
         this._updateInfoPanel();
@@ -196,11 +244,11 @@ export class IfcViewer {
         }
         
         // Диспетчируем событие загрузки модели
-        this._dispatchEvent('model-loaded', { model, viewer: this });
+        this._dispatchEvent('model-loaded', { model: result.object3D, result, viewer: this });
       }
 
       this._hidePreloader();
-      return model;
+      return result?.object3D || null;
 
     } catch (error) {
       console.error('IfcViewer: ошибка загрузки модели', error);
@@ -210,6 +258,21 @@ export class IfcViewer {
     }
   }
 
+  /**
+   * Включает/выключает IFC-специфичные контролы (изоляция/дерево).
+   * @private
+   */
+  _syncIfcOnlyControls() {
+    const isIfc = this.currentCapabilities?.kind === 'ifc' && !!this.currentCapabilities?.ifcService;
+    try {
+      const isolateToggle = this.containerElement.querySelector('#ifcIsolateToggle');
+      if (isolateToggle) {
+        isolateToggle.disabled = !isIfc;
+        if (!isIfc) isolateToggle.checked = false;
+      }
+    } catch (_) {}
+  }
+
   /**
    * Освобождает ресурсы и очищает интерфейс
    */
@@ -255,8 +318,10 @@ export class IfcViewer {
    * @returns {Object|null} Информация о модели или null
    */
   getModelInfo() {
-    if (!this.ifcService) return null;
-    return this.ifcService.getLastInfo();
+    const ifcSvc = (this.currentCapabilities?.kind === 'ifc') ? this.currentCapabilities?.ifcService : null;
+    if (ifcSvc) return ifcSvc.getLastInfo();
+    if (!this.currentLoadResult) return null;
+    return { name: this.currentLoadResult.name || '', modelID: '', format: this.currentLoadResult.format || '' };
   }
 
   /**
@@ -314,6 +379,8 @@ export class IfcViewer {
         <div id="ifcToolbar" class="d-flex px-4" style="border:0px red solid; width: 350px; position: absolute; z-index: 60; justify-content:space-between;  bottom: 10px; left: calc(50% - 175px); ">
           
           <div class="navbar-end flex gap-2">                   
+            <!-- Загрузка модели -->
+            <button class="btn btn-sm" id="ifcUploadBtnTop" title="Загрузить модель">📁</button>
             
             <!-- Стили отображения -->
             <div class="join">
@@ -391,6 +458,9 @@ export class IfcViewer {
 
         <!-- Панель зума (будет создана Viewer'ом) -->
         <div id="ifcZoomPanel" class="absolute bottom-4 right-4 z-30"></div>
+
+        <!-- File input (скрыт): accept выставляется реестром загрузчиков -->
+        <input id="ifcFileInput" type="file" class="hidden" />
       </div>
     `;
 
@@ -440,6 +510,33 @@ export class IfcViewer {
     this.ifcService.init();
   }
 
+  /**
+   * Инициализирует реестр загрузчиков форматов (IFC/FBX/...)
+   * Добавляйте новые форматы через this.modelLoaders.register(new XxxModelLoader()).
+   * @private
+   */
+  _initModelLoaders() {
+    // Если по какой-то причине init вызывается повторно — не пересоздаём
+    if (this.modelLoaders) return;
+    this.modelLoaders = new ModelLoaderRegistry()
+      .register(new IfcModelLoader(this.ifcService))
+      .register(new FbxModelLoader())
+      .register(new GltfModelLoader())
+      .register(new ObjModelLoader())
+      .register(new TdsModelLoader())
+      .register(new StlModelLoader())
+      .register(new DaeModelLoader());
+
+    // Если в интерфейсе есть file input — настроим accept
+    try {
+      const input = this.containerElement.querySelector('#ifcFileInput');
+      if (input) {
+        input.accept = this.modelLoaders.getAcceptString();
+        input.multiple = true;
+      }
+    } catch (_) {}
+  }
+
   /**
    * Инициализирует компонент дерева IFC
    * @private
@@ -451,10 +548,10 @@ export class IfcViewer {
       
       // Настраиваем обработчик выбора узла
       this.ifcTreeView.onSelect(async (node) => {
-        if (this.ifcService) {
-          const ids = this.ifcService.collectElementIDsFromStructure(node);
-          await this.ifcService.highlightByIds(ids);
-        }
+        const ifcSvc = (this.currentCapabilities?.kind === 'ifc') ? this.currentCapabilities?.ifcService : null;
+        if (!ifcSvc) return;
+        const ids = ifcSvc.collectElementIDsFromStructure(node);
+        await ifcSvc.highlightByIds(ids);
       });
     }
   }
@@ -480,17 +577,20 @@ export class IfcViewer {
     });
 
     this._addEventListener('#ifcFileInput', 'change', async (e) => {
-      const file = e.target.files?.[0];
-      if (file) {
-        await this.loadModel(file);
+      const files = e.target.files;
+      if (files && files.length) {
+        await this.loadModel(files); // FileList (multi-file supported)
         e.target.value = ''; // Очистка input
       }
     });
 
     // Переключатель изоляции
     this._addEventListener('#ifcIsolateToggle', 'change', (e) => {
-      if (this.ifcService) {
-        this.ifcService.setIsolateMode(e.target.checked);
+      const ifcSvc = (this.currentCapabilities?.kind === 'ifc') ? this.currentCapabilities?.ifcService : null;
+      if (ifcSvc) {
+        ifcSvc.setIsolateMode(e.target.checked);
+      } else {
+        e.target.checked = false;
       }
     });
 
@@ -564,10 +664,16 @@ export class IfcViewer {
    * @private
    */
   async _updateTreeView(model) {
-    if (!this.ifcTreeView || !this.ifcService || !model) return;
+    if (!this.ifcTreeView) return;
+    const ifcSvc = (this.currentCapabilities?.kind === 'ifc') ? this.currentCapabilities?.ifcService : null;
+    if (!ifcSvc || !model) {
+      // Не-IFC: дерево структуры недоступно
+      try { this.ifcTreeView.render(null); } catch (_) {}
+      return;
+    }
 
     try {
-      const structure = await this.ifcService.getSpatialStructure(model.modelID);
+      const structure = await ifcSvc.getSpatialStructure(model.modelID);
       if (structure) {
         this.ifcTreeView.render(structure);
       }
@@ -582,14 +688,34 @@ export class IfcViewer {
    */
   _updateInfoPanel() {
     const infoElement = this.containerElement.querySelector('#ifcInfo');
-    if (!infoElement || !this.ifcService) return;
+    if (!infoElement) return;
+
+    const ifcSvc = (this.currentCapabilities?.kind === 'ifc') ? this.currentCapabilities?.ifcService : null;
+    if (ifcSvc) {
+      const info = ifcSvc.getLastInfo();
+      infoElement.innerHTML = `
+        <div class="flex items-center justify-between">
+          <div>
+            <div class="font-medium text-xs">${info.name || '—'}</div>
+            <div class="opacity-70">modelID: ${info.modelID || '—'}</div>
+          </div>
+        </div>
+      `;
+      return;
+    }
 
-    const info = this.ifcService.getLastInfo();
+    const name = this.currentLoadResult?.name || '—';
+    const format = this.currentLoadResult?.format || '—';
+    const missing = Array.isArray(this.currentLoadResult?.capabilities?.missingAssets) ? this.currentLoadResult.capabilities.missingAssets : [];
+    const missingHtml = missing.length
+      ? `<div class="opacity-70 mt-1">missing: ${missing.slice(0, 10).map((x) => String(x)).join(', ')}${missing.length > 10 ? '…' : ''}</div>`
+      : '';
     infoElement.innerHTML = `
       <div class="flex items-center justify-between">
         <div>
-          <div class="font-medium text-xs">${info.name || '—'}</div>
-          <div class="opacity-70">modelID: ${info.modelID || '—'}</div>
+          <div class="font-medium text-xs">${name}</div>
+          <div class="opacity-70">format: ${format}</div>
+          ${missingHtml}
         </div>
       </div>
     `;

package/src/ifc/IfcService.js

@@ -289,7 +289,6 @@ export class IfcService {
         const model = await this._loadModelWithFallback(url);
         // Показать модель вместо демо-куба
         if (this.viewer.replaceWithModel) this.viewer.replaceWithModel(model);
-        if (this.viewer.focusObject) this.viewer.focusObject(model);
         this.lastModel = model;
         this.lastFileName = file?.name || null;
         // Сообщим, что модель загружена
@@ -318,7 +317,6 @@ export class IfcService {
       if (!model || !model.geometry) throw new Error('IFC model returned without geometry');
       
       if (this.viewer.replaceWithModel) this.viewer.replaceWithModel(model);
-      if (this.viewer.focusObject) this.viewer.focusObject(model);
       this.lastModel = model;
       
       try {

package/src/index.js

@@ -12,3 +12,13 @@ export { IfcViewer } from "./IfcViewer.js";
 export { Viewer } from "./viewer/Viewer.js";
 export { IfcService } from "./ifc/IfcService.js";
 export { IfcTreeView } from "./ifc/IfcTreeView.js";
+
+// Расширяемая архитектура загрузчиков форматов
+export { ModelLoaderRegistry } from "./model-loading/ModelLoaderRegistry.js";
+export { IfcModelLoader } from "./model-loading/loaders/IfcModelLoader.js";
+export { FbxModelLoader } from "./model-loading/loaders/FbxModelLoader.js";
+export { GltfModelLoader } from "./model-loading/loaders/GltfModelLoader.js";
+export { ObjModelLoader } from "./model-loading/loaders/ObjModelLoader.js";
+export { TdsModelLoader } from "./model-loading/loaders/TdsModelLoader.js";
+export { StlModelLoader } from "./model-loading/loaders/StlModelLoader.js";
+export { DaeModelLoader } from "./model-loading/loaders/DaeModelLoader.js";

package/src/main.js

@@ -2,6 +2,14 @@ import "./style.css";
 import { Viewer } from "./viewer/Viewer.js";
 import { IfcService } from "./ifc/IfcService.js";
 import { IfcTreeView } from "./ifc/IfcTreeView.js";
+import { ModelLoaderRegistry } from "./model-loading/ModelLoaderRegistry.js";
+import { IfcModelLoader } from "./model-loading/loaders/IfcModelLoader.js";
+import { FbxModelLoader } from "./model-loading/loaders/FbxModelLoader.js";
+import { GltfModelLoader } from "./model-loading/loaders/GltfModelLoader.js";
+import { ObjModelLoader } from "./model-loading/loaders/ObjModelLoader.js";
+import { TdsModelLoader } from "./model-loading/loaders/TdsModelLoader.js";
+import { StlModelLoader } from "./model-loading/loaders/StlModelLoader.js";
+import { DaeModelLoader } from "./model-loading/loaders/DaeModelLoader.js";
 
 // Инициализация three.js Viewer в контейнере #app
 const app = document.getElementById("app");
@@ -335,30 +343,82 @@ if (app) {
   const ifcInfoEl = document.getElementById("ifcInfo");
   const ifcTree = ifcTreeEl ? new IfcTreeView(ifcTreeEl) : null;
   const ifcIsolateToggle = document.getElementById("ifcIsolateToggle");
+  /** @type {any|null} */
+  let activeCapabilities = null;
+
+  // Реестр загрузчиков: добавляйте новые форматы через register(new XxxModelLoader())
+  const modelLoaders = new ModelLoaderRegistry()
+    .register(new IfcModelLoader(ifc))
+    .register(new FbxModelLoader())
+    .register(new GltfModelLoader())
+    .register(new ObjModelLoader())
+    .register(new TdsModelLoader())
+    .register(new StlModelLoader())
+    .register(new DaeModelLoader());
 
   const uploadBtn = document.getElementById("uploadBtn");
   const ifcInput = document.getElementById("ifcInput");
   if (uploadBtn && ifcInput) {
+    try { ifcInput.accept = modelLoaders.getAcceptString(); } catch (_) {}
+    try { ifcInput.multiple = true; } catch (_) {}
     uploadBtn.addEventListener("click", () => ifcInput.click());
     ifcInput.addEventListener("change", async (e) => {
-      const file = e.target.files?.[0];
-      if (!file) return;
-      await ifc.loadFile(file);
+      const files = Array.from(e.target.files || []).filter(Boolean);
+      if (!files.length) return;
+      let result = null;
+      try {
+        // Multi-file: e.g. OBJ+MTL (+textures)
+        result = (files.length > 1)
+          ? await modelLoaders.loadFiles(files, { viewer, wasmUrl: wasmOverride, logger: console })
+          : await modelLoaders.loadFile(files[0], { viewer, wasmUrl: wasmOverride, logger: console });
+        activeCapabilities = result?.capabilities || null;
+      } catch (err) {
+        console.error('Model load error', err);
+        activeCapabilities = null;
+      }
       ifcInput.value = "";
-      // Обновим дерево IFC и инфо
-      const last = ifc.getLastInfo();
-      const struct = await ifc.getSpatialStructure(last.modelID ? Number(last.modelID) : undefined);
-      if (!struct) console.warn('IFC spatial structure not available for modelID', last?.modelID);
-      if (ifcTree) ifcTree.render(struct);
-      if (ifcInfoEl) {
-        const info = ifc.getLastInfo();
-        ifcInfoEl.innerHTML = `
-          <div class="flex items-center justify-between">
-            <div>
-              <div class="font-medium text-xs">${info.name || '—'}</div>
-              <div class="opacity-70">modelID: ${info.modelID || '—'}</div>
-            </div>
-          </div>`;
+
+      // Обновим панель: IFC дерево/инфо только для IFC
+      if (activeCapabilities?.kind === 'ifc' && activeCapabilities?.ifcService) {
+        const ifcSvc = activeCapabilities.ifcService;
+        const last = ifcSvc.getLastInfo();
+        const struct = await ifcSvc.getSpatialStructure(last.modelID ? Number(last.modelID) : undefined);
+        if (!struct) console.warn('IFC spatial structure not available for modelID', last?.modelID);
+        if (ifcTree) ifcTree.render(struct);
+        if (ifcInfoEl) {
+          const info = ifcSvc.getLastInfo();
+          ifcInfoEl.innerHTML = `
+            <div class="flex items-center justify-between">
+              <div>
+                <div class="font-medium text-xs">${info.name || '—'}</div>
+                <div class="opacity-70">modelID: ${info.modelID || '—'}</div>
+              </div>
+            </div>`;
+        }
+        if (ifcIsolateToggle) ifcIsolateToggle.disabled = false;
+      } else {
+        // Не-IFC: очищаем дерево, показываем базовую инфу
+        if (ifcTree) ifcTree.render(null);
+        if (ifcInfoEl) {
+          const name = result?.name || files[0]?.name || '—';
+          const format = result?.format || '—';
+          const missing = Array.isArray(result?.capabilities?.missingAssets) ? result.capabilities.missingAssets : [];
+          const missingHtml = missing.length
+            ? `<div class="mt-1 opacity-70">missing: ${missing.slice(0, 10).map((x) => String(x)).join(', ')}${missing.length > 10 ? '…' : ''}</div>`
+            : '';
+          ifcInfoEl.innerHTML = `
+            <div class="flex items-center justify-between">
+              <div>
+                <div class="font-medium text-xs">${name}</div>
+                <div class="opacity-70">format: ${format}</div>
+                ${missingHtml}
+              </div>
+            </div>`;
+        }
+        if (ifcIsolateToggle) {
+          ifcIsolateToggle.checked = false;
+          ifcIsolateToggle.disabled = true;
+        }
       }
       // Авто-открытие панели при ручной загрузке
       setSidebarVisible(true);
@@ -522,14 +582,21 @@ if (app) {
   // Переключатель изоляции
   ifcIsolateToggle?.addEventListener("change", (e) => {
     const enabled = e.target.checked;
-    ifc.setIsolateMode(enabled);
+    if (activeCapabilities?.kind === 'ifc' && activeCapabilities?.ifcService) {
+      activeCapabilities.ifcService.setIsolateMode(enabled);
+    } else {
+      // для не-IFC изоляция недоступна
+      e.target.checked = false;
+    }
   });
 
   // Выбор узла в дереве → подсветка/изоляция
   if (ifcTree) {
     ifcTree.onSelect(async (node) => {
-      const ids = ifc.collectElementIDsFromStructure(node);
-      await ifc.highlightByIds(ids);
+      if (activeCapabilities?.kind !== 'ifc' || !activeCapabilities?.ifcService) return;
+      const ifcSvc = activeCapabilities.ifcService;
+      const ids = ifcSvc.collectElementIDsFromStructure(node);
+      await ifcSvc.highlightByIds(ids);
     });
   }
 
@@ -544,19 +611,41 @@ if (app) {
     const params = new URLSearchParams(location.search);
     const ifcUrlParam = params.get('ifc');
     const ifcUrl = ifcUrlParam || DEFAULT_IFC_URL;
-    const model = await ifc.loadUrl(encodeURI(ifcUrl));
-    if (model) {
-      const struct = await ifc.getSpatialStructure();
-      if (ifcTree) ifcTree.render(struct);
-      if (ifcInfoEl) {
-        const info = ifc.getLastInfo();
-        ifcInfoEl.innerHTML = `
-          <div class="flex items-center justify-between">
-            <div>
-              <div class="font-medium text-xs">${info.name || '—'}</div>
-              <div class="opacity-70">modelID: ${info.modelID || '—'}</div>
-            </div>
-          </div>`;
+    const result = await modelLoaders.loadUrl(encodeURI(ifcUrl), { viewer, wasmUrl: wasmOverride, logger: console });
+    activeCapabilities = result?.capabilities || null;
+    if (result?.object3D) {
+      if (activeCapabilities?.kind === 'ifc' && activeCapabilities?.ifcService) {
+        const ifcSvc = activeCapabilities.ifcService;
+        const struct = await ifcSvc.getSpatialStructure();
+        if (ifcTree) ifcTree.render(struct);
+        if (ifcInfoEl) {
+          const info = ifcSvc.getLastInfo();
+          ifcInfoEl.innerHTML = `
+            <div class="flex items-center justify-between">
+              <div>
+                <div class="font-medium text-xs">${info.name || '—'}</div>
+                <div class="opacity-70">modelID: ${info.modelID || '—'}</div>
+              </div>
+            </div>`;
+        }
+        if (ifcIsolateToggle) ifcIsolateToggle.disabled = false;
+      } else {
+        if (ifcTree) ifcTree.render(null);
+        if (ifcInfoEl) {
+          const name = result?.name || '—';
+          const format = result?.format || '—';
+          ifcInfoEl.innerHTML = `
+            <div class="flex items-center justify-between">
+              <div>
+                <div class="font-medium text-xs">${name}</div>
+                <div class="opacity-70">format: ${format}</div>
+              </div>
+            </div>`;
+        }
+        if (ifcIsolateToggle) {
+          ifcIsolateToggle.checked = false;
+          ifcIsolateToggle.disabled = true;
+        }
       }
       // Не открываем панель автоматически при автозагрузке
       hidePreloader();