147 lines
3.9 KiB
JavaScript
147 lines
3.9 KiB
JavaScript
(function() {
|
|
'use strict';
|
|
|
|
const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
|
|
// Header scroll effect
|
|
const header = document.querySelector('.header');
|
|
let ticking = false;
|
|
|
|
function updateHeader() {
|
|
const scrollY = window.scrollY;
|
|
if (scrollY > 50) {
|
|
header.style.boxShadow = '0 2px 16px rgba(10, 22, 40, 0.1)';
|
|
} else {
|
|
header.style.boxShadow = 'none';
|
|
}
|
|
ticking = false;
|
|
}
|
|
|
|
window.addEventListener('scroll', function() {
|
|
if (!ticking) {
|
|
requestAnimationFrame(updateHeader);
|
|
ticking = true;
|
|
}
|
|
}, { passive: true });
|
|
|
|
// Form handling with validation
|
|
const form = document.getElementById('contactForm');
|
|
const formSuccess = document.getElementById('formSuccess');
|
|
|
|
function validateField(field) {
|
|
const value = field.value.trim();
|
|
let isValid = true;
|
|
|
|
if (field.hasAttribute('required') && !value) {
|
|
isValid = false;
|
|
}
|
|
|
|
if (field.type === 'tel' && value) {
|
|
// Israeli phone number validation (basic)
|
|
const phonePattern = /^0[0-9]{8,9}$/;
|
|
const cleanPhone = value.replace(/[-\s]/g, '');
|
|
isValid = phonePattern.test(cleanPhone);
|
|
}
|
|
|
|
if (isValid) {
|
|
field.classList.remove('invalid');
|
|
field.removeAttribute('aria-invalid');
|
|
} else {
|
|
field.classList.add('invalid');
|
|
field.setAttribute('aria-invalid', 'true');
|
|
}
|
|
|
|
return isValid;
|
|
}
|
|
|
|
if (form) {
|
|
const nameField = form.querySelector('#name');
|
|
const phoneField = form.querySelector('#phone');
|
|
|
|
// Validate on blur
|
|
[nameField, phoneField].forEach(function(field) {
|
|
if (field) {
|
|
field.addEventListener('blur', function() {
|
|
validateField(this);
|
|
});
|
|
|
|
// Clear error on input
|
|
field.addEventListener('input', function() {
|
|
if (this.classList.contains('invalid')) {
|
|
validateField(this);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
form.addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
|
|
// Validate all required fields
|
|
let isFormValid = true;
|
|
|
|
if (nameField && !validateField(nameField)) {
|
|
isFormValid = false;
|
|
}
|
|
|
|
if (phoneField && !validateField(phoneField)) {
|
|
isFormValid = false;
|
|
}
|
|
|
|
if (!isFormValid) {
|
|
// Focus first invalid field
|
|
const firstInvalid = form.querySelector('.invalid');
|
|
if (firstInvalid) {
|
|
firstInvalid.focus();
|
|
}
|
|
return;
|
|
}
|
|
|
|
const submitBtn = form.querySelector('.form-submit');
|
|
const originalText = submitBtn.textContent;
|
|
submitBtn.textContent = 'שולח...';
|
|
submitBtn.disabled = true;
|
|
submitBtn.setAttribute('aria-busy', 'true');
|
|
|
|
// Simulate submission
|
|
setTimeout(function() {
|
|
submitBtn.textContent = originalText;
|
|
submitBtn.disabled = false;
|
|
submitBtn.removeAttribute('aria-busy');
|
|
formSuccess.hidden = false;
|
|
formSuccess.setAttribute('role', 'alert');
|
|
form.reset();
|
|
|
|
// Clear any validation states
|
|
form.querySelectorAll('.invalid').forEach(function(el) {
|
|
el.classList.remove('invalid');
|
|
el.removeAttribute('aria-invalid');
|
|
});
|
|
|
|
setTimeout(function() {
|
|
formSuccess.hidden = true;
|
|
}, 6000);
|
|
}, 1200);
|
|
});
|
|
}
|
|
|
|
// Smooth scroll for anchor links
|
|
document.querySelectorAll('a[href^="#"]').forEach(function(anchor) {
|
|
anchor.addEventListener('click', function(e) {
|
|
const href = this.getAttribute('href');
|
|
if (href === '#') return;
|
|
|
|
const target = document.querySelector(href);
|
|
if (target) {
|
|
e.preventDefault();
|
|
target.scrollIntoView({
|
|
behavior: prefersReducedMotion ? 'auto' : 'smooth',
|
|
block: 'start'
|
|
});
|
|
target.focus({ preventScroll: true });
|
|
}
|
|
});
|
|
});
|
|
|
|
})();
|