{
  viewType: "Resources",
  locale: "en-us",
  columnWidthSpec: "Auto",
  headerLevels: 1,
  headerHeight: 30,
  cellDuration: 30,
  cellHeight: 30,
  crosshairType: "Header",
  businessBeginsHour: 9,
  businessEndsHour: 17,
  dayBeginsHour: 0,
  dayEndsHour: 24,
  showCurrentTime: false,
  eventArrangement: "Cascade",
  allowEventOverlap: true,
  timeRangeSelectedHandling: "Enabled",
  onTimeRangeSelected: async (args) => {
    const modal = await DayPilot.Modal.prompt("Create a new event:", "Event 1");
    const calendar = args.control;
    calendar.clearSelection();
    if (modal.canceled) { return; }
    calendar.events.add({
      start: args.start,
      end: args.end,
      id: DayPilot.guid(),
      text: modal.result,
      resource: args.resource
    });
  },
  eventDeleteHandling: "Disabled",
  eventMoveHandling: "Update",
  onEventMoved: (args) => {
    console.log("Event moved: " + args.e.text());
  },
  eventResizeHandling: "Update",
  onEventResized: (args) => {
    console.log("Event resized: " + args.e.text());
  },
  eventClickHandling: "Disabled",
  eventHoverHandling: "Disabled",
}

[
  {
    "name": "Resource 1",
    "id": "R1"
  },
  {
    "name": "Resource 2",
    "id": "R2"
  },
  {
    "name": "Resource 3",
    "id": "R3"
  },
  {
    "name": "Resource 4",
    "id": "R4"
  }
]

[
  {
    "id": "1",
    "start": "2025-03-29T10:00:00",
    "end": "2025-03-29T12:00:00",
    "text": "Event 1",
    "resource": "R1"
  },
  {
    "id": "2",
    "start": "2025-03-29T11:00:00",
    "end": "2025-03-29T14:00:00",
    "text": "Event 2",
    "resource": "R1"
  }
]