From 16bf733cc6011ed8ce8d522bdc66e3ed701c2014 Mon Sep 17 00:00:00 2001 From: Yury Uvarov Date: Wed, 26 Apr 2023 14:59:44 +0300 Subject: [PATCH 1/2] fix update method --- package/src/scripts/methods/clickCalendar.ts | 10 ++-- .../scripts/methods/handlerMultipleRanged.ts | 4 +- package/src/scripts/methods/initCalendar.ts | 6 +-- package/src/scripts/methods/mainMethod.ts | 33 +++++++++++++ package/src/scripts/methods/resetCalendar.ts | 4 +- package/src/scripts/methods/updateCalendar.ts | 46 +++++++++---------- 6 files changed, 65 insertions(+), 38 deletions(-) create mode 100644 package/src/scripts/methods/mainMethod.ts diff --git a/package/src/scripts/methods/clickCalendar.ts b/package/src/scripts/methods/clickCalendar.ts index b55e1f81..c5599660 100644 --- a/package/src/scripts/methods/clickCalendar.ts +++ b/package/src/scripts/methods/clickCalendar.ts @@ -4,7 +4,7 @@ import createDays from './createDays'; import createMonths from './createMonths'; import createYears from './createYears'; import generateDate from '../helpers/generateDate'; -import update from './updateCalendar'; +import mainMethod from './mainMethod'; import handlerMultipleRanged from './handlerMultipleRanged'; const clickCalendar = (self: IVanillaCalendar) => { @@ -154,7 +154,7 @@ const clickCalendar = (self: IVanillaCalendar) => { createYears(self); } else if (self.currentType === 'year' && yearHeaderEl) { self.currentType = self.type; - update(self); + mainMethod(self); } else if (yearItemEl) { if (self.selectedMonth === undefined || !self.dateMin || !self.dateMax) return; self.selectedYear = Number(yearItemEl.dataset.calendarYear); @@ -166,7 +166,7 @@ const clickCalendar = (self: IVanillaCalendar) => { self.selectedMonth = self.dateMax.getMonth(); } if (self.actions.clickYear) self.actions.clickYear(e, self.selectedYear); - update(self); + mainMethod(self); } }; @@ -176,12 +176,12 @@ const clickCalendar = (self: IVanillaCalendar) => { createMonths(self); } else if (self.currentType === 'month' && monthHeaderEl) { self.currentType = self.type; - update(self); + mainMethod(self); } else if (monthItemEl) { self.selectedMonth = Number(monthItemEl.dataset.calendarMonth); self.currentType = self.type; if (self.actions.clickMonth) self.actions.clickMonth(e, self.selectedMonth); - update(self); + mainMethod(self); } }; diff --git a/package/src/scripts/methods/handlerMultipleRanged.ts b/package/src/scripts/methods/handlerMultipleRanged.ts index 6218f4ba..0b669a9a 100644 --- a/package/src/scripts/methods/handlerMultipleRanged.ts +++ b/package/src/scripts/methods/handlerMultipleRanged.ts @@ -1,6 +1,6 @@ import { IVanillaCalendar } from 'src/types'; import generateDate from '../helpers/generateDate'; -import update from './updateCalendar'; +import mainMethod from './mainMethod'; let currentSelf: null | IVanillaCalendar = null; @@ -63,7 +63,7 @@ const cancelSelectionDays = (e: KeyboardEvent) => { currentSelf.selectedDates = []; (currentSelf.HTMLElement as HTMLElement).removeEventListener('mousemove', hoverDaysEvent); document.removeEventListener('keydown', cancelSelectionDays); - update(currentSelf); + mainMethod(currentSelf); }; const setDisabledDates = () => { diff --git a/package/src/scripts/methods/initCalendar.ts b/package/src/scripts/methods/initCalendar.ts index 0ea7b194..72c8010e 100644 --- a/package/src/scripts/methods/initCalendar.ts +++ b/package/src/scripts/methods/initCalendar.ts @@ -1,6 +1,5 @@ import { IVanillaCalendar } from 'src/types'; -import setVariablesDates from './setVariablesDates'; -import updateCalendar from './updateCalendar'; +import resetCalendar from './resetCalendar'; import handlerInput from './handlerInput'; import clickCalendar from './clickCalendar'; import createCalendarToInput from './createCalendarToInput'; @@ -8,8 +7,7 @@ import createCalendarToInput from './createCalendarToInput'; const initCalendar = (self: IVanillaCalendar) => { if (!self.HTMLElement) return; createCalendarToInput(self); - setVariablesDates(self); - updateCalendar(self); + resetCalendar(self); handlerInput(self); clickCalendar(self); }; diff --git a/package/src/scripts/methods/mainMethod.ts b/package/src/scripts/methods/mainMethod.ts new file mode 100644 index 00000000..ee582078 --- /dev/null +++ b/package/src/scripts/methods/mainMethod.ts @@ -0,0 +1,33 @@ +import { IVanillaCalendar } from 'src/types'; +import controlArrows from './controlArrows'; +import createDays from './createDays'; +import createDOM from './createDOM'; +import showMonth from './showMonth'; +import showYear from './showYear'; +import createMonths from './createMonths'; +import createTime from './createTime'; +import createWeek from './createWeek'; +import createYears from './createYears'; +import getLocale from './getLocale'; +import setTheme from './setTheme'; + +const mainMethod = (self: IVanillaCalendar) => { + setTheme(self); + getLocale(self); + createDOM(self); + showMonth(self); + showYear(self); + controlArrows(self); + createTime(self); + + if (self.currentType === 'default' || self.currentType === 'multiple') { + createWeek(self); + createDays(self); + } else if (self.currentType === 'month') { + createMonths(self); + } else if (self.currentType === 'year') { + createYears(self); + } +}; + +export default mainMethod; diff --git a/package/src/scripts/methods/resetCalendar.ts b/package/src/scripts/methods/resetCalendar.ts index 0a72db1a..cd62c09a 100644 --- a/package/src/scripts/methods/resetCalendar.ts +++ b/package/src/scripts/methods/resetCalendar.ts @@ -1,10 +1,10 @@ import { IVanillaCalendar } from 'src/types'; import setVariablesDates from './setVariablesDates'; -import updateCalendar from './updateCalendar'; +import mainMethod from './mainMethod'; const resetCalendar = (self: IVanillaCalendar) => { setVariablesDates(self); - updateCalendar(self); + mainMethod(self); }; export default resetCalendar; diff --git a/package/src/scripts/methods/updateCalendar.ts b/package/src/scripts/methods/updateCalendar.ts index 6e3ba54d..aa771137 100644 --- a/package/src/scripts/methods/updateCalendar.ts +++ b/package/src/scripts/methods/updateCalendar.ts @@ -1,33 +1,29 @@ import { IVanillaCalendar } from 'src/types'; -import controlArrows from './controlArrows'; -import createDays from './createDays'; -import createDOM from './createDOM'; -import showMonth from './showMonth'; -import showYear from './showYear'; -import createMonths from './createMonths'; -import createTime from './createTime'; -import createWeek from './createWeek'; -import createYears from './createYears'; -import getLocale from './getLocale'; -import setTheme from './setTheme'; +import setVariablesDates from './setVariablesDates'; +import mainMethod from './mainMethod'; const updateCalendar = (self: IVanillaCalendar) => { - setTheme(self); - getLocale(self); - createDOM(self); - showMonth(self); - showYear(self); - controlArrows(self); - createTime(self); + let tempSelectedDates = null; + let tempSelectedMonth = null; + let tempSelectedYear = null; - if (self.currentType === 'default' || self.currentType === 'multiple') { - createWeek(self); - createDays(self); - } else if (self.currentType === 'month') { - createMonths(self); - } else if (self.currentType === 'year') { - createYears(self); + if (!self.settings.selected.dates?.[0]) { + tempSelectedDates = self.settings.selected.dates; + self.settings.selected.dates = self.selectedDates; } + if (!self.settings.selected.month) { + tempSelectedMonth = self.settings.selected.month; + self.settings.selected.month = self.selectedMonth as number; + } + if (!self.settings.selected.year) { + tempSelectedYear = self.settings.selected.year; + self.settings.selected.year = self.selectedYear as number; + } + setVariablesDates(self); + mainMethod(self); + self.settings.selected.dates = tempSelectedDates; + self.settings.selected.month = tempSelectedMonth; + self.settings.selected.year = tempSelectedYear; }; export default updateCalendar; From 649790a522babdffa01ba8d82683d9fbcaf970a0 Mon Sep 17 00:00:00 2001 From: Yury Uvarov Date: Wed, 26 Apr 2023 15:04:55 +0300 Subject: [PATCH 2/2] fix docs --- docs/en/reference/main/initialize-and-update.mdx | 9 ++++----- docs/ru/reference/main/initialize-and-update.mdx | 11 +++++------ 2 files changed, 9 insertions(+), 11 deletions(-) diff --git a/docs/en/reference/main/initialize-and-update.mdx b/docs/en/reference/main/initialize-and-update.mdx index 9dab5548..c6d99204 100644 --- a/docs/en/reference/main/initialize-and-update.mdx +++ b/docs/en/reference/main/initialize-and-update.mdx @@ -9,14 +9,13 @@ calendar.init(); You can also update the calendar with the new settings at any time using the `update()` method. +The `update()` method, unlike `reset()`, saves the user's selected dates, month, and year after the update. + ```js calendar.settings.lang = 'de-AT'; calendar.settings.iso8601 = false; -calendar.update(); -``` -Or reset using the `reset()` method. - -```js +calendar.update(); +// or calendar.reset(); ``` diff --git a/docs/ru/reference/main/initialize-and-update.mdx b/docs/ru/reference/main/initialize-and-update.mdx index de6f0bfb..af4d69a7 100644 --- a/docs/ru/reference/main/initialize-and-update.mdx +++ b/docs/ru/reference/main/initialize-and-update.mdx @@ -7,16 +7,15 @@ const calendar = new VanillaCalendar(element, params); calendar.init(); ``` -Вы также можете обновить календарь с новыми настройками в любое время, используя метод `update()`. +Вы также можете обновить календарь с новыми настройками в любое время, используя метод `update()` или `reset()`. + +Метод `update()`, в отличие от `reset()`, сохраняет выбранные пользователем даты, месяц и год после обновления. ```js calendar.settings.lang = 'de-AT'; calendar.settings.iso8601 = false; -calendar.update(); -``` -Или сбросить, используя метод `reset()`. - -```js +calendar.update(); +// or calendar.reset(); ```