Общие шаблоны

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

События

Шаблоны позволяют настраивать текст и цвет событий. Подробнее см. в:

• Пользовательское содержимое события
• Пользовательский цвет события

Lightbox

• time_picker - выпадающий выбор времени внутри lightbox

  scheduler.templates.time_picker = 
  scheduler.date.date_to_str(scheduler.config.hour_date);

• lightbox_header - определяет заголовок lightbox

  scheduler.templates.lightbox_header = function(start,end,ev){
  return scheduler.templates.event_header(ev.start_date,ev.end_date,ev) 
        + scheduler.templates.event_bar_text(ev.start_date,ev.end_date,ev);
  };

  где:

  start - (Date) начало события

  end - (Date) окончание события

  event - (object) данные события

• event_date - форматирует часть времени для даты начала и окончания события. Обычно используется другими шаблонами для отображения диапазонов времени

  scheduler.templates.event_date = function(date){
  const formatFunc = scheduler.date.date_to_str(scheduler.config.hour_date);
  return formatFunc(date);
  }

  где:

  date - (Date) дата для форматирования

Поддержка touch-устройств

В планировщике есть расширение 'quick info' для поддержки touch-устройств.

Это расширение предоставляет три шаблона:

• quick_info_content - содержимое, отображаемое во всплывающей форме редактирования

  scheduler.templates.quick_info_content = function(start, end, ev){ 
  return ev.details || ev.text;
  };

• quick_info_date - дата, отображаемая во всплывающей форме редактирования

  scheduler.templates.quick_info_date = function(start, end, ev){
  if (scheduler.isOneDayEvent(ev)){
  return scheduler.templates.day_date(start, end, ev) + " " +
  scheduler.templates.event_header(start, end, ev);
  }else{
  return scheduler.templates.week_date(start, end, ev);
  }
  };

• quick_info_title - заголовок всплывающей формы редактирования

  scheduler.templates.quick_info_title = function(start, end, ev){ 
  return ev.text.substr(0,50); 
  };

  Параметры для шаблонов поддержки touch-устройств:

  start - (Date) начало события

  end - (Date) окончание события

  event - (object) данные события

Тултипы

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

Чтобы включить эту функцию, подключите расширение Tooltip на вашей странице.

scheduler.plugins({
  tooltip: true
});

• tooltip_date_format - определяет формат даты, используемый в шаблоне текста тултипа

  scheduler.templates.tooltip_date_format="function" (date){
  const formatFunc = scheduler.date.date_to_str("%Y-%m-%d %H:%i");
  return formatFunc(date);
  }

  где:

  date - (Date) дата для форматирования

• tooltip_text - содержимое тултипов

  scheduler.templates.tooltip_text = function(start,end,ev){
  return "<b>Event:</b> "+ev.text+"
  <b>Start date:</b> " + scheduler.templates.tooltip_date_format(start)+ "
  <b>End date:</b> "+scheduler.templates.tooltip_date_format(end)"
  };

  где:

  start - (Date) начало события

  end - (Date) окончание события

  event - (object) данные события

API-шаблоны

• api_date - определяет формат даты, используемый методами API для разбора входящих дат

  scheduler.templates.api_date = function(date){
  return scheduler.date.str_to_date(scheduler.config.api_date);
  };

• load_format - определяет формат даты для запросов динамической загрузки

  scheduler.templates.load_format = function(date){
  const dateToStr_func = scheduler.date.date_to_str(scheduler.config.load_date);
  return dateToStr_func(date);
  }

• parse_date - преобразует строку даты из XML-файлов в объекты даты с помощью этого шаблона

  const cfg = scheduler.config;
  const strToDate = scheduler.date.str_to_date(cfg.date_format, cfg.server_utc);
  
  scheduler.templates.parse_date = function(date){
  return strToDate (date);
  };

• format_date - преобразует объекты даты в строки для отправки данных на сервер

  const dateToStr = scheduler.date.date_to_str("%Y-%m-%d %H:%i");
  scheduler.templates.format_date = function(date){
  return dateToStr (date);
  };

  Параметр для указанных выше API-шаблонов:

  date - (Date) дата для форматирования

• scheduler.templates.(viewName)_date - определяет дату, отображаемую в заголовке представления

  В зависимости от представления функция-шаблон получает либо:

  date - (Date) дата для форматирования (используется в Day, Month, Year, Units представлениях и Mini Calendar):

  scheduler.templates.day_date = function(date){
  const formatFunc = scheduler.date.date_to_str(scheduler.config.default_date);
  return formatFunc(date);
  };

  или:

  start - (Date) начальная дата представления

end - (Date) конечная дата представления

(для Week, Agenda, Grid, Map и Timeline представлений):

scheduler.templates.week_date = function(start, end){
return scheduler.templates.day_date(start)+" – "+
scheduler.templates.day_date(scheduler.date.add(end,-1,"day"));
};

• scheduler.templates.(viewName)_scale_date - определяет дату для ячеек дней в представлении (используется для элементов оси X в Timeline или названий дней в подзаголовке недели Mini Calendar)

  Применяется в Day, Week, Year, Timeline представлениях и Mini Calendar

  scheduler.templates.day_scale_date = function(date){
  return scheduler.date.date_to_str(scheduler.config.default_date);
  };

  где:

  date - (Date) дата для форматирования