Initial AI-generated site

script.js

@@ -0,0 +1,225 @@
+// ========================================
+// HEADER SCROLL EFFECT
+// ========================================
+const header = document.getElementById('header');
+let lastScroll = 0;
+
+function handleScroll() {
+  const currentScroll = window.pageYOffset;
+  
+  if (currentScroll > 50) {
+    header.classList.add('header--scrolled');
+  } else {
+    header.classList.remove('header--scrolled');
+  }
+  
+  lastScroll = currentScroll;
+}
+
+window.addEventListener('scroll', handleScroll, { passive: true });
+
+// ========================================
+// MOBILE NAVIGATION
+// ========================================
+const navToggle = document.querySelector('.nav-toggle');
+const nav = document.getElementById('nav');
+
+if (navToggle && nav) {
+  navToggle.addEventListener('click', () => {
+    const isExpanded = navToggle.getAttribute('aria-expanded') === 'true';
+    navToggle.setAttribute('aria-expanded', !isExpanded);
+    nav.classList.toggle('active');
+  });
+  
+  // Close nav when clicking on a link
+  nav.querySelectorAll('.nav__link').forEach(link => {
+    link.addEventListener('click', () => {
+      navToggle.setAttribute('aria-expanded', 'false');
+      nav.classList.remove('active');
+    });
+  });
+  
+  // Close nav on escape key
+  document.addEventListener('keydown', (e) => {
+    if (e.key === 'Escape' && nav.classList.contains('active')) {
+      navToggle.setAttribute('aria-expanded', 'false');
+      nav.classList.remove('active');
+      navToggle.focus();
+    }
+  });
+}
+
+// ========================================
+// REVEAL ON SCROLL
+// ========================================
+function initReveal() {
+  const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+  
+  if (prefersReducedMotion) {
+    document.querySelectorAll('.reveal').forEach(el => {
+      el.classList.add('visible');
+    });
+    return;
+  }
+  
+  const revealElements = document.querySelectorAll('.reveal');
+  
+  const observer = new IntersectionObserver((entries) => {
+    entries.forEach(entry => {
+      if (entry.isIntersecting) {
+        entry.target.classList.add('visible');
+        observer.unobserve(entry.target);
+      }
+    });
+  }, {
+    threshold: 0.1,
+    rootMargin: '0px 0px -50px 0px'
+  });
+  
+  reveal Elements.forEach(el => observer.observe(el));
+}
+
+// ========================================
+// SMOOTH SCROLL FOR ANCHOR LINKS
+// ========================================
+document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+  anchor.addEventListener('click', function(e) {
+    const href = this.getAttribute('href');
+    if (href === '#') return;
+    
+    const target = document.querySelector(href);
+    if (target) {
+      e.preventDefault();
+      const headerHeight = header.offsetHeight;
+      const targetPosition = target.getBoundingClientRect().top + window.pageYOffset - headerHeight;
+      
+      window.scrollTo({
+        top: targetPosition,
+        behavior: 'smooth'
+      });
+    }
+  });
+});
+
+// ========================================
+// FORM HANDLING
+// ========================================
+const contactForm = document.querySelector('.contact-form');
+
+if (contactForm) {
+  const formStatus = document.getElementById('form-status');
+  
+  function showError(field, message) {
+    const errorEl = document.getElementById(field.id + '-error');
+    field.classList.add('error');
+    field.setAttribute('aria-invalid', 'true');
+    if (errorEl) {
+      errorEl.textContent = message;
+    }
+  }
+  
+  function clearError(field) {
+    const errorEl = document.getElementById(field.id + '-error');
+    field.classList.remove('error');
+    field.removeAttribute('aria-invalid');
+    if (errorEl) {
+      errorEl.textContent = '';
+    }
+  }
+  
+  contactForm.addEventListener('submit', function(e) {
+    e.preventDefault();
+    
+    let isValid = true;
+    let firstError = null;
+    
+    // Validate name
+    const nameField = this.querySelector('#name');
+    if (!nameField.value.trim()) {
+      showError(nameField, 'נא להזין שם מלא');
+      isValid = false;
+      if (!firstError) firstError = nameField;
+    } else {
+      clearError(nameField);
+    }
+    
+    // Validate email
+    const emailField = this.querySelector('#email');
+    const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    if (!emailField.value.trim()) {
+      showError(emailField, 'נא להזין כתובת אימייל');
+      isValid = false;
+      if (!firstError) firstError = emailField;
+    } else if (!emailPattern.test(emailField.value)) {
+      showError(emailField, 'נא להזין כתובת אימייל תקינה');
+      isValid = false;
+      if (!firstError) firstError = emailField;
+    } else {
+      clearError(emailField);
+    }
+    
+    // Validate message
+    const messageField = this.querySelector('#message');
+    if (!messageField.value.trim()) {
+      showError(messageField, 'נא להזין הודעה');
+      isValid = false;
+      if (!firstError) firstError = messageField;
+    } else {
+      clearError(messageField);
+    }
+    
+    if (!isValid) {
+      if (firstError) {
+        firstError.focus();
+      }
+      if (formStatus) {
+        formStatus.textContent = 'יש לתקן את השגיאות בטופס';
+      }
+      return;
+    }
+    
+    const submitBtn = this.querySelector('.form-submit');
+    const originalText = submitBtn.textContent;
+    
+    submitBtn.textContent = 'שולח...';
+    submitBtn.disabled = true;
+    
+    // Simulate form submission
+    setTimeout(() => {
+      submitBtn.textContent = 'נשלח בהצלחה!';
+      submitBtn.style.background = 'var(--gold)';
+      if (formStatus) {
+        formStatus.textContent = 'ההודעה נשלחה בהצלחה. אחזור אליכם בהקדם.';
+      }
+      
+      setTimeout(() => {
+        submitBtn.textContent = originalText;
+        submitBtn.style.background = '';
+        submitBtn.disabled = false;
+        contactForm.reset();
+        if (formStatus) {
+          formStatus.textContent = '';
+        }
+      }, 3000);
+    }, 1500);
+  });
+  
+  // Clear error on input
+  contactForm.querySelectorAll('.form-input').forEach(input => {
+    input.addEventListener('input', function() {
+      clearError(this);
+    });
+  });
+}
+
+// ========================================
+// INIT
+// ========================================
+document.addEventListener('DOMContentLoaded', () => {
+  initReveal();
+});
+
+// Also run on load for images etc
+window.addEventListener('load', () => {
+  setTimeout(initReveal, 100);
+});