// public/scripts/input-area.js

document.addEventListener('DOMContentLoaded', () => {
    const form = document.getElementById('area-form');
  
    form.addEventListener('submit', async (e) => {
      e.preventDefault();
  
      // Gather form values
      const area        = document.getElementById('area').value;
      const stationCode = document.getElementById('stationCode').value;
      const temperature = parseFloat(document.getElementById('temperature').value);
      const humidity    = parseFloat(document.getElementById('humidity').value);
  
      // Build payload
      const payload = { area, stationCode, temperature, humidity };
  
      try {
        const res = await fetch('/api/area-readings', {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify(payload)
        });
  
        if (!res.ok) {
          const { error } = await res.json();
          alert(`Error: ${error}`);
          return;
        }
  
        // Success: reset form and optionally notify user
        form.reset();
        alert('Area reading submitted successfully!');
      } catch (err) {
        console.error('Network error submitting area reading:', err);
        alert('Network error – please try again.');
      }
    });
  });