refactor: app.js를 ES6 모듈로 분리
## 변경사항 - app.js (1370줄) → 7개 모듈 (1427줄) - ES6 import/export 문법 사용 - Alpine.js 호환성 유지 (window 전역 노출) ## 모듈 구조 - js/config.js: 상수/설정 (WIZARD_CONFIG, PRICING_DATA, MOCK_*) - js/api.js: ApiService - js/utils.js: formatPrice, switchTab, ping 시뮬레이션 - js/wizard.js: 서버 추천 마법사 로직 - js/pricing.js: 가격표 컴포넌트 - js/dashboard.js: 대시보드 및 텔레그램 연동 - js/app.js: 메인 통합 (모든 모듈 import) ## HTML 변경 - <script type="module" src="js/app.js">로 변경 - 기존 기능 모두 정상 작동 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
52
js/app.js
Normal file
52
js/app.js
Normal file
@@ -0,0 +1,52 @@
|
||||
/**
|
||||
* Anvil Hosting - Main Application JavaScript
|
||||
* 메인 통합 모듈 (ES6 모듈 방식)
|
||||
*/
|
||||
|
||||
// 모듈 임포트
|
||||
import { TELEGRAM_BOT_URL, PRICING_DATA, MOCK_SERVERS, MOCK_STATS, MOCK_NOTIFICATIONS, WIZARD_CONFIG } from './config.js';
|
||||
import { API_CONFIG, ApiService } from './api.js';
|
||||
import { formatPrice, switchTab, updatePing, startPingUpdates, stopPingUpdates } from './utils.js';
|
||||
import { calculateRecommendation, createWizardMethods } from './wizard.js';
|
||||
import { createDashboardMethods } from './dashboard.js';
|
||||
import { pricingTable } from './pricing.js';
|
||||
|
||||
/**
|
||||
* Alpine.js 메인 앱 데이터 - 대화형 위자드 + 대시보드
|
||||
*/
|
||||
function anvilApp() {
|
||||
// 마법사 메서드와 대시보드 메서드 병합
|
||||
const wizardMethods = createWizardMethods();
|
||||
const dashboardMethods = createDashboardMethods();
|
||||
|
||||
return {
|
||||
...wizardMethods,
|
||||
...dashboardMethods
|
||||
};
|
||||
}
|
||||
|
||||
// 전역 함수로 노출 (Alpine.js x-data에서 사용)
|
||||
window.anvilApp = anvilApp;
|
||||
window.pricingTable = pricingTable;
|
||||
|
||||
// 전역 텔레그램 로그인 콜백 (웹 로그인 위젯용)
|
||||
window.onTelegramAuth = function(user) {
|
||||
// Alpine 인스턴스 찾기
|
||||
const appElement = document.querySelector('[x-data="anvilApp()"]');
|
||||
if (appElement && appElement._x_dataStack) {
|
||||
const appData = appElement._x_dataStack[0];
|
||||
if (appData.handleWebLogin) {
|
||||
appData.handleWebLogin(user);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 개발 도구 (콘솔에서 사용 가능)
|
||||
window.AnvilDevTools = {
|
||||
config: { TELEGRAM_BOT_URL, PRICING_DATA, WIZARD_CONFIG },
|
||||
api: ApiService,
|
||||
utils: { formatPrice, switchTab, updatePing }
|
||||
};
|
||||
|
||||
console.log('[Anvil] Application modules loaded');
|
||||
console.log('[Anvil] DevTools available at window.AnvilDevTools');
|
||||
Reference in New Issue
Block a user