Use Resource TimeGrid view; we can use it for free since we are a non-profit
This commit is contained in:
parent
134fdd5d08
commit
fc487ee0b8
@ -25,7 +25,7 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@fullcalendar/core": "^5.10.0",
|
"@fullcalendar/core": "^5.10.0",
|
||||||
"@fullcalendar/icalendar": "^5.10.1",
|
"@fullcalendar/icalendar": "^5.10.1",
|
||||||
"@fullcalendar/timegrid": "^5.6.0",
|
"@fullcalendar/resource-timegrid": "^5.10.1",
|
||||||
"core-js": "^3.19.1",
|
"core-js": "^3.19.1",
|
||||||
"ical.js": "github:ekreative/ical.js#var-ical",
|
"ical.js": "github:ekreative/ical.js#var-ical",
|
||||||
"intl": "^1.2.5",
|
"intl": "^1.2.5",
|
||||||
|
31
src/index.ts
31
src/index.ts
@ -8,9 +8,8 @@ if (!window.Intl) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
import { EventInput, Calendar, CalendarOptions } from '@fullcalendar/core';
|
import { EventInput, Calendar, CalendarOptions } from '@fullcalendar/core';
|
||||||
import dayGridPlugin from '@fullcalendar/daygrid';
|
|
||||||
import timeGridPlugin from '@fullcalendar/timegrid';
|
|
||||||
import iCalendarPlugin from '@fullcalendar/icalendar';
|
import iCalendarPlugin from '@fullcalendar/icalendar';
|
||||||
|
import resourceTimeGridPlugin from '@fullcalendar/resource-timegrid';
|
||||||
|
|
||||||
import { unique_colors } from 'unique-colors';
|
import { unique_colors } from 'unique-colors';
|
||||||
|
|
||||||
@ -27,28 +26,30 @@ const calendars: { [key: string]: string } = {
|
|||||||
const colors: string[] = unique_colors(Object.keys(calendars).length);
|
const colors: string[] = unique_colors(Object.keys(calendars).length);
|
||||||
|
|
||||||
const urlParams = new URLSearchParams(window.location.search);
|
const urlParams = new URLSearchParams(window.location.search);
|
||||||
const toolFilter: string | null = urlParams.get('tool');
|
const toolFilter: string[] | undefined = urlParams.get('tool')?.split(';');
|
||||||
|
|
||||||
function eventDataTransform(eventData: EventInput): EventInput | false {
|
function eventDataTransform(eventData: EventInput): EventInput {
|
||||||
// clear the url to prevent clicking on the event
|
// clear the url to prevent clicking on the event
|
||||||
delete eventData.url;
|
delete eventData.url;
|
||||||
|
|
||||||
const match = eventData?.title?.match(/([^\/]*) \| ([^-]*) - (.*)/);
|
const match = eventData?.title?.match(/([^\/]*) \| ([^-]*) - (.*)/);
|
||||||
if (match) {
|
if (match) {
|
||||||
const [, member, shop, tool] = match;
|
const [, member, shop, tool] = match;
|
||||||
eventData.title = `${tool} - ${member}`;
|
eventData.title = `${member}`;
|
||||||
if (toolFilter === null || tool.includes(toolFilter)) {
|
eventData.resourceId = tool;
|
||||||
|
if (!toolFilter) {
|
||||||
|
calendar.addResource({ id: tool, title: tool }, false);
|
||||||
|
}
|
||||||
|
}
|
||||||
return eventData;
|
return eventData;
|
||||||
}
|
|
||||||
}
|
|
||||||
return false;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const calendarOptions: CalendarOptions = {
|
const calendarOptions: CalendarOptions = {
|
||||||
plugins: [timeGridPlugin, dayGridPlugin, iCalendarPlugin],
|
schedulerLicenseKey: 'CC-Attribution-NonCommercial-NoDerivatives',
|
||||||
|
plugins: [iCalendarPlugin, resourceTimeGridPlugin],
|
||||||
allDaySlot: false,
|
allDaySlot: false,
|
||||||
nowIndicator: true,
|
nowIndicator: true,
|
||||||
initialView: 'timeGridWeek',
|
initialView: 'resourceTimeGrid',
|
||||||
height: 'auto',
|
height: 'auto',
|
||||||
slotMinTime: '8:00',
|
slotMinTime: '8:00',
|
||||||
slotMaxTime: '22:00',
|
slotMaxTime: '22:00',
|
||||||
@ -75,6 +76,14 @@ const calendarOptions: CalendarOptions = {
|
|||||||
minute: '2-digit',
|
minute: '2-digit',
|
||||||
hour12: false,
|
hour12: false,
|
||||||
},
|
},
|
||||||
|
resources: toolFilter
|
||||||
|
? toolFilter.map((tool) => {
|
||||||
|
return {
|
||||||
|
id: tool,
|
||||||
|
title: tool,
|
||||||
|
};
|
||||||
|
})
|
||||||
|
: [],
|
||||||
};
|
};
|
||||||
|
|
||||||
const calendarEl = document.getElementById('calendar');
|
const calendarEl = document.getElementById('calendar');
|
||||||
|
Loading…
Reference in New Issue
Block a user