← Kapat

projegonder.js

// Project Form JS
window.addEventListener('load', () => {
  // Dosya yükleme
  const fileInput = document.getElementById('fileInput');
  const fileList = document.getElementById('fileList');
  const uploadArea = document.querySelector('.file-upload-area');

  if (fileInput && uploadArea) {
    // Drag & Drop
    ['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
      uploadArea.addEventListener(eventName, preventDefaults, false);
    });

    function preventDefaults(e) {
      e.preventDefault();
      e.stopPropagation();
    }

    ['dragenter', 'dragover'].forEach(eventName => {
      uploadArea.addEventListener(eventName, () => {
        uploadArea.classList.add('drag-over');
      });
    });

    ['dragleave', 'drop'].forEach(eventName => {
      uploadArea.addEventListener(eventName, () => {
        uploadArea.classList.remove('drag-over');
      });
    });

    uploadArea.addEventListener('drop', (e) => {
      const dt = e.dataTransfer;
      const files = dt.files;
      handleFiles(files);
    });

    fileInput.addEventListener('change', (e) => {
      handleFiles(e.target.files);
    });

    function handleFiles(files) {
      fileList.innerHTML = '';
      [...files].forEach(file => {
        const fileItem = document.createElement('div');
        fileItem.className = 'file-item';
        fileItem.innerHTML = `
          <i class="bi bi-file-earmark"></i>
          <span>${file.name}</span>
          <span class="file-size">(${(file.size / 1024).toFixed(2)} KB)</span>
        `;
        fileList.appendChild(fileItem);
      });
    }
  }

  // Form validation
  const projectForm = document.querySelector('.project-form');
  
  if (!projectForm) {
    return;
  }

  projectForm.addEventListener('submit', function(e) {
    e.preventDefault();
    
    const checkboxes = document.querySelectorAll('input[name="project_type[]"]');
    const checked = Array.from(checkboxes).some(cb => cb.checked);
    
    if (!checked) {
      showNotification('Lütfen en az bir proje türü seçin.', 'error');
      return;
    }
    
    // Loading göster
    const submitBtn = projectForm.querySelector('.btn-submit');
    const loadingDiv = projectForm.querySelector('.loading');
    const errorDiv = projectForm.querySelector('.error-message');
    const successDiv = projectForm.querySelector('.sent-message');
    
    submitBtn.disabled = true;
    loadingDiv.style.display = 'block';
    errorDiv.style.display = 'none';
    successDiv.style.display = 'none';
    
    // Form verilerini gönder
    const formData = new FormData(projectForm);
    
    fetch('forms/project.php', {
      method: 'POST',
      body: formData
    })
    .then(response => {
      if (!response.ok) {
        throw new Error('Form gönderilemedi');
      }
      return response.text();
    })
    .then(data => {
      loadingDiv.style.display = 'none';
      submitBtn.disabled = false;
      
      // Başarı popup'ı göster
      showSuccessPopup();
    })
    .catch(error => {
      loadingDiv.style.display = 'none';
      errorDiv.style.display = 'block';
      errorDiv.textContent = 'Form gönderilirken bir hata oluştu. Lütfen daha sonra tekrar deneyin.';
      submitBtn.disabled = false;
    });
  });
  
  // Başarı popup'ı
  function showSuccessPopup() {
    const popup = document.createElement('div');
    popup.className = 'success-popup';
    popup.innerHTML = `
      <div class="success-popup-overlay"></div>
      <div class="success-popup-content">
        <div class="success-icon">
          <i class="bi bi-check-circle"></i>
        </div>
        <h2>Teşekkür Ederiz!</h2>
        <p>Projeniz başarıyla gönderildi. En kısa sürede size dönüş yapacağız.</p>
        <button onclick="window.location.href='index.html'" class="popup-btn">Anasayfaya Dön</button>
      </div>
    `;
    document.body.appendChild(popup);
    
    // Animasyon için kısa gecikme
    setTimeout(() => {
      popup.querySelector('.success-popup-content').style.transform = 'scale(1)';
      popup.querySelector('.success-popup-content').style.opacity = '1';
    }, 10);
  }
  
  // Bildirim fonksiyonu
  function showNotification(message, type) {
    const notification = document.createElement('div');
    notification.className = `notification notification-${type}`;
    notification.textContent = message;
    document.body.appendChild(notification);
    
    setTimeout(() => {
      notification.classList.add('show');
    }, 10);
    
    setTimeout(() => {
      notification.classList.remove('show');
      setTimeout(() => notification.remove(), 300);
    }, 3000);
  }
});