항목수정 및 언어버튼 가시성 수정

html/assets/js/script.js

@@ -1,89 +1,75 @@
 // ============================================================
-// ★ EmailJS 설정 - 아래 3가지 값을 본인 계정으로 교체하세요 ★
-// ============================================================
-const EMAILJS_PUBLIC_KEY  = 'HO6i369gX6X5HEXtJ';
-const EMAILJS_SERVICE_ID  = 'service_4ur5lqd';
-const EMAILJS_TEMPLATE_ID = 'template_jp0v5qv';
+// 메인 스크립트 (전체 기능 포함)
 // ============================================================
 
-emailjs.init(EMAILJS_PUBLIC_KEY);
+// DOMContentLoaded 이벤트
+document.addEventListener('DOMContentLoaded', () => {
 
-// ── Contact Form ─────────────────────────────────────────────
-document.getElementById('contact-submit').addEventListener('click', function () {
-    const name    = document.getElementById('contact-name').value.trim();
-    const email   = document.getElementById('contact-email').value.trim();
-    const company = document.getElementById('contact-company').value.trim();
-    const message = document.getElementById('contact-message').value.trim();
-    const btn     = document.getElementById('contact-submit');
-
-    if (!name || !email || !message) {
-        showStatus('error', t('contact.error.required')); return;
-    }
-    if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
-        showStatus('error', t('contact.error.email')); return;
-    }
-
-    btn.disabled = true;
-    btn.textContent = t('contact.sending');
-
-    const templateParams = {
-        name     : name,
-        message  : 'Email   : ' + email + '\nCompany : ' + (company || 'N/A') + '\n\n' + message,
-        reply_to : email
-    };
-
-    emailjs.send(EMAILJS_SERVICE_ID, EMAILJS_TEMPLATE_ID, templateParams)
-        .then(function () {
-            showStatus('success', t('contact.success'));
-            document.getElementById('contact-name').value    = '';
-            document.getElementById('contact-email').value   = '';
-            document.getElementById('contact-company').value = '';
-            document.getElementById('contact-message').value = '';
-        })
-        .catch(function (error) {
-            console.error('EmailJS error:', error);
-            showStatus('error', t('contact.error.fail'));
-        })
-        .finally(function () {
-            btn.disabled = false;
-            btn.textContent = t('contact.btn');
+    // ============================================================
+    // 메뉴 토글
+    // ============================================================
+    const menuBtn = document.querySelector('.menu-btn');
+    const navMenu = document.querySelector('.nav-menu');
+    if (menuBtn && navMenu) {
+        menuBtn.addEventListener('click', () => {
+            navMenu.classList.toggle('open');
+            menuBtn.classList.toggle('open');
         });
-});
-
-function showStatus(type, msg) {
-    const status = document.getElementById('contact-status');
-    status.classList.remove('hidden', 'bg-green-500/20', 'text-green-400', 'bg-red-500/20', 'text-red-400');
-    status.classList.add(type === 'success' ? 'bg-green-500/20' : 'bg-red-500/20',
-                         type === 'success' ? 'text-green-400' : 'text-red-400');
-    status.textContent = msg;
-}
-
-// ── Header scroll ────────────────────────────────────────────
-const mainHeader = document.getElementById('main-header');
-const brandName  = document.getElementById('brand-name');
-const navLinks   = document.querySelectorAll('.nav-link');
-
-window.addEventListener('scroll', () => {
-    if (window.scrollY > 50) {
-        mainHeader.classList.add('glass-effect', 'py-3');
-        mainHeader.classList.remove('py-6');
-        if (brandName) brandName.classList.replace('text-white', 'text-slate-900');
-        navLinks.forEach(link => link.classList.replace('text-slate-100', 'text-slate-700'));
-    } else {
-        mainHeader.classList.remove('glass-effect', 'py-3');
-        mainHeader.classList.add('py-6');
-        if (brandName) brandName.classList.replace('text-slate-900', 'text-white');
-        navLinks.forEach(link => link.classList.replace('text-slate-700', 'text-slate-100'));
     }
+
+    // ============================================================
+    // 스크롤 애니메이션
+    // ============================================================
+    const scrollElems = document.querySelectorAll('[data-scroll]');
+    const observerOptions = {
+        root: null,
+        rootMargin: '0px',
+        threshold: 0.1
+    };
+    const scrollObserver = new IntersectionObserver((entries, observer) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                entry.target.classList.add('animate');
+                observer.unobserve(entry.target);
+            }
+        });
+    }, observerOptions);
+
+    scrollElems.forEach(el => scrollObserver.observe(el));
+
+    // ============================================================
+    // 상단 버튼/헤더 스크롤 효과
+    // ============================================================
+    const header = document.querySelector('header');
+    const topBtn = document.querySelector('.back-to-top');
+    window.addEventListener('scroll', () => {
+        if (window.scrollY > 50) {
+            header?.classList.add('scrolled');
+            topBtn?.classList.add('visible');
+        } else {
+            header?.classList.remove('scrolled');
+            topBtn?.classList.remove('visible');
+        }
+    });
+
+    topBtn?.addEventListener('click', () => window.scrollTo({ top: 0, behavior: 'smooth' }));
+
+    // ============================================================
+    // 기타 커스텀 이벤트/버튼
+    // ============================================================
+    // 예: 상담 신청 모달 열기
+    document.querySelectorAll('.open-consult').forEach(btn => {
+        btn.addEventListener('click', () => {
+            const modal = document.querySelector('#consult-modal');
+            modal?.classList.add('open');
+        });
+    });
+
+    // 예: 모달 닫기
+    document.querySelectorAll('.modal .close-btn').forEach(btn => {
+        btn.addEventListener('click', () => {
+            const modal = btn.closest('.modal');
+            modal?.classList.remove('open');
+        });
+    });
 });
-
-// ── Mobile menu ───────────────────────────────────────────────
-const mobileMenuBtn = document.getElementById('mobile-menu-btn');
-const mobileMenu    = document.getElementById('mobile-menu');
-const closeMenuBtn  = document.getElementById('close-menu-btn');
-
-if (mobileMenuBtn) mobileMenuBtn.addEventListener('click', () => mobileMenu.classList.remove('translate-x-full'));
-if (closeMenuBtn)  closeMenuBtn.addEventListener('click',  () => mobileMenu.classList.add('translate-x-full'));
-
-const mobileNavLinks = mobileMenu ? mobileMenu.querySelectorAll('a') : [];
-mobileNavLinks.forEach(link => link.addEventListener('click', () => mobileMenu.classList.add('translate-x-full')));