Merge pull request #349 from uvarov-frontend/fix/347_empty_list_of_ye…

…ars_with_enableJumpToSelectedDate Fix empty list of years with enableJumpToSelectedDate
uvarov-frontend · Dec 17, 2024 · 1b17f38 · 1b17f38
2 parents 3687d04 + 03c2c65
commit 1b17f38
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 14 deletions.
diff --git a/demo/pages/lang/main.ts b/demo/pages/lang/main.ts
@@ -6,7 +6,7 @@ const options: Options = {
   type: 'multiple',
   selectionDatesMode: 'multiple-ranged',
   disableDatesGaps: true,
-  // disableDatesPast: true,
+  disableDatesPast: true,
   dateMin: '2021-02-01',
   dateMax: '2025-11-30',
   displayDatesOutside: false,
@@ -65,12 +65,11 @@ const options: Options = {
 };
 
 document.addEventListener('DOMContentLoaded', () => {
-  const calendar = new Calendar('#calendar', options);
+  const calendar = new Calendar('#calendar');
   calendar.init();
 
-  // const btnSetEl = document.querySelector('#set-options');
-  // btnSetEl?.addEventListener('click', () => {
-  //   calendar.set(options, { dates: false });
-  //   console.log(calendar);
-  // });
+  const btnSetEl = document.querySelector('#set-options');
+  btnSetEl?.addEventListener('click', () => {
+    calendar.set(options, { dates: false });
+  });
 });
diff --git a/package/src/scripts/creators/createYears.ts b/package/src/scripts/creators/createYears.ts
@@ -36,7 +36,7 @@ const createYears = (self: Calendar, target?: HTMLElement) => {
   const templateYearEl = document.createElement('button');
   templateYearEl.type = 'button';
 
-  for (let i = (self.context.displayYear as number) - 7; i < (self.context.displayYear as number) + 8; i++) {
+  for (let i = self.context.displayYear - 7; i < self.context.displayYear + 8; i++) {
     const yearDisabled = i < getDate(self.context.dateMin).getFullYear() + relationshipID || i > getDate(self.context.dateMax).getFullYear();
     const yearEl = createYearEl(self, templateYearEl, selectedYear, yearDisabled, i);
     yearsEl.appendChild(yearEl);

diff --git a/package/src/scripts/utils/initVariables/initSelectedMonthYear.ts b/package/src/scripts/utils/initVariables/initSelectedMonthYear.ts
@@ -3,22 +3,28 @@ import parseDates from '@scripts/utils/parseDates';
 import setContext from '@scripts/utils/setContext';
 import type { Calendar, Range } from '@src/index';
 
+const setInitialContext = (self: Calendar, month: Range<12>, year: number) => {
+  setContext(self, 'selectedMonth', month);
+  setContext(self, 'selectedYear', year);
+  setContext(self, 'displayYear', year);
+};
+
 const initSelectedMonthYear = (self: Calendar) => {
   const isJumpToSelectedDate = self.enableJumpToSelectedDate && self.selectedDates?.[0] && self.selectedMonth === undefined && self.selectedYear === undefined;
 
   if (isJumpToSelectedDate) {
     const selectedDate = getDate(parseDates(self.selectedDates)[0]);
-    setContext(self, 'selectedMonth', selectedDate.getMonth() as Range<12>);
-    setContext(self, 'selectedYear', selectedDate.getFullYear());
+    setInitialContext(self, selectedDate.getMonth() as Range<12>, selectedDate.getFullYear());
     return;
   }
 
   const isValidMonth = self.selectedMonth !== undefined && Number(self.selectedMonth) >= 0 && Number(self.selectedMonth) < 12;
   const isValidYear = self.selectedYear !== undefined && Number(self.selectedYear) >= 0 && Number(self.selectedYear) <= 9999;
-
-  setContext(self, 'selectedMonth', (isValidMonth ? Number(self.selectedMonth) : getDate(self.context.dateToday).getMonth()) as Range<12>);
-  setContext(self, 'selectedYear', isValidYear ? Number(self.selectedYear) : getDate(self.context.dateToday).getFullYear());
-  setContext(self, 'displayYear', self.context.selectedYear);
+  setInitialContext(
+    self,
+    (isValidMonth ? Number(self.selectedMonth) : getDate(self.context.dateToday).getMonth()) as Range<12>,
+    isValidYear ? Number(self.selectedYear) : getDate(self.context.dateToday).getFullYear(),
+  );
 };
 
 export default initSelectedMonthYear;