Bonjour,

Ce que je fais

Je viens de réaliser un date-picker. Il marche correctement. Seulement, je me demandais si ce n'était pas un peu trop brouillon.
J'aurai aimé avoir votre avis quand à la disposition du code. Faut-il l'aérer ? Mieux utiliser la touche tab ?
Désolé je sais que ma question peux paraître stupide à certain, mais je suis nouveau en programmation.
Comment organisez-vous votre code javascript, pour le rendre mieux lisible ?

Mon javascript :

const input_date_elmt = document.querySelector('.selected-date');
const date_picker = document.querySelector('.date-picker');
const month_picker = document.querySelector('.mth');
const next_month = document.querySelector('.next-mth');
const previous_month = document.querySelector('.prev-mth');
const days = document.querySelector('.days');

const monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];

let amount_days = 0;

let d = new Date ();
let day = d.getDate(); // getDate = get the day
let month = d.getMonth();
let year = d.getFullYear();

let selectedDate = d;
let selectedDay = day;
let selectedMonth = month;
let selectedYear = year;

month_picker.textContent = monthNames[month] + ' ' + year;
  days_to_day(); // Show the days
input_date_elmt.value = formatDate(d);

//Event listener
input_date_elmt.addEventListener('click', toggleDatePicker);
next_month.addEventListener('click', nxtMonthPicker);
previous_month.addEventListener('click', prevMonthPicker);

function toggleDatePicker (){ // Affiche ou cache le date-picker
  if (date_picker.style.display === "none") {
    date_picker.style.display = "block";
  } else {
    date_picker.style.display = "none";
  }
}

function nxtMonthPicker(){ // Passe au prochain mois
  month++;
  if(month > 11){
    month = 0;
    year++;
  }
 month_picker.textContent = monthNames[month] + ' ' + year;
 days_to_day();
}
function prevMonthPicker(){ // Passe au mois précédent
   month--;
   if(month < 0){
     month = 11;
     year--;
   }
  month_picker.textContent = monthNames[month] + ' ' + year;
  days_to_day();
}

function formatDate(date){ // Ecrit la date sous le bon format (pour la balise input);
   let day = date.getDate();

    if(day < 10){
      day = '0' + day;
    }

   let month = date.getMonth() + 1;

   if(month < 10){
     month = '0' + month;
   }

   let year = date.getFullYear();

   return year + '-' + month + '-' + day;
}

function leapYear(yr) // Vérifie si utilisateur est dans une année bissextile
{
  return ((yr % 4 == 0) && (yr % 100 != 0)) || (yr % 400 == 0);
}

function days_to_day(){ // affiche les jours du mois en cours
  days.innerHTML = '';

if(month == 0 || month == 2 || month == 4 || month == 6 || month == 7 || month == 9 || month == 11)
{
   amount_days = 31;
}
else if (month == 3 || month == 5 || month == 8 || month == 10)
{
   amount_days = 30;
}
else
{
  if(leapYear(year))
  {
    amount_days = 29;
  }
  else
  {
    amount_days = 28;
  }
}
   for (var i = 0; i < amount_days; i++) { // créer les divs day

      const day_elmt = document.createElement('div');
      day_elmt.classList.add('day');
      day_elmt.textContent = i + 1;
      days.appendChild(day_elmt);

      if(selectedDay == i + 1 && selectedMonth == month && selectedYear == year || selectedDay == i + 1 && selectedMonth == month + 1 && selectedYear == year){ 
      // la première condition est pour le jour de base qui est sélectionner, la deuxième est si un jour est cliqué par utilisateur
                day_elmt.classList.add('selected');
      }

      day_elmt.addEventListener('click', function(){ // Si utilisateur clique sur un jour

        // on met à jour la date séléctionner qui permettra ajouter la class selected
        selectedDay = day_elmt.textContent;
        selectedMonth = month + 1;
        selectedYear = year;

          // On écrit la date, puis on la format en la passant à input
        selectedDate = new Date (year + '-' + (month + 1) + '-' + (day_elmt.textContent));
        input_date_elmt.value = formatDate(selectedDate); // on update la valeur de l'input

        days_to_day();

      });

   }
}

En vous remerciant par avance de vos réponses,
Tekrai.

Aucune réponse