feat: front-end date ranges support

WebApp/ts/eventList.ts

@@ -1,35 +1,64 @@
-import { getEvent, getMyAccount, unhideElementById } from './generalUseHelpers.js';
+import { getEvent, getMyAccount, unhideElementById, hideElementById } from './generalUseHelpers.js';
 
 var isAscending: boolean = false;
+var optionsVisibility: boolean = false;
 
 function toggleListSortOrder(org_id: number) {
     isAscending = !isAscending;
     loadEvents(org_id);
 }
 
+function toggleOptionsVisibility() {
+    optionsVisibility = !optionsVisibility;
+    if (optionsVisibility) {
+        unhideElementById(document, "fDate");
+        unhideElementById(document, "tDate");
+        unhideElementById(document, "flabel");
+        unhideElementById(document, "tlabel");
+    } else {
+        hideElementById(document, "fDate");
+        hideElementById(document, "tDate");
+        hideElementById(document, "flabel");
+        hideElementById(document, "tlabel");
+    }
+}
+
 async function getEvents(titleOrDescription?: string, fDate?: Date, tDate?: Date) {
 
     var res: Response;
-    var searchbar = document.getElementById("searchbar") as HTMLInputElement;
+    var searchbar     =  document.getElementById("searchbar") as HTMLInputElement;
+    var eventDateFrom = (document.getElementById('fDate') as HTMLInputElement).value;
+    var eventDateTo   = (document.getElementById('tDate') as HTMLInputElement).value;
+
 
     if (titleOrDescription == null) {
         titleOrDescription = searchbar.value;
-        //res = await fetch("/api/events" + (isAscending ? "?sort=asc" : ""));
-        //if (!res.ok) throw new Error("Couldn't load events");
     }
 
-        var payload = {
+    if (optionsVisibility) {
+        // Opcje widoczne
+        var payload_visible = {
             titleOrDescription,
-            fDate,
-            tDate
+            eventDateFrom,
+            eventDateTo
         };
-
         res = await fetch('/api/events/search' + (isAscending ? "?sort=asc" : ""), {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify(payload)
+            body: JSON.stringify(payload_visible)
         });
         if (!res.ok) throw new Error("Failed to get search results");
+    } else {
+        var payload_invisible = {
+            titleOrDescription
+        };
+        res = await fetch('/api/events/search' + (isAscending ? "?sort=asc" : ""), {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify(payload_invisible)
+        });
+        if (!res.ok) throw new Error("Failed to get search results");
+    }
 
     const events = await res.json();
     return events;
@@ -123,6 +152,10 @@ document.addEventListener("DOMContentLoaded", async () => {
     if (listSortToggleButton) {
         listSortToggleButton.addEventListener("click", () => toggleListSortOrder(org_id));
     }
+    const optionsToggleButton = document.getElementById("optionsbtn");
+    if (optionsToggleButton) {
+        optionsToggleButton.addEventListener("click", () => toggleOptionsVisibility());
+    }
     // and for enter in search bar
     const searchBar = document.getElementById('searchbar') as HTMLInputElement;
     searchBar.addEventListener('keydown', (event) => {

WebApp/ts/generalUseHelpers.ts

@@ -25,6 +25,13 @@ export async function unhideElementById(document: Document, e: string) {
     }
 }
 
+export async function hideElementById(document: Document, e: string) {
+    var element = document.getElementById(e);
+    if (element) {
+        element.classList.add('hidden-before-load');
+    }
+}
+
 export async function getEvent(id: string): Promise<EventData> {
     const res = await fetch("/api/events/" + id);
     if (!res.ok) {