/**
* Main entry point for webview SPA
* Import bridge (core) and register custom handlers here
*/
import './styles.scss';
import { registerHandler } from './bridge';
// ============================================================
// CUSTOM HANDLERS - Thêm handler cho tool mới tại đây
// ============================================================
registerHandler('scroll', (payload: { y: number }) => {
window.scrollBy(0, payload.y);
return true;
});
// ============================================================
// SPA LOGIC (demo app)
// ============================================================
/**
* Simple hash-based router
*/
function navigate(page: string): void {
document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
document.querySelectorAll('.nav-link').forEach(l => l.classList.remove('active'));
const targetPage = document.getElementById(page);
if (targetPage) {
targetPage.classList.add('active');
}
const targetLink = document.querySelector(`[data-page="${page}"]`);
if (targetLink) {
targetLink.classList.add('active');
}
}
/**
* Initialize SPA
*/
function init(): void {
// Handle nav clicks
document.querySelectorAll('.nav-link').forEach(link => {
link.addEventListener('click', (e) => {
e.preventDefault();
const page = (link as HTMLElement).dataset.page;
if (page) {
window.location.hash = page;
}
});
});
// Handle hash changes
window.addEventListener('hashchange', () => {
const page = window.location.hash.replace('#', '') || 'home';
navigate(page);
});
// Handle form submit
const contactForm = document.getElementById('contact-form');
if (contactForm) {
contactForm.addEventListener('submit', (e) => {
e.preventDefault();
const name = (document.getElementById('name') as HTMLInputElement).value;
const email = (document.getElementById('email') as HTMLInputElement).value;
const message = (document.getElementById('message') as HTMLTextAreaElement).value;
const output = document.getElementById('output');
if (output) {
output.innerHTML = `<strong>Form submitted!</strong><br>Name: ${name}<br>Email: ${email}<br>Message: ${message}`;
output.classList.add('show');
}
});
}
// Initialize with current hash
const initialPage = window.location.hash.replace('#', '') || 'home';
navigate(initialPage);
}
// Run on DOM ready
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', init);
} else {
init();
}
