HTWK/htwkalender-pwa
1
0
Fork 0
mirror of https://gitlab.dit.htwk-leipzig.de/htwk-software/htwkalender-pwa.git synced 2025-07-16 09:38:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch '5-async-calendar-edit' into 'main'

Browse Source 
Resolve "async calendar edit"

Closes #5

See merge request htwk-software/htwkalender-pwa!9
This commit is contained in:
Elmar Kresse
2024-08-13 17:21:23 +00:00
parent b00528dfc1 b848d26704
commit be82f52414
9 changed files with 134 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/api/fetchRoomOccupancy.ts
View File

@ -78,10 +78,10 @@ export async function fetchRoomOccupancy(
}
let roomOccupancyList: RoomOccupancyList = new RoomOccupancyList(
new Date(),
0,
0,
[],
new Date(),
0,
0,
[],
);
await fetch("/api/schedule/rooms?from=" + from_date + "&to=" + to_date)

10
frontend/src/api/loadCalendar.ts
View File

@ -15,7 +15,8 @@
//along with this program. If not, see <https://www.gnu.org/licenses/>.
import { Module } from "../model/module";
import { Calendar } from "../model/calendar";
import tokenStore from "@/store/tokenStore.ts";
import { Calendar } from "@/model/calendar.ts";
export async function getCalender(token: string): Promise<Module[]> {
const request = new Request("/api/collections/feeds/records/" + token, {
@ -24,9 +25,10 @@ export async function getCalender(token: string): Promise<Module[]> {
return await fetch(request).then((response) => {
if (response.ok) {
return response
.json()
.then((calendarResponse: Calendar) => calendarResponse.modules);
return response.json().then((calendarResponse: Calendar) => {
tokenStore().feed = calendarResponse;
return calendarResponse.modules;
});
} else {
return [];
}

34
frontend/src/components/RoomOccupationOffline.vue
View File

@ -21,16 +21,16 @@ import FullCalendar from "@fullcalendar/vue3";
import dayGridPlugin from "@fullcalendar/daygrid";
import interactionPlugin from "@fullcalendar/interaction";
import timeGridPlugin from "@fullcalendar/timegrid";
import {computed, ComputedRef, inject, ref, Ref, watch} from "vue";
import {CalendarOptions, DatesSetArg, EventInput} from "@fullcalendar/core";
import {useI18n} from "vue-i18n";
import { computed, ComputedRef, inject, ref, Ref, watch } from "vue";
import { CalendarOptions, DatesSetArg, EventInput } from "@fullcalendar/core";
import { useI18n } from "vue-i18n";
import allLocales from "@fullcalendar/core/locales-all";
import router from "@/router";
import {formatYearMonthDay} from "@/helpers/dates";
import {useQuery} from "@tanstack/vue-query";
import {fetchRoomOccupancy} from "@/api/fetchRoomOccupancy";
import {isValid} from "date-fns";
import {RoomOccupancyList} from "@/model/roomOccupancyList";
import { formatYearMonthDay } from "@/helpers/dates";
import { useQuery } from "@tanstack/vue-query";
import { fetchRoomOccupancy } from "@/api/fetchRoomOccupancy";
import { isValid } from "date-fns";
import { RoomOccupancyList } from "@/model/roomOccupancyList";
const { t } = useI18n({ useScope: "global" });
@ -78,15 +78,15 @@ const selectedRoom = computed(() => props.room);
*/
function transformData(data: RoomOccupancyList) {
return data
.decodeOccupancy(
selectedRoom.value,
new Date(currentDateFrom.value),
new Date(currentDateTo.value),
)
.map((event, index) => ({
id: index,
event: event,
}));
.decodeOccupancy(
selectedRoom.value,
new Date(currentDateFrom.value),
new Date(currentDateTo.value),
)
.map((event, index) => ({
id: index,
event: event,
}));
}
const { data: occupancy } = useQuery({

9
frontend/src/i18n/translations/en.json
View File

@ -95,8 +95,13 @@
"error": "Error",
"successDetail": "calendar successfully deleted",
"errorDetail": "calendar could not be deleted",
"successDetailLoad": "calendar successfully loaded"
}
"successDetailLoad": "calendar successfully loaded",
"info": "info"
},
"calendarContainsNoModules": "calendar contains no modules",
"noCalendarInOfflineMode": "calendar isn't available in offline mode",
"calendarLoadedFromOfflineMode": "calendar loaded from offline cache",
"calendarLoadedFromServer": "calendar loaded from web"
},
"additionalModules": {
"subTitle": "select additional modules that are not listed in the regular semester for your course",

36
frontend/src/model/roomOccupancyList.ts
View File

@ -14,7 +14,7 @@
//You should have received a copy of the GNU Affero General Public License
//along with this program. If not, see <https://www.gnu.org/licenses/>.
import {Binary, Document} from "bson";
import { Binary, Document } from "bson";
import { AnonymizedOccupancy } from "./event";
import {
Duration,
@ -218,31 +218,38 @@ export class RoomOccupancyList {
// Iterate over all bits in the current byte
for (let bit_i = 0; bit_i < 8; bit_i++) {
const isOccupied = (byte & (1 << (7 - bit_i))) !== 0;
const calculateOccupancyBitIndex = (byte_i: number, bit_i: number) => byte_i * 8 + bit_i;
const calculateOccupancyBitIndex = (byte_i: number, bit_i: number) =>
byte_i * 8 + bit_i;
if(firstOccupancyBit === null){
if (firstOccupancyBit === null) {
if (isOccupied) {
firstOccupancyBit = calculateOccupancyBitIndex(byte_i, bit_i);
}
} else {
if (!isOccupied) {
const startTime = addMinutes(start, firstOccupancyBit * granularity);
const endTime = addMinutes(start, calculateOccupancyBitIndex(byte_i, bit_i) * granularity);
const startTime = addMinutes(
start,
firstOccupancyBit * granularity,
);
const endTime = addMinutes(
start,
calculateOccupancyBitIndex(byte_i, bit_i) * granularity,
);
// add event between start and end of a block of boolean true values
occupancyList.push(
new AnonymizedOccupancy(
startTime.toISOString(),
endTime.toISOString(),
room,
false,
false,
),
new AnonymizedOccupancy(
startTime.toISOString(),
endTime.toISOString(),
room,
false,
false,
),
);
firstOccupancyBit = null;
}
}
}
}
}
// add last event if it is still ongoing
if (firstOccupancyBit !== null) {
const startTime = addMinutes(start, firstOccupancyBit * granularity);
@ -315,7 +322,8 @@ export class RoomOccupancyList {
json.granularity,
json.blocks,
json.rooms.map(
(room: { name: string, occupancy: Binary }) => new RoomOccupancy(room.name, room.occupancy),
(room: { name: string; occupancy: Binary }) =>
new RoomOccupancy(room.name, room.occupancy),
),
);
}

10
frontend/src/store/tokenStore.ts
View File

@ -15,10 +15,20 @@
//along with this program. If not, see <https://www.gnu.org/licenses/>.
import { defineStore } from "pinia";
import { useLocalStorage } from "@vueuse/core";
import { Calendar } from "../model/calendar";
const tokenStore = defineStore("tokenStore", {
state: () => ({
token: "",
feed: useLocalStorage("feed", {
collectionId: "",
collectionName: "",
created: "",
id: "",
modules: [],
updated: "",
} as Calendar),
}),
persist: true,
actions: {

65
frontend/src/view/EditCalendarView.vue
View File

@ -50,22 +50,67 @@ function loadCalendar(): void {
moduleStore().removeAllModules();
tokenStore().setToken(token.value);
getCalender(token.value).then((data: Module[]) => {
if (data.length > 0) {
data.forEach((module) => {
moduleStore().addModule(module);
});
modules.value = moduleStore().modules;
router.push("/edit-calendar");
if (navigator.onLine) {
getCalender(token.value).then((data: Module[]) => {
if (data.length > 0) {
data.forEach((module) => {
moduleStore().addModule(module);
});
modules.value = moduleStore().modules;
toast.add({
severity: "success",
summary: t("editCalendarView.toast.success"),
detail: t("editCalendarView.calendarLoadedFromServer"),
life: 3000,
});
router.push("/edit-calendar");
} else {
toast.add({
severity: "error",
summary: t("editCalendarView.toast.error"),
detail: t("editCalendarView.noCalendarFound"),
life: 3000,
});
}
});
} else {
if(tokenStore().feed.id === token.value) {
// get data from tokenStore feed if offline
const offlineModules = tokenStore().feed.modules;
if (offlineModules.length > 0) {
offlineModules.forEach((module) => {
moduleStore().addModule(module);
});
toast.add({
severity: "info",
summary: t("editCalendarView.toast.info"),
detail: t("editCalendarView.calendarLoadedFromOfflineMode"),
life: 3000,
});
} else {
toast.add({
severity: "info",
summary: t("editCalendarView.info"),
detail: t("editCalendarView.calendarContainsNoModules"),
life: 3000,
});
}
} else {
toast.add({
severity: "error",
summary: t("editCalendarView.error"),
detail: t("editCalendarView.noCalendarFound"),
summary: t("editCalendarView.toast.error"),
detail: t("editCalendarView.noCalendarInOfflineMode"),
life: 3000,
});
return;
}
modules.value = moduleStore().modules;
router.push("/edit-calendar");
}
});
}
</script>

3
frontend/src/view/UserCalendar.vue
View File

@ -12,6 +12,7 @@ const { t } = useI18n({ useScope: "global" });
const toast = useToast();
const token = ref(tokenStore().token || ("" as string));
const calendarViewerRef = ref<InstanceType<typeof CalendarViewer>>();
// parse token from query parameter
const urlParams = new URLSearchParams(window.location.search);
@ -22,8 +23,6 @@ if (tokenFromUrl) {
loadCalendar();
}
const calendarViewerRef = ref<InstanceType<typeof CalendarViewer>>();
function loadCalendar() {
try {
token.value = extractToken(token.value);

12
frontend/vite.config.ts
View File

@ -96,6 +96,18 @@ export default defineConfig({
},
},
},
{
// Add the runtime caching strategy for /api/modules
urlPattern: ({url}) => url.pathname.startsWith('/api/modules'),
method: 'GET',
handler: 'NetworkFirst',
options: {
cacheName: 'modules-cache',
expiration: {
maxAgeSeconds: 24 * 60 * 60, // 1 day
},
},
},
{
urlPattern: /^https?.*/,
handler: "NetworkFirst",