feat: front-end overhaul. added search, editing, event view, validation

2026-02-04 13:40:13 +01:00 · 2025-05-19 04:36:28 +02:00
parent 82936633f1
commit ace54fb4ef
20 changed files with 490 additions and 89 deletions
--- a/WebApp/ts/eventView.ts
+++ b/WebApp/ts/eventView.ts
@@ -0,0 +1,95 @@
+import { getEvent, getMyAccount, unhideElementById } from './generalUseHelpers.js';
+
+const queryString = window.location.search;
+const urlParams = new URLSearchParams(queryString);
+const eventId = urlParams.get('event');
+
+document.addEventListener("DOMContentLoaded", async () => {
+
+    var container = document.getElementById("mainContainer");
+    var user = await getMyAccount();
+    var org_id: number = -1;
+    const modifyBtn = document.getElementById(  "editBtn");
+    const removeBtn = document.getElementById("removeBtn");
+
+    if (user) {
+        if (user.isOrganisation) {
+            org_id = user.organisationId;
+        }
+        unhideElementById(document, "logout-btn");
+    } else {
+        unhideElementById(document, "joinnow-btn");
+        unhideElementById(document, "signin-btn");
+    }
+
+    var thisEvent = null;
+    try {
+        if (eventId) thisEvent = await getEvent(eventId);
+    } catch (err) {
+        if (container !== null) container.innerHTML = `<p class="text-danger">To wydarzenie nie istnieje! <a href="/" style="color:#2898BD;">Powrót -></a></p>`;
+    }
+
+    if (thisEvent == null) {
+        if (container !== null) container.innerHTML = `<p class="text-danger">B³¹d we wczytywaniu wydarzenia. <a href="/" style="color:#2898BD;">Powrót -></a></p>`;
+    } else {
+
+        const titleText     = document.getElementById(    "titleText") as HTMLElement;
+        const locationText  = document.getElementById( "locationText") as HTMLElement;
+        const descText      = document.getElementById(     "descText") as HTMLElement;
+        const dateText      = document.getElementById(     "dateText") as HTMLElement;
+        const organizerText = document.getElementById("organizerText") as HTMLElement;
+        const newdateText   = new Date(thisEvent.eventDate).toLocaleDateString('pl-PL');
+        const newtimeText   = new Date(thisEvent.eventDate).toLocaleTimeString('pl-PL');
+
+
+            titleText.innerHTML = thisEvent.title + ` (#${eventId})`;
+         locationText.innerHTML = "Place: " + thisEvent.location;
+             descText.innerHTML = thisEvent.description;
+             dateText.innerHTML = "When: " + newdateText + " " + newtimeText; //thisEvent.eventDate;
+        organizerText.innerHTML = "Organized by: " + thisEvent.organisationName;
+
+        if (org_id == thisEvent.organisationId) {
+            // U¿ytkownik jest organizacj¹, która
+            // stworzy³a to wydarzenie
+            unhideElementById(document, "editBtn");
+            unhideElementById(document, "removeBtn");
+        } else if (org_id == -1) {
+            // U¿ytkownik jest wolontariuszem
+            unhideElementById(document, "applyBtn");
+        }
+
+        unhideElementById(document, "mainContainer");
+
+    }
+
+    if (modifyBtn) {
+        modifyBtn.addEventListener("click", (e) => {
+            window.location.href = "/modify.html?event=" + eventId;
+        });
+    }
+
+    if (removeBtn) {
+        removeBtn.addEventListener("click", async (e) => {
+            const confirmed = confirm("Really delete?");
+            if (!confirmed) return;
+
+            try {
+                // Wysy³a ¿¹danie DELETE do API
+                const response = await fetch(`/api/events/${id}`, {
+                    method: "DELETE"
+                });
+
+                if (response.ok) {
+                    alert("Event deleted.");
+                    window.location.href = "/";
+                } else {
+                    alert("Couldn't delete event.");
+                }
+            } catch (err) {
+                alert("Couldn't connect.");
+                console.error(err);
+            }
+        });
+    }
+
+});