이 웹사이트는 더 나은 서비스 제공을 위해 쿠키를 사용합니다.
`;
banner.style.cssText = `
position: fixed;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.9);
color: white;
padding: 1rem;
z-index: 9999;
transform: translateY(100%);
transition: transform 0.3s ease;
`;
document.body.appendChild(banner);
setTimeout(() => {
banner.style.transform = 'translateY(0)';
}, 100);
document.getElementById('accept-cookies').addEventListener('click', () => {
localStorage.setItem('cookieConsent', 'accepted');
banner.style.transform = 'translateY(100%)';
setTimeout(() => banner.remove(), 300);
});
document.getElementById('decline-cookies').addEventListener('click', () => {
localStorage.setItem('cookieConsent', 'declined');
banner.style.transform = 'translateY(100%)';
setTimeout(() => banner.remove(), 300);
});
}
// Initialize cookie consent
// initCookieConsent();
// Parallax Effect
const parallaxElements = document.querySelectorAll('.parallax');
function updateParallax() {
const scrollY = window.pageYOffset;
parallaxElements.forEach(element => {
const speed = element.dataset.speed || 0.5;
const yPos = -(scrollY * speed);
element.style.transform = `translateY(${yPos}px)`;
});
}
if (parallaxElements.length > 0) {
window.addEventListener('scroll', updateParallax);
}
// Counter Animation
const counters = document.querySelectorAll('.counter');
const counterObserver = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
animateCounter(entry.target);
counterObserver.unobserve(entry.target);
}
});
});
counters.forEach(counter => counterObserver.observe(counter));
function animateCounter(element) {
const target = parseInt(element.dataset.count);
const duration = 2000;
const start = performance.now();
function updateCounter(currentTime) {
const elapsed = currentTime - start;
const progress = Math.min(elapsed / duration, 1);
const current = Math.floor(progress * target);
element.textContent = current.toLocaleString();
if (progress < 1) {
requestAnimationFrame(updateCounter);
}
}
requestAnimationFrame(updateCounter);
}
// Typing Effect for Hero Text
const typingElements = document.querySelectorAll('.typing-effect');
typingElements.forEach(element => {
const text = element.textContent;
element.textContent = '';
element.style.borderRight = '2px solid';
let i = 0;
const timer = setInterval(() => {
element.textContent += text[i];
i++;
if (i >= text.length) {
clearInterval(timer);
element.style.borderRight = 'none';
}
}, 100);
});
// Handle form validation
const forms = document.querySelectorAll('form[data-validate]');
forms.forEach(form => {
form.addEventListener('submit', function(e) {
if (!validateForm(this)) {
e.preventDefault();
}
});
// Real-time validation
const inputs = form.querySelectorAll('input, textarea');
inputs.forEach(input => {
input.addEventListener('blur', () => validateField(input));
input.addEventListener('input', () => clearFieldError(input));
});
});
function validateForm(form) {
let isValid = true;
const inputs = form.querySelectorAll('input[required], textarea[required]');
inputs.forEach(input => {
if (!validateField(input)) {
isValid = false;
}
});
return isValid;
}
function validateField(field) {
const value = field.value.trim();
const type = field.type;
let isValid = true;
let message = '';
// Required field check
if (field.hasAttribute('required') && !value) {
isValid = false;
message = '이 필드는 필수입니다.';
}
// Email validation
if (type === 'email' && value) {
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if (!emailRegex.test(value)) {
isValid = false;
message = '올바른 이메일 형식을 입력해주세요.';
}
}
// Phone validation
if (type === 'tel' && value) {
const phoneRegex = /^[0-9-+\s()]+$/;
if (!phoneRegex.test(value)) {
isValid = false;
message = '올바른 전화번호 형식을 입력해주세요.';
}
}
// Show/hide error
if (!isValid) {
showFieldError(field, message);
} else {
clearFieldError(field);
}
return isValid;
}
function showFieldError(field, message) {
clearFieldError(field);
field.classList.add('error');
const errorDiv = document.createElement('div');
errorDiv.className = 'field-error';
errorDiv.textContent = message;
errorDiv.style.cssText = 'color: #ef4444; font-size: 0.875rem; margin-top: 0.25rem;';
field.parentNode.appendChild(errorDiv);
}
function clearFieldError(field) {
field.classList.remove('error');
const errorDiv = field.parentNode.querySelector('.field-error');
if (errorDiv) {
errorDiv.remove();
}
}
});
// Utility Functions
const utils = {
// Debounce function
debounce: function(func, wait) {
let timeout;
return function executedFunction(...args) {
const later = () => {
clearTimeout(timeout);
func(...args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
};
},
// Throttle function
throttle: function(func, limit) {
let inThrottle;
return function() {
const args = arguments;
const context = this;
if (!inThrottle) {
func.apply(context, args);
inThrottle = true;
setTimeout(() => inThrottle = false, limit);
}
};
},
// Format currency
formatCurrency: function(amount, currency = 'KRW') {
return new Intl.NumberFormat('ko-KR', {
style: 'currency',
currency: currency,
minimumFractionDigits: 0
}).format(amount);
},
// Format date
formatDate: function(date, options = {}) {
const defaultOptions = {
year: 'numeric',
month: 'long',
day: 'numeric'
};
return new Intl.DateTimeFormat('ko-KR', { ...defaultOptions, ...options }).format(new Date(date));
}
};
// Global error handler
window.addEventListener('error', function(e) {
console.error('Global error:', e.error);
// Could send error to analytics service
});
// Unhandled promise rejection handler
window.addEventListener('unhandledrejection', function(e) {
console.error('Unhandled promise rejection:', e.reason);
// Could send error to analytics service
});
// Export for use in other modules
if (typeof module !== 'undefined' && module.exports) {
module.exports = utils;
}