Initial AI-generated site

2026-08-19 14:58:24 +00:00
parent 4bb3c2a35a
commit 3eadbb6329
3 changed files with 1763 additions and 0 deletions
@@ -0,0 +1,213 @@
+(function() {
+  'use strict';
+
+  const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+
+  // Mobile Navigation Toggle
+  const navToggle = document.querySelector('.nav-toggle');
+  const navLinks = document.querySelector('.nav-links');
+
+  if (navToggle && navLinks) {
+    navToggle.addEventListener('click', () => {
+      const isExpanded = navToggle.getAttribute('aria-expanded') === 'true';
+      navToggle.setAttribute('aria-expanded', !isExpanded);
+      navLinks.classList.toggle('active');
+    });
+
+    navLinks.querySelectorAll('a').forEach(link => {
+      link.addEventListener('click', () => {
+        navToggle.setAttribute('aria-expanded', 'false');
+        navLinks.classList.remove('active');
+      });
+    });
+
+    document.addEventListener('click', (e) => {
+      if (!navToggle.contains(e.target) && !navLinks.contains(e.target)) {
+        navToggle.setAttribute('aria-expanded', 'false');
+        navLinks.classList.remove('active');
+      }
+    });
+  }
+
+  // Reveal on Scroll
+  const revealElements = document.querySelectorAll('.reveal');
+
+  if (!prefersReducedMotion && revealElements.length > 0) {
+    const revealObserver = new IntersectionObserver((entries) => {
+      entries.forEach(entry => {
+        if (entry.isIntersecting) {
+          entry.target.classList.add('revealed');
+          revealObserver.unobserve(entry.target);
+        }
+      });
+    }, {
+      threshold: 0.1,
+      rootMargin: '0px 0px -50px 0px'
+    });
+
+    revealElements.forEach(el => revealObserver.observe(el));
+  } else {
+    revealElements.forEach(el => el.classList.add('revealed'));
+  }
+
+  // Pause blob animations when hero is out of view
+  const heroBg = document.querySelector('.hero-bg');
+  if (heroBg && !prefersReducedMotion) {
+    const heroObserver = new IntersectionObserver((entries) => {
+      entries.forEach(entry => {
+        if (entry.isIntersecting) {
+          entry.target.classList.add('in-view');
+        } else {
+          entry.target.classList.remove('in-view');
+        }
+      });
+    }, {
+      threshold: 0
+    });
+
+    heroObserver.observe(heroBg);
+  } else if (heroBg) {
+    heroBg.classList.add('in-view');
+  }
+
+  // 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 headerOffset = 80;
+        const elementPosition = target.getBoundingClientRect().top;
+        const offsetPosition = elementPosition + window.pageYOffset - headerOffset;
+
+        if (prefersReducedMotion) {
+          window.scrollTo(0, offsetPosition);
+        } else {
+          window.scrollTo({
+            top: offsetPosition,
+            behavior: 'smooth'
+          });
+        }
+      }
+    });
+  });
+
+  // Header shadow on scroll
+  const header = document.querySelector('.site-header');
+  
+  if (header) {
+    let ticking = false;
+    
+    window.addEventListener('scroll', () => {
+      if (!ticking) {
+        window.requestAnimationFrame(() => {
+          if (window.pageYOffset > 100) {
+            header.style.boxShadow = '0 4px 20px rgba(0, 0, 0, 0.08)';
+          } else {
+            header.style.boxShadow = 'none';
+          }
+          ticking = false;
+        });
+        ticking = true;
+      }
+    }, { passive: true });
+  }
+
+  // Form validation and submission
+  const contactForm = document.querySelector('.contact-form');
+  
+  if (contactForm) {
+    const formStatus = contactForm.querySelector('.form-status');
+    
+    // Email validation regex
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    
+    // Clear error state on input
+    contactForm.querySelectorAll('input, select, textarea').forEach(field => {
+      field.addEventListener('input', () => {
+        const group = field.closest('.form-group');
+        if (group) {
+          group.classList.remove('has-error');
+          field.classList.remove('error');
+        }
+      });
+    });
+    
+    contactForm.addEventListener('submit', function(e) {
+      e.preventDefault();
+      
+      // Reset status
+      formStatus.className = 'form-status';
+      formStatus.textContent = '';
+      
+      // Validate fields
+      const fields = {
+        name: { el: this.querySelector('#name'), validate: v => v.trim().length > 0 },
+        email: { el: this.querySelector('#email'), validate: v => emailRegex.test(v.trim()) },
+        subject: { el: this.querySelector('#subject'), validate: v => v.trim().length > 0 },
+        message: { el: this.querySelector('#message'), validate: v => v.trim().length > 0 }
+      };
+      
+      let isValid = true;
+      let firstError = null;
+      
+      Object.values(fields).forEach(({ el, validate }) => {
+        const group = el.closest('.form-group');
+        const valid = validate(el.value);
+        
+        if (!valid) {
+          isValid = false;
+          group.classList.add('has-error');
+          el.classList.add('error');
+          if (!firstError) firstError = el;
+        } else {
+          group.classList.remove('has-error');
+          el.classList.remove('error');
+        }
+      });
+      
+      if (!isValid) {
+        formStatus.className = 'form-status error';
+        formStatus.textContent = 'נא למלא את כל השדות הנדרשים';
+        if (firstError) firstError.focus();
+        return;
+      }
+      
+      const submitBtn = this.querySelector('button[type="submit"]');
+      const originalHTML = submitBtn.innerHTML;
+      
+      submitBtn.innerHTML = '<span>שולח...</span>';
+      submitBtn.disabled = true;
+      
+      // Simulate form submission
+      setTimeout(() => {
+        formStatus.className = 'form-status success';
+        formStatus.textContent = 'ההודעה נשלחה בהצלחה! נחזור אליך בהקדם.';
+        
+        submitBtn.innerHTML = '<span>נשלח בהצלחה ✓</span>';
+        submitBtn.style.background = 'var(--teal)';
+        
+        setTimeout(() => {
+          submitBtn.innerHTML = originalHTML;
+          submitBtn.style.background = '';
+          submitBtn.disabled = false;
+          contactForm.reset();
+          
+          // Clear success message after a bit
+          setTimeout(() => {
+            formStatus.className = 'form-status';
+            formStatus.textContent = '';
+          }, 3000);
+        }, 2000);
+      }, 1500);
+    });
+  }
+
+  // FAQ - native details/summary, no custom animation that fights browser
+  // The CSS handles the icon rotation; no JS override needed
+
+})();