Перевод названий месяцев

В стандартной конфигурации Pikaday использует английские названия месяцев, заданные через встроенный массив локали. Для поддержки других языков применяется механизм локализации через объект i18n, где ключевые строки календаря заменяются на пользовательские значения.

Основной набор, отвечающий за отображение месяцев, задаётся свойством i18n.months. Это массив строк длиной 12 элементов, где каждый индекс соответствует порядковому номеру месяца, начиная с января.

const picker = new Pikaday({
    field: document.getElementById('datepicker'),
    i18n: {
        months: [
            'Январь',
            'Февраль',
            'Март',
            'Апрель',
            'Май',
            'Июнь',
            'Июль',
            'Август',
            'Сентябрь',
            'Октябрь',
            'Ноябрь',
            'Декабрь'
        ]
    }
});

Внутренне Pikaday использует индекс месяца из объекта Date, где январь соответствует 0, а декабрь — 11. Поэтому критически важно соблюдать строгий порядок элементов массива. Любое смещение приведёт к некорректному отображению календаря, особенно при переключении между месяцами.

Привязка к системному объекту Date

JavaScript-объект Date возвращает номер месяца методом getMonth(), который всегда возвращает значение в диапазоне от 0 до 11. Pikaday напрямую использует это значение для выбора строки из массива i18n.months.

const date = new Date();
console.log(date.getMonth()); // 0–11

Таким образом, механизм отображения названия месяца представляет собой прямую индексацию:

i18n.months[date.getMonth()]

Любое нарушение соответствия индексов приводит к логическим ошибкам отображения интерфейса.

Поддержка сокращённых названий месяцев

Помимо полного списка месяцев, Pikaday использует отдельное поле i18n.monthsShort. Оно применяется в компактных интерфейсах, где требуется сокращённая форма отображения.

i18n: {
    months: [
        'Январь', 'Февраль', 'Март', 'Апрель',
        'Май', 'Июнь', 'Июль', 'Август',
        'Сентябрь', 'Октябрь', 'Ноябрь', 'Декабрь'
    ],
    monthsShort: [
        'Янв', 'Фев', 'Мар', 'Апр',
        'Май', 'Июн', 'Июл', 'Авг',
        'Сен', 'Окт', 'Ноя', 'Дек'
    ]
}

Сокращённые названия используются в заголовках календаря и при ограниченном пространстве интерфейса, когда отображение полного слова приводит к визуальной перегрузке.

Механизм подстановки значений

Pikaday не выполняет автоматическую трансформацию строк (например, не формирует сокращения самостоятельно). Все значения должны быть предоставлены в готовом виде. Это означает, что разработчик полностью контролирует форму отображения месяцев, включая:

  • падежи;
  • сокращения;
  • транслитерацию;
  • региональные варианты написания.

Пример с альтернативной формой, где месяцы представлены в родительном падеже:

i18n: {
    months: [
        'января',
        'февраля',
        'марта',
        'апреля',
        'мая',
        'июня',
        'июля',
        'августа',
        'сентября',
        'октября',
        'ноября',
        'декабря'
    ]
}

Такой подход используется при необходимости формирования текстовых дат, например «15 марта 2026».

Разделение отображения и логики

Важным аспектом является то, что локализация в Pikaday влияет только на визуальное представление. Внутренние данные календаря остаются неизменными и продолжают использовать стандартный формат Date.

Это означает:

  • логика вычисления дат не зависит от i18n;
  • сортировка и сравнение дат остаются неизменными;
  • локализация влияет исключительно на слой отображения.

Ошибки при настройке массива месяцев

Часто встречающиеся ошибки связаны с нарушением структуры массива:

1. Неполный массив

months: ['Январь', 'Февраль'] // ошибка

Результат — некорректные подписи или undefined в интерфейсе при обращении к отсутствующим индексам.

2. Нарушение порядка

months: [
    'Февраль',
    'Январь',
    'Март',
    ...
]

В этом случае отображение месяцев будет логически смещено, так как индекс больше не соответствует реальному номеру месяца.

3. Использование объекта вместо массива

months: {
    jan: 'Январь',
    feb: 'Февраль'
}

Такой формат не поддерживается, поскольку Pikaday ожидает строго индексируемую структуру.

Динамическая локализация

В некоторых сценариях требуется смена языка календаря после инициализации. Pikaday не всегда поддерживает полную динамическую замену локали без пересоздания экземпляра, поэтому используется пересоздание объекта с новым i18n.

picker.destroy();

picker = new Pikaday({
    field: document.getElementById('datepicker'),
    i18n: {
        months: [
            'January', 'February', 'March',
            'April', 'May', 'June',
            'July', 'August', 'September',
            'October', 'November', 'December'
        ]
    }
});

Этот подход гарантирует корректное обновление интерфейса без рассинхронизации внутренних состояний.

Связь с другими параметрами локализации

Массив months работает совместно с другими элементами i18n, такими как:

  • weekdays — полные названия дней недели;
  • weekdaysShort — сокращённые названия дней;
  • previousMonth и nextMonth — подписи кнопок навигации;
  • showMonthAfterYear — управление порядком отображения заголовка.

Несогласованность между этими параметрами может приводить к визуальному разрыву интерфейса, особенно при мультиязычных конфигурациях.

Региональные особенности отображения месяцев

В разных языках структура названий месяцев может существенно отличаться. Pikaday не накладывает ограничений на формат строк, поэтому допускаются:

  • числовые обозначения;
  • комбинированные форматы;
  • сокращения с точками;
  • транслитерация латиницей.

Пример смешанного формата:

months: [
    '01 · Январь',
    '02 · Февраль',
    '03 · Март',
    ...
]

Такая гибкость позволяет адаптировать календарь под корпоративные интерфейсы и специфические требования дизайна.

Влияние на UX-компоненты календаря

Отображение месяцев напрямую влияет на восприятие навигации в календаре. Особенно это заметно при:

  • быстром переключении месяцев;
  • отображении диапазонов дат;
  • использовании календаря в мобильных интерфейсах.

Короткие и однозначные названия повышают читаемость интерфейса, тогда как длинные строки могут вызывать переносы и визуальные искажения в компактных контейнерах.

Согласованность данных при мультиязычности

При поддержке нескольких языков важно сохранять одинаковую структуру массива months для всех локалей. Различие должно касаться только значений, но не количества элементов и их порядка. Это обеспечивает стабильную работу календаря при переключении языков без пересчёта логики отображения.

Оглавление