Суть проекта
Разработка клиентского веб-приложения (SPA) для парсинга и рендеринга производственных файлов печатных плат (Gerber, Excellon) прямо в браузере пользователя. Главная бизнес-ценность инструмента — автоматизация воронки продаж: скрипт визуализирует плату, извлекает её физические параметры и программно передает их в существующий на сайте калькулятор, а исходный архив бесшовно прикрепляет к форме заявки (Contact Form 7).
Технологический стек и архитектура
• Ядро: WebGL-библиотека GRX (аппаратное ускорение, встроенные Web Workers для тяжелых вычислений).
• Работа с данными: jszip (распаковка архивов в оперативной памяти).
• Сборка: Современные бандлеры (Vite / esbuild).
• Интеграция: Приложение встраивается в WordPress через iframe. Связь с родительской страницей реализуется через Window.postMessage(), а передача файлов в форму — через DataTransfer API.
Ключевой пользовательский сценарий (User Flow)
1. Локальная загрузка: Пользователь перетаскивает .zip архив с проектом в зону вьювера. Файлы не отправляются на сервер, вся обработка происходит в оперативной памяти браузера (соответствие стандартам приватности).
2. Маппинг и валидация: Система автоматически распознает типы слоев, формирует таблицу с возможностью ручной правки и выдает предупреждения об ошибках (например, отсутствие контура платы или файла сверловки).
3. WebGL Отрисовка: Построение интерактивной 2D/3D модели. Реализована цветовая схема с имитацией реальных материалов (зеленая маска, текстолит, золотые площадки ENIG). Доступен зум, панорамирование и зеркальный вид со стороны Bottom.
4. Бесшовная передача данных: При нажатии «Рассчитать стоимость» система вычисляет габариты (по слою Outline), количество слоев меди и минимальный диаметр отверстия (из файлов Excellon). Эти параметры через шину данных передаются в WordPress, где JS-сниппет автоматически заполняет калькулятор и прикрепляет исходный .zip архив к заявке.
Ключевые технические требования и ограничения
• Производительность: Обработка архивов объемом до 100 МБ (до 50 файлов) без "зависания" интерфейса.
• Экспорт: Возможность программного сохранения текущего вида <canvas> в PNG-изображение высокого разрешения (~1200 dpi).
• DOM-манипуляции: Обход ограничений безопасности браузера (CORS и защищенные поля) для программной вставки бинарных файлов проекта в стандартный <input type="file"> плагина Contact Form 7.
Результат работ
Исполнитель предоставляет готовый production-билд SPA, исходный код с инструкцией по локальному развертыванию (README.md), а также интегрирующий JS-сниппет для установки на родительскую страницу WordPress. Приложение должно корректно обрабатывать предоставленный заказчиком эталонный набор тестовых Gerber-архивов.
🏷️ Work_feed
