'use strict';

(() => {
  // ===== DOM =====
  const DOM = {
    temperatureForm: document.querySelector('#temperatureForm'),
    celsiusInput: document.querySelector('#celsius'),
    result: document.querySelector('#result'),
  };

  // ===== INIT =====
  const init = () => {
    DOM.temperatureForm.addEventListener('submit', handleFormSubmit);
  };

  // ===== EVENT HANDLERS =====
  function handleFormSubmit(e) {
    const celsius = DOM.celsiusInput.value;

    if (!isNaN(celsius)) {
      alert('Please enter a valid number');
      return;
    }

    const fahrenheit = convertToFahrenheit(celsius);

    displayResult(fahrenheit);

    DOM.temperatureForm.reset();
  }

  // ===== FUNCTIONS =====
  function convertToFahrenheit(celsius) {
    if (typeof celsius === 'string') return 0;

    return (celsius * 9) / 5 + 32;
  }

  function displayResult(result) {
    DOM.result.textContent = result.toFixed(2);
  }

  // ===== CALL INIT =====
  init();
})();