React-samples/src/schedule/config.tsx at master · SyncfusionExamples/React-samples · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
export const ScheduleSampleOrder: Object = [
    { 'path': 'schedule/default', 'component': 'Default', 'name': 'Default Functionalities', 'order': '01', 'category': 'Schedule', 'api': '{"ScheduleComponent": [ "height", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how the flat Scheduler looks like with its default set of minimal configurations.' },
    { 'path': 'schedule/local-data', 'component': 'LocalData', 'name': 'Local Data', 'order': '02', 'category': 'Data Binding', 'api': '{"ScheduleComponent": [ "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the way of binding an array of JavaScript objects (local JSON datasource).' },
    { 'path': 'schedule/remote-data', 'component': 'RemoteData', 'name': 'Remote Data', 'order': '02', 'category': 'Data Binding', 'api': '{"ScheduleComponent": [ "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the way of binding remote services by using the DataManager.' },
    { 'path': 'schedule/default-events', 'component': 'DefaultEvents', 'name': 'Normal', 'order': '03', 'category': 'Appointments', 'api': '{"ScheduleComponent": [ "width", "height", "currentView", "eventSettings","selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the usage of different types of events such as normal, spanned and all-day.' },
    { 'path': 'schedule/recurrence-events', 'component': 'RecurrenceEvents', 'name': 'Recurrence', 'order': '03', 'category': 'Appointments', 'api': '{"ScheduleComponent": [ "width", "height", "currentView", "selectedDate", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the scheduler with recurring meetings handled on a regular pattern.' },
    { 'path': 'schedule/timezone', 'component': 'TimeZone', 'name': 'Timezone', 'order': '03', 'category': 'Appointments', 'api': '{"ScheduleComponent": [ "timezone", "selectedDate", "eventSettings", "eventRendered" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how the events are displayed in different timings as per the selected timezone.' },
    { 'path': 'schedule/views', 'component': 'Views', 'name': 'Basic Views', 'order': '04', 'category': 'Views', 'api': '{"ScheduleComponent": [ "currentView", "views", "selectedDate", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the usage of basic views such as Day, Week, Work Week and Month.' },
    { 'path': 'schedule/timeline', 'component': 'TimelineView', 'name': 'Timeline Views', 'order': '04', 'category': 'Views', 'type': 'new', 'api': '{"ScheduleComponent": [ "height", "eventSettings", "selectedDate"  ] }', 'description': 'This demo for Essential JS2 Schedule control shows how the timeline scheduler looks like with its default set of configurations.' },
    { 'path': 'schedule/agenda', 'component': 'AgendaView', 'name': 'Agenda View', 'order': '04', 'category': 'Views', 'api': '{"ScheduleComponent": [ "agendaDaysCount", "hideEmptyAgendaDays", "currentView", "views", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the agenda view and the configurations available in it.' },
    { 'path': 'schedule/month-agenda', 'component': 'MonthAgendaView', 'name': 'Month Agenda View', 'order': '04', 'category': 'Views', 'api': '{"ScheduleComponent": [ "currentView", "views",  "selectedDate", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the layout of Month Agenda view and how it works.' },
    { 'path': 'schedule/views-configuration', 'component': 'ViewConfigurations', 'name': 'Individual View Settings', 'order': '04', 'category': 'Views', 'api': '{"ScheduleComponent": [ "currentView", "views", "selectedDate", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to customize each of the view with specific configurations.' },
    { 'path': 'schedule/extended-views', 'component': 'ExtendedViews', 'name': 'View Intervals', 'order': '04', 'category': 'Views', 'api': '{"ScheduleComponent": [ "currentView", "views", "selectedDate", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to display n number of days, weeks and months on a single view.' },
    { 'path': 'schedule/timeline-resources', 'component': 'TimelineResource', 'name': 'Room Scheduler', 'order': '05', 'category': 'Multiple Resources', 'type': 'new', 'api': '{"ScheduleComponent": [ "currentView", "views", "selectedDate", "eventSettings", "resourceHeaderTemplate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to design the room scheduling calendar and manage the events booked on a particular time interval.' },
    { 'path': 'schedule/resources', 'component': 'Resources', 'name': 'Fare Calendar', 'order': '05', 'category': 'Multiple Resources', 'api': '{"ScheduleComponent": [ "currentView", "views", "selectedDate", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to customize the scheduler to showcase it as an Airfare calendar.' },
    { 'path': 'schedule/group-editing', 'component': 'GroupEditing', 'name': 'Shared Events', 'order': '05', 'category': 'Multiple Resources', 'type': 'update', 'api': '{"ScheduleComponent": [ "resourceHeaderTemplate", "group", "resources", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the usage of single event that are shared by multiple resources.' },
    { 'path': 'schedule/group-custom-work-days', 'component': 'GroupCustomWorkDays', 'name': 'Different Work Days', 'order': '05', 'category': 'Multiple Resources', 'api': '{"ScheduleComponent": [ "resourceHeaderTemplate", "group", "resources", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to set different working days for each of the resources.' },
    { 'path': 'schedule/add-remove-resources', 'component': 'AddRemoveResources', 'name': 'Show/Hide Resources', 'order': '05', 'category': 'Multiple Resources', 'type': 'update', 'api': '{"ScheduleComponent": [ "currentView", "views", "selectedDate", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to dynamically add or remove the resources to and from the scheduler layout.' },
    { 'path': 'schedule/resource-grouping', 'component': 'Group', 'name': 'Horizontal Grouping', 'order': '06', 'category': 'Resource Grouping', 'api': '{"ScheduleComponent": [ "resourceHeaderTemplate", "group", "resources", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how the calendars of multiple resources are grouped in default view layouts.' },
    { 'path': 'schedule/timeline-resource-grouping', 'component': 'TimelineGrouping', 'name': 'Timeline Grouping', 'order': '06', 'category': 'Resource Grouping', 'type': 'new', 'api': '{"ScheduleComponent": [ "group", "resources", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how the calendars of multiple resources are grouped in timeline view layouts.' },
    { 'path': 'schedule/group-by-date', 'component': 'GroupByDate', 'name': 'Date-wise Grouping', 'order': '06', 'category': 'Resource Grouping', 'api': '{"ScheduleComponent": [  "group", "resources", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how the resources are grouped under each date.' },
    { 'path': 'schedule/group-by-child', 'component': 'GroupByChild', 'name': 'Hierarchical Grouping', 'order': '06', 'category': 'Resource Grouping', 'api': '{"ScheduleComponent": [ "startHour", "endHour", "group", "resources", "eventSettings" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to group the child level resources against each of the parent level resources.' },
    { 'path': 'schedule/cell-template', 'component': 'CellTemplate', 'name': 'Cell', 'order': '07', 'category': 'Template', 'api': '{"ScheduleComponent": [ "width", "height", "cellTemplate", "views", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to customize the background of the specific cells using cell template option.' },
    { 'path': 'schedule/date-header-template', 'component': 'DateHeaderTemplate', 'name': 'Date Header', 'order': '07', 'category': 'Template', 'type': 'update', 'api': '{"ScheduleComponent": [ "cssClass", "dateHeaderTemplate", "eventRendered", "eventSettings", "renderCell" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to customize the date header cells using the template option.' },
    { 'path': 'schedule/event-template', 'component': 'EventTemplate', 'name': 'Events', 'order': '07', 'category': 'Template', 'type': 'update', 'api': '{"ScheduleComponent": [ "width", "height", "cellTemplate", "views", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to customize the appearance of events using event template option.' },
    { 'path': 'schedule/tooltip', 'component': 'Tooltip', 'name': 'Tooltip', 'order': '07', 'category': 'Template', 'api': '{"ScheduleComponent": [ "width", "height", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to display tooltip over events as well as the way to customize it using template option.' },
    { 'path': 'schedule/editor-validation', 'component': 'EditorFieldValidation', 'name': 'Field Validation', 'order': '08', 'category': 'Editor Window', 'api': '{"ScheduleComponent": [ "width", "height", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the way of adding default and custom validation rules to the editor fields of scheduler.' },
    { 'path': 'schedule/editor-custom-field', 'component': 'EditorCustomField', 'name': 'Additional Fields', 'order': '08', 'category': 'Editor Window', 'api': '{"ScheduleComponent": [ "selectedDate", "eventSettings", "popupOpen" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to add additional fields to the default editor window.' },
    { 'path': 'schedule/editor-template', 'component': 'EditorTemplate', 'name': 'Editor Template', 'order': '08', 'category': 'Editor Window', 'api': '{"ScheduleComponent": [ "editorTemplate", "showQuickInfo", "eventRendered", "popupOpen", "actionBegin" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the way of customizing the default editor window with custom template design.' },
    { 'path': 'schedule/header-rows', 'component': 'HeaderRows', 'name': 'Header Rows', 'order': '09', 'category': 'Customization', 'type': 'new', 'api': '{"ScheduleComponent": [  "height",  "eventSettings", "selectedDate" ,"headerRows" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to display the additional header rows on timeline view.' },
    { 'path': 'schedule/time-scale', 'component': 'Timescale', 'name': 'Timescale', 'order': '09', 'category': 'Customization', 'type': 'update', 'api': '{"ScheduleComponent": [ "width", "height", "views", "timeScale" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to customize the grid lines of scheduler with different duration and count' },
    { 'path': 'schedule/header-bar', 'component': 'HeaderBar', 'name': 'Header Bar', 'order': '09', 'category': 'Customization', 'api': '{"ScheduleComponent": [ "width", "height", "workHours", "views", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the way of adding custom items onto the scheduler header bar.' },
    { 'path': 'schedule/scroll-to', 'component': 'ScrollTo', 'name': 'Scroll Time', 'order': '09', 'category': 'Customization', 'type': 'update', 'api': '{"ScheduleComponent": [ "width", "height", "eventSettings", "eventRendered", "scrollTo" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the way of manually scrolling to specific time on scheduler.' },
    { 'path': 'schedule/work-days', 'component': 'WorkDays', 'name': 'Work Days', 'order': '09', 'category': 'Customization', 'type': 'update', 'api': '{"ScheduleComponent": [ "workDays", "views", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control showcases how to set customized working days as well as first day of a week on scheduler.' },
    { 'path': 'schedule/hide-weekend', 'component': 'HideWeekend', 'name': 'Hide Weekend', 'order': '09', 'category': 'Customization', 'type': 'update', 'api': '{"ScheduleComponent": [ "showWeekend" ] }', 'description': 'This demo for Essential JS2 Schedule control depicts the way to show or hide the weekend days of a week.' },
    { 'path': 'schedule/work-hours', 'component': 'WorkHours', 'name': 'Work Hours', 'order': '09', 'category': 'Customization', 'type': 'update', 'api': '{"ScheduleComponent": [ "workHours", "views", "eventSettings", "selectedDate" ] }', 'description': 'This demo for Essential JS2 Schedule control showcases how to set the work hour range on scheduler.' },
    { 'path': 'schedule/start-end-hour', 'component': 'DayHourLimit', 'name': 'Day Hour Limit', 'order': '09', 'category': 'Customization', 'type': 'update', 'api': '{"ScheduleComponent": [ "startHour", "endHour", "workHours", "eventRendered" ] }', 'description': 'This demo for Essential JS2 Schedule control depicts how to restrict the start and end hours on scheduler.' },
    { 'path': 'schedule/cell-dimension', 'component': 'CellDimension', 'name': 'Cell Dimension', 'order': '09', 'category': 'Customization', 'api': '{"ScheduleComponent": [ "cssClass", "showTimeIndicator", "eventRendered", "created",  "actionComplete" ] }', 'description': 'This demo for Essential JS2 Schedule control shows how to set the width and height of the cells by overriding the default CSS classes.' },
    { 'path': 'schedule/read-only-events', 'component': 'ReadonlyEvents', 'name': 'Read-only Events', 'order': '09', 'category': 'Customization', 'api': '{"ScheduleComponent": [ "eventSettings", "eventRendered", "eventClick", "popupOpen", "eventRendered"] }', 'description': 'This demo for Essential JS2 Schedule control shows how to make specific events on the scheduler to be displayed in a read-only mode.' },
    { 'path': 'schedule/recurrence-editor-generate-rule', 'component': 'RuleGenerate', 'name': 'Rule Generator', 'order': '10', 'category': 'Recurrence Editor', 'description': 'This demo for Essential JS2 Schedule control showcases the recurrence rule generation based on the options selected from the recurrence editor.' },
    { 'path': 'schedule/recurrence-editor-populate-rule', 'component': 'PopulateRule', 'name': 'Populate Rule', 'order': '10', 'category': 'Recurrence Editor', 'description': 'This demo for Essential JS2 Schedule control shows how to fill the recurrence editor fields with values based on the provided recurrence rule string.' },
    { 'path': 'schedule/keyboard-interaction', 'component': 'KeyboardInteraction', 'name': 'Keyboard Interaction', 'order': '11', 'category': 'Miscellaneous', 'api': '{"ScheduleComponent": [ "width", "height", "eventSettings", "selectedDate", "allowKeyboardInteraction" ] }', 'description': 'This demo for Essential JS2 Schedule control showcases the keyboard shortcuts available on scheduler.' },
    { 'path': 'schedule/events', 'component': 'Events', 'name': 'Events', 'order': '11', 'category': 'Miscellaneous', 'api': '{"ScheduleComponent": [ "width", "height", "eventSettings",  "eventRendered", "created", "actionBegin", "actionComplete", "actionFailure", "cellClick", "cellDoubleClick", "destroyed", "navigating", "eventClick", "popupOpen" ] }', 'description': 'This demo for Essential JS2 Schedule control shows the client-side events that triggers on respective scheduler actions.' }
]