Files
Aislo/A00_Common/main.ts
T
eomsangdonandClaude Opus 5.5 90a2cb9a11 refactor(B05·B06): 한 페이지 뼈대 — 주소 둘이 같은 페이지(design_page) · 같은 페이지 안 이동은 보기만 바꿈 · 떠날 때 3D · 종단도 · 횡단 정리 · 숨긴 3D 그리기 멈춤 · 창 키 듣기 뗌 · 뷰어 나눔(771→541)
- 라우터: 여러 주소 페이지(MountedPage) 길 · 같은 페이지면 셸도 다시 안 그림 · 떠나면 dispose · 늦게 끝난 옛 렌더 버림
- design_page: 보기 약속 DesignPageView(mount 중간 단계 · mountCenter 끝 모습 + shared 한 벌 자리) · host.onShow · onHide · onDispose
- 3D 뷰어: setActive(루프 멈춤 · 창 포인터 뗌) · dispose 가 WebGL 문맥까지 놓음 · 보관 지형은 남김 · 코리도 조각을 Viewer_Corridor 로
- 종단도: setActive(창 키 듣기 뗌 · 보일 때 초안 · 판 다시 읽음)
- 겹친 알약: 같은 측점이면 누른 알약을 그대로(24-6b)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BU9gbNE3aWFUvE61pS2WGt
2026-09-29 21:39:31 +09:00

87 lines
2.6 KiB
TypeScript

/* =============================================================================
* main.ts
* 프론트엔드 애플리케이션 진입점
*
* - 공통 컴포넌트/셸 스타일 주입
* - 테마/언어 복원
* - 앱 셸(헤더/푸터) 렌더 후 라우터 시작
* - hashchange 1회 구독: 셸 chrome 갱신 + 현재 라우트 렌더
* ========================================================================== */
import "./random_uuid_polyfill";
import "@ui/ui_template_theme.css";
import { injectBaseStyles } from "@ui/ui_template_elements";
import { ROUTES, type RoutePath } from "@config/config_frontend";
import { initThemeAndLang, injectShellStyles, renderShell } from "./app_shell";
import {
currentRoute,
renderCurrentRoute,
ensureInitialHash,
setLeaveGuard,
showWithinPage,
takeLeaveGuard,
} from "./router";
const FOOTERLESS_ROUTES: readonly RoutePath[] = [
ROUTES.B01_ACCOUNT,
ROUTES.B02_PROJ_REGISTER,
ROUTES.B03_FILE_INPUT,
ROUTES.B04_PREPROCESS,
ROUTES.B05_PROFILE,
ROUTES.B06_SECTION,
ROUTES.B07_DESIGN_DETAIL,
ROUTES.B08_QUANTITY,
ROUTES.B09_ESTIMATION,
ROUTES.B10_PAYMENT,
ROUTES.B11_STATUS,
ROUTES.M01_MASTER_DATA,
ROUTES.M02_MASTER_TEMPLATE,
];
function bootstrap(): void {
const appRoot = document.getElementById("app");
if (!appRoot) {
throw new Error("[main] #app 루트 요소를 찾을 수 없습니다.");
}
// 1. 스타일 주입 (공통 컴포넌트 + 셸)
injectBaseStyles();
injectShellStyles();
// 2. 테마/언어 복원
initThemeAndLang();
// 3. 셸 렌더 + 현재 라우트 렌더를 함께 수행하는 헬퍼
let shown = "";
let shownHash = "";
const renderAll = (): void => {
const within = showWithinPage(currentRoute()); // B05 ↔ B06 — 보기만 바꿈(24-3a)
shown = currentRoute();
shownHash = window.location.hash;
if (within) return;
const showFooter = !FOOTERLESS_ROUTES.includes(currentRoute());
const outlet = renderShell(appRoot, showFooter); // 헤더/푸터(로그인·언어 반영) 갱신
void renderCurrentRoute(outlet); // 아울렛에 페이지 렌더
};
// 4. hashchange 1회 구독 (리스너 누적 방지)
window.addEventListener("hashchange", () => {
const guard = takeLeaveGuard();
if (!guard || currentRoute() === shown) return renderAll();
void guard().then((ok) => {
if (ok) {
setLeaveGuard(null);
renderAll();
} else {
history.replaceState(null, "", shownHash); // 취소 — 머문 채 주소만 되돌림
}
});
});
// 5. 최초 진입
ensureInitialHash();
renderAll();
}
bootstrap();