Кейс-конструктор

Параметричний конструктор кейсів для 3D-друку просто в браузері: задаєте, що має вміститися всередину, обираєте кришку, перегородки й кріплення — і отримуєте ZIP зі STL-файлами, уже покладеними на стіл для друку, та переліком того, що докупити.

Відкрити: village-elder.github.io/case_generator_3d

Застосунок повністю клієнтський: бекенду немає, геометрія рахується у веб-воркері (manifold-3d, WASM), прев'ю — three.js, STL і ZIP збираються в браузері. Конфігурація живе в посиланні — ним можна поділитися.

Можливості

Корпус

• Три типи: звичайний, посилений (тонкі ребра жорсткості) і захищений — як кейс-валіза: пояс по стику з ущільненням паз-гребінь і ребра врівень із ним.
• Задаються внутрішні розміри (20…330 × 20…320 × 10…325 мм), товщини стінок і дна; ребра — автоматично або вручну.

Кришка

• Накладна на фальці, на друкованих завісах, на завісах із болтами (кількість і крок), висувна в пазах, насувна по напрямній, без кришки (кейси ставляться один на одний).
• Магніти в кутах, ручка на кришці — статична або складна (ховається в нішу).

Всередині

• Перегородки: фіксовані, знімні, решітка з планок, вкладиші-коробочки (на сітці по дну або окремій сітці-підкладці); редактор сітки з об'єднанням комірок, скруглене дно, дублювання перегородок у кришці.
• Знімний лоток зі своєю сіткою.
• Стійки під плату (до 4 плат, саморіз або термовставка).

Зовні

• Защіпки — відкидні або з гачком, на будь-яких сторонах, кількість і відстань між ними.
• Бічні ручки — статичні або складні, на будь-яких сторонах.
• Вушка для кріплення на стіну, отвори в дні (кейс прикручується зсередини), отвори для рук, виріз у стінці, перфорація (круги, шестикутники, щілини).

Друк і перевірки

• Друк без підтримок: скоси замість нависань, фаски по краях на столі, деталі в ZIP уже орієнтовані.
• Попередження про конфлікти й межі (що не вміщається, що налазить одне на одне); деталь у конфлікті не будується, доки його не виправлено.
• «Комплект»: що друкувати й що докупити (магніти, болти, гайки, термовставки) — і в панелі, і файлом комплект.txt в архіві.
• 12 шаблонів для старту: органайзер, кейс із лотком, корпуси для Raspberry Pi та ESP32, ящик для інструментів, захищені кейси тощо.

Як користуватися

1. Оберіть шаблон або «Свій кейс» (тип і внутрішні розміри).
2. Налаштуйте кришку, перегородки, кріплення й ручки на вкладках панелі — прев'ю оновлюється одразу; кришку можна відкрити, деталі — рознести.
3. Перегляньте попередження й «Комплект».
4. «Поділитися» копіює посилання з усією конфігурацією.
5. «Завантажити STL» — ZIP: кожна деталь окремим файлом, покладена для друку, плюс комплект.txt.

Поради щодо друку — у docs/PRINTING_RULES.md.

Посилання з параметрами

Уся конфігурація — один параметр ?c=<hex>: компактний двійковий запис із CRC, тож пошкоджене посилання не відкриє іншу модель. Формат розширюється без ламання збережених посилань (нові поля дописуються в кінець запису й у старих посиланнях беруться типовими). Опис полів і бітів — docs/URL_CODEC.md.

Розробка

Потрібен Node.js 20.19+ (у CI — 22).

npm install
npm run dev            # http://localhost:5173
npm test               # Vitest: параметри, посилання, STL/ZIP, геометрія на справжньому WASM
npm run typecheck
npm run build          # → dist/

Допоміжні команди:

• npm run docs:codec — перегенерувати docs/URL_CODEC.md з реєстру полів посилання.
• UPDATE_SNAPSHOT=1 npx vitest run tests/snapshot.test.ts — оновити еталон геометрії (tests/fixtures/geometry-snapshot.json) після навмисної зміни моделі.

Архітектура

src/
├── main.ts              стан застосунку: панель ↔ воркер ↔ прев'ю ↔ URL
├── model/               чиста логіка без DOM
│   ├── schema.ts        параметри, межі, типові значення, технологічні константи
│   ├── derive/          нормалізація параметрів і розкладка (deriveGeometry), сумісність, попередження
│   ├── build/           побудова геометрії manifold-3d (buildCase) — крок за елементом
│   ├── codec.ts         посилання ?c=…
│   ├── templates.ts     шаблони «Новий кейс»
│   ├── bom.ts           «Комплект»
│   └── export.ts, stl.ts  прев'ю й ZIP зі STL
├── worker.ts            веб-воркер: WASM, прев'ю й експорт поза UI-потоком
├── preview.ts, preview/ three.js: сцена, рознесення, покупне кріплення
└── ui/                  панель параметрів, редактор сітки, діалоги, мобільна шторка
tests/                   Vitest

WASM передається в модель аргументом, тому той самий код працює і у воркері, і в тестах під Node.

Деплой

.github/workflows/deploy.yml на кожен push у main перевіряє типи, запускає тести, збирає проєкт і публікує dist/ на GitHub Pages (один раз: Settings → Pages → Source: GitHub Actions). base: "./" у vite.config.ts робить збірку незалежною від шляху.

Ліцензія

MIT, див. LICENSE.