@sequent-org/ifc-viewer 1.0.3-ci.6.0 → 1.0.3-ci.7.0

package/README.md

@@ -43,7 +43,8 @@ function showIfcModal(ifcUrl) {
   
   const viewer = new IfcViewer({
     container: container,
-    ifcUrl: ifcUrl
+    ifcUrl: ifcUrl,
+    wasmUrl: '/storage/web-ifc.wasm'  // Путь к WASM в Laravel storage
     // Минимальный режим по умолчанию - только просмотрщик с верхней панелью
   })
   
@@ -53,6 +54,28 @@ function showIfcModal(ifcUrl) {
 }
 ```
 
+**Настройка WASM файла в Laravel:**
+
+1. Скопируйте `web-ifc.wasm` в папку `public/storage/`:
+```bash
+cp node_modules/web-ifc/web-ifc.wasm public/storage/
+```
+
+2. Или используйте символическую ссылку:
+```bash
+php artisan storage:link
+# Затем скопируйте файл в storage/app/public/
+```
+
+3. Альтернативно, укажите путь к файлу в `node_modules`:
+```javascript
+const viewer = new IfcViewer({
+  container: container,
+  ifcUrl: ifcUrl,
+  wasmUrl: '/node_modules/web-ifc/web-ifc.wasm'
+})
+```
+
 ### Загрузка пользовательского файла
 
 ```javascript
@@ -74,6 +97,18 @@ fileInput.addEventListener('change', async (e) => {
 })
 ```
 
+### Кастомный путь к WASM файлу
+
+```javascript
+const viewer = new IfcViewer({
+  container: '#viewer-container',
+  ifcUrl: '/models/building.ifc',
+  wasmUrl: '/custom-path/web-ifc.wasm'  // Указываем свой путь к WASM
+})
+
+await viewer.init()
+```
+
 ## ⚙️ Опции конфигурации
 
 | Опция | Тип | По умолчанию | Описание |
@@ -81,12 +116,52 @@ fileInput.addEventListener('change', async (e) => {
 | `container` | `HTMLElement \| string` | **обязательно** | DOM элемент или селектор для контейнера |
 | `ifcUrl` | `string` | `null` | URL для загрузки IFC файла |
 | `ifcFile` | `File` | `null` | File объект для загрузки |
+| `wasmUrl` | `string` | `null` | URL для загрузки WASM файла web-ifc |
 | `showSidebar` | `boolean` | `false` | Показывать боковую панель с деревом |
 | `showControls` | `boolean` | `false` | Показывать нижние кнопки управления |
 | `showToolbar` | `boolean` | `true` | Показывать верхнюю панель инструментов |
 | `autoLoad` | `boolean` | `true` | Автоматически загружать при инициализации |
 | `theme` | `string` | `'light'` | Тема интерфейса (`'light'` \| `'dark'`) |
 
+### 🔧 Подробное описание параметров
+
+#### `wasmUrl` - Настройка пути к WASM файлу
+
+Параметр `wasmUrl` позволяет указать кастомный путь к WASM файлу библиотеки `web-ifc`. Это особенно полезно при интеграции пакета в проекты с нестандартной структурой ресурсов.
+
+**Особенности:**
+- **По умолчанию**: Если не указан, используется автоматически определяемый путь из папки `public/wasm/`
+- **Поддержка форматов**: Полные URL (`https://example.com/web-ifc.wasm`) и относительные пути (`/assets/web-ifc.wasm`)
+- **Обратная совместимость**: При ошибке загрузки кастомного пути автоматически переключается на дефолтный
+- **Обработка ошибок**: В консоль выводится предупреждение при неудачной настройке кастомного пути
+
+**Примеры использования:**
+
+```javascript
+// Относительный путь
+const viewer1 = new IfcViewer({
+  container: '#viewer',
+  wasmUrl: '/assets/web-ifc.wasm'
+})
+
+// Полный URL
+const viewer2 = new IfcViewer({
+  container: '#viewer', 
+  wasmUrl: 'https://cdn.example.com/web-ifc.wasm'
+})
+
+// Путь с подпапкой
+const viewer3 = new IfcViewer({
+  container: '#viewer',
+  wasmUrl: '/static/libs/web-ifc.wasm'
+})
+```
+
+**Когда использовать:**
+- При размещении WASM файла в нестандартной папке
+- При использовании CDN для статических ресурсов
+- При интеграции в фреймворки с особой структурой ресурсов (Laravel, Next.js и т.д.)
+
 ## 🎯 API методы
 
 ### Основные методы
@@ -196,11 +271,56 @@ npm run test:manual
 - `.ifczip` - архивы IFC
 - `.zip` - ZIP архивы с IFC файлами
 
+## 🔧 Troubleshooting
+
+### Проблемы с WASM файлом
+
+**Ошибка загрузки WASM:**
+```
+Failed to load web-ifc.wasm
+```
+
+**Решения:**
+1. **Проверьте путь к файлу:**
+   ```javascript
+   // Убедитесь, что файл доступен по указанному пути
+   const viewer = new IfcViewer({
+     container: '#viewer',
+     wasmUrl: '/correct-path/web-ifc.wasm'
+   })
+   ```
+
+2. **Проверьте CORS настройки:**
+   - Для локальной разработки используйте относительные пути
+   - Для продакшена настройте CORS для WASM файлов
+
+3. **Проверьте MIME-тип:**
+   ```nginx
+   # В nginx.conf
+   location ~* \.wasm$ {
+       add_header Content-Type application/wasm;
+   }
+   ```
+
+4. **Альтернативные пути:**
+   ```javascript
+   // Попробуйте разные варианты
+   wasmUrl: '/web-ifc.wasm'           // корень
+   wasmUrl: '/assets/web-ifc.wasm'   // папка assets
+   wasmUrl: '/static/web-ifc.wasm'   // папка static
+   ```
+
+**Отладка:**
+- Откройте DevTools → Network и проверьте загрузку WASM файла
+- Проверьте консоль на предупреждения о `wasmUrl`
+- Убедитесь, что файл `web-ifc.wasm` существует и доступен
+
 ## 🔧 Системные требования
 
 - Node.js >= 16
-- Современный браузер с поддержкой WebGL
+- Современный браузер с поддержкой WebGL и WebAssembly
 - Для работы требуются файлы `web-ifc.wasm` в публичной папке проекта
+- Поддержка ES6 модулей в браузере
 
 ## 📄 Лицензия
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sequent-org/ifc-viewer",
   "private": false,
-  "version": "1.0.3-ci.6.0",
+  "version": "1.0.3-ci.7.0",
   "type": "module",
   "description": "IFC 3D model viewer component for web applications",
   "main": "src/index.js",

package/src/IfcViewer.js

@@ -21,6 +21,7 @@ export class IfcViewer {
    * @param {HTMLElement|string} options.container - Контейнер для рендера (элемент или селектор)
    * @param {string} [options.ifcUrl] - URL для загрузки IFC файла
    * @param {File} [options.ifcFile] - File объект для загрузки IFC файла
+   * @param {string} [options.wasmUrl] - URL для загрузки WASM файла web-ifc
    * @param {boolean} [options.showSidebar=false] - Показывать ли боковую панель с деревом
    * @param {boolean} [options.showControls=false] - Показывать ли панель управления (нижние кнопки)
    * @param {boolean} [options.showToolbar=true] - Показывать ли верхнюю панель инструментов
@@ -47,8 +48,9 @@ export class IfcViewer {
     this.options = {
       ifcUrl: options.ifcUrl || null,
       ifcFile: options.ifcFile || null,
+      wasmUrl: options.wasmUrl || null,
       showSidebar: options.showSidebar === true, // по умолчанию false
-      showControls: options.showControls === true, // по умолчанию false  
+      showControls: options.showControls === true, // по умолчанию false
       showToolbar: options.showToolbar !== false, // по умолчанию true
       autoLoad: options.autoLoad !== false,
       theme: options.theme || 'light',
@@ -430,7 +432,7 @@ export class IfcViewer {
       throw new Error('Viewer должен быть инициализирован перед IfcService');
     }
 
-    this.ifcService = new IfcService(this.viewer);
+    this.ifcService = new IfcService(this.viewer, this.options.wasmUrl);
     this.ifcService.init();
   }
 

package/src/ifc/IfcService.js

@@ -12,9 +12,11 @@ import IFCWorkerUrl from 'web-ifc-three/IFCWorker.js?url';
 export class IfcService {
   /**
    * @param {import('../viewer/Viewer').Viewer} viewer
+   * @param {string} [wasmUrl] - URL для загрузки WASM файла web-ifc
    */
-  constructor(viewer) {
+  constructor(viewer, wasmUrl = null) {
     this.viewer = viewer;
+    this.wasmUrl = wasmUrl;
     this.loader = null;
     this.lastModel = null; // THREE.Object3D модели IFC
     this.lastFileName = null;
@@ -27,15 +29,19 @@ export class IfcService {
     this.loader = new IFCLoader();
     // Отключаем Web Worker: временно парсим в главном потоке для стабильности
     try { this.loader.ifcManager.useWebWorkers?.(false); } catch(_) {}
-    // Путь к wasm файлу (скопируйте web-ifc.wasm в public/wasm)
-    try {
-      // Преобразуем URL файла wasm в URL каталога и передадим в воркер
-      const wasmDir = new URL('.', WEBIFC_WASM_URL).href;
-      this.loader.ifcManager.setWasmPath(wasmDir);
-      // Дополнительно подстрахуемся передачей полного файла, если версия это поддерживает
-      try { this.loader.ifcManager.setWasmPath(WEBIFC_WASM_URL); } catch(_) {}
-    } catch (_) {
-      this.loader.ifcManager.setWasmPath('/wasm/');
+    
+    // Настройка пути к WASM файлу
+    if (this.wasmUrl) {
+      // Используем переданный пользователем URL
+      try {
+        this.loader.ifcManager.setWasmPath(this.wasmUrl);
+      } catch (_) {
+        console.warn('IfcService: не удалось установить пользовательский wasmUrl:', this.wasmUrl);
+        this._setDefaultWasmPath();
+      }
+    } else {
+      // Используем путь по умолчанию
+      this._setDefaultWasmPath();
     }
     try {
       this.loader.ifcManager.applyWebIfcConfig?.({
@@ -48,6 +54,22 @@ export class IfcService {
     } catch(_) {}
   }
 
+  /**
+   * Устанавливает путь к WASM файлу по умолчанию
+   * @private
+   */
+  _setDefaultWasmPath() {
+    try {
+      // Преобразуем URL файла wasm в URL каталога и передадим в воркер
+      const wasmDir = new URL('.', WEBIFC_WASM_URL).href;
+      this.loader.ifcManager.setWasmPath(wasmDir);
+      // Дополнительно подстрахуемся передачей полного файла, если версия это поддерживает
+      try { this.loader.ifcManager.setWasmPath(WEBIFC_WASM_URL); } catch(_) {}
+    } catch (_) {
+      this.loader.ifcManager.setWasmPath('/wasm/');
+    }
+  }
+
   /**
    * Возвращает пространственную структуру IFC (иерархия) для активной модели
    * Структура: { expressID, type, children: [...] }