36 lines
1.0 KiB
TypeScript
36 lines
1.0 KiB
TypeScript
/**
|
|
* 모든 모달의 공통 기능 (닫기, ESC 처리, 배경 클릭 등)을 관리하는 베이스 모듈입니다.
|
|
*/
|
|
export function initBaseModal() {
|
|
const closeAllModals = () => {
|
|
const modals = document.querySelectorAll('.modal-overlay');
|
|
modals.forEach(modal => modal.classList.add('hidden'));
|
|
};
|
|
|
|
// ESC 키로 닫기
|
|
window.addEventListener('keydown', (e) => {
|
|
if (e.key === 'Escape') closeAllModals();
|
|
});
|
|
|
|
// 배경(Overlay) 클릭 시 닫기 (동적 생성된 모달 대응을 위해 이벤트 위임 고려 가능하나 일단 단순 구현)
|
|
document.addEventListener('click', (e) => {
|
|
const target = e.target as HTMLElement;
|
|
if (target.classList.contains('modal-overlay')) {
|
|
closeAllModals();
|
|
}
|
|
});
|
|
|
|
return { closeAllModals };
|
|
}
|
|
|
|
/**
|
|
* 특정 모달을 엽니다.
|
|
* @param modalId 모달 엘리먼트의 ID
|
|
*/
|
|
export function openModal(modalId: string) {
|
|
const modal = document.getElementById(modalId);
|
|
if (modal) {
|
|
modal.classList.remove('hidden');
|
|
}
|
|
}
|