언어전환버튼 및 EmailJS 기능 완벽 기능

2026-02-18 07:25:37 +09:00
parent fd51c36120
commit 0b107bff07
1 changed files with 60 additions and 0 deletions
--- a/html/assets/js/script.js
+++ b/html/assets/js/script.js
@@ -1,3 +1,63 @@
+// ============================================================
+// ★ EmailJS 설정 - 아래 3가지 값을 본인 계정으로 교체하세요 ★
+// ============================================================
+const EMAILJS_PUBLIC_KEY  = 'HO6i369gX6X5HEXtJ';
+const EMAILJS_SERVICE_ID  = 'service_4ur5lqd';
+const EMAILJS_TEMPLATE_ID = 'template_jp0v5qv';
+// ============================================================
+
+emailjs.init(EMAILJS_PUBLIC_KEY);
+
+// ── 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');
+        });
+});
+
+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;
+}
+
 // ============================================================
 // 메인 스크립트 (전체 기능 포함)
 // ============================================================