adam.goldsmith/reservations_display
1
0
Fork 0
Code Issues Pull Requests 1 Activity

Add periodic refresh of calendar data

Browse Source
This commit is contained in:
Adam Goldsmith 2021-03-31 15:01:51 -04:00
parent 4cf3b6c927
commit f0927638c9
1 changed files with 17 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/App.vue
View File

@ -6,7 +6,7 @@
import { Vue, Component, Prop, Watch } from 'vue-property-decorator'; import { Vue, Component, Prop, Watch } from 'vue-property-decorator';
import equicolor from 'equicolor'; import equicolor from 'equicolor';
import FullCalendar from '@fullcalendar/vue'; import FullCalendar, { FullCalendarComponent } from '@fullcalendar/vue';
import { CalendarProps } from '@fullcalendar/vue/options'; import { CalendarProps } from '@fullcalendar/vue/options';
import timeGridPlugin from '@fullcalendar/timegrid'; import timeGridPlugin from '@fullcalendar/timegrid';
import googleCalendarPlugin from '@fullcalendar/google-calendar'; import googleCalendarPlugin from '@fullcalendar/google-calendar';
@ -15,6 +15,7 @@ import '@fullcalendar/core/main.css';
import '@fullcalendar/daygrid/main.css'; import '@fullcalendar/daygrid/main.css';
import '@fullcalendar/timegrid/main.css'; import '@fullcalendar/timegrid/main.css';
import { EventInput } from '@fullcalendar/core'; import { EventInput } from '@fullcalendar/core';
import { Calendar } from '@fullcalendar/core';
const calendars: { [key: string]: string } = { const calendars: { [key: string]: string } = {
computer_lab: '6mmjp85e4732ru6skf1dda54ls@group.calendar.google.com', computer_lab: '6mmjp85e4732ru6skf1dda54ls@group.calendar.google.com',
@ -41,10 +42,10 @@ export default class App extends Vue {
height: 'auto', height: 'auto',
minTime: '8:00', minTime: '8:00',
googleCalendarApiKey: 'AIzaSyAQ46fgaqbekkmJqaKR0NCXntaJA6H8JoQ', googleCalendarApiKey: 'AIzaSyAQ46fgaqbekkmJqaKR0NCXntaJA6H8JoQ',
eventSources: Object.entries(calendars).map(([name, id]) => { eventSources: Object.entries(calendars).map(([name, id], idx) => {
return { return {
googleCalendarId: id, googleCalendarId: id,
color: colors.pop(), color: colors[idx],
eventDataTransform: this.eventDataTransform, eventDataTransform: this.eventDataTransform,
}; };
}), }),
@ -60,6 +61,19 @@ export default class App extends Vue {
}, },
}; };
created() {
// refresh data every five minutes
window.setInterval(this.refresh, 5 * 60 * 1000);
}
refresh() {
const calendarComponent = this.$refs.calendar as FullCalendarComponent;
const calendar = calendarComponent.getApi() as Calendar;
calendar.getEventSources().map((es) => {
es.refetch();
});
}
eventDataTransform(eventData: EventInput): EventInput { eventDataTransform(eventData: EventInput): EventInput {
const match = eventData.title.match(/([^\/]*) \/ ([^-]*) - (.*)/); const match = eventData.title.match(/([^\/]*) \/ ([^-]*) - (.*)/);
if (match !== null) { if (match !== null) {