From 65d9e8ea1f440e533808b239833ba350a9fcc6f0 Mon Sep 17 00:00:00 2001
From: J-Klinke <julianklinke@posteo.de>
Date: Thu, 20 Jun 2024 15:07:00 +0200
Subject: [PATCH] main.js mostly done, started implmenting contentUtility.js
 added sort options to index.html

---
 src/main/resources/static/contentUtility.js | 11 +++++
 src/main/resources/static/main.js           | 46 +++++++++++++++++----
 src/main/resources/templates/index.html     | 10 ++++-
 3 files changed, 56 insertions(+), 11 deletions(-)
 create mode 100644 src/main/resources/static/contentUtility.js

diff --git a/src/main/resources/static/contentUtility.js b/src/main/resources/static/contentUtility.js
new file mode 100644
index 0000000..eb2c2ce
--- /dev/null
+++ b/src/main/resources/static/contentUtility.js
@@ -0,0 +1,11 @@
+function fetchQuery(fetchString) {
+    fetch(fetchString)
+        .then(resp => resp.json())
+        .then((data) => {
+            parseContent(data.content);
+        });
+}
+
+function parseContent(content) {
+
+}
diff --git a/src/main/resources/static/main.js b/src/main/resources/static/main.js
index c7ab0aa..9b74cd2 100644
--- a/src/main/resources/static/main.js
+++ b/src/main/resources/static/main.js
@@ -1,3 +1,10 @@
+const baseURL = "http://" + window.location.host + "/api/v1/datasets";
+const defaultPagingValue = 20;
+const lastQuery = {
+    url: "",
+    totalPages: 0,
+    currentPage: 0
+};
 
 const addButton = document.getElementById("add-btn");
 addButton.addEventListener("click", () => {
@@ -28,8 +35,8 @@ sortButton.addEventListener("change", () => {
 });
 
 const upvoteButtons = document.getElementsByClassName("upvote-btn");
-const upvoteButtonClickListener = ()  => {
-    const entryID = upvoteButton.parent.dataset.id;
+const upvoteButtonClickListener = e  => {
+    const entryID = e.target.parentElement.parentElement.dataset.id;
     vote(entryID, true);
 };
 for (const upvoteButton of upvoteButtons) {
@@ -37,8 +44,8 @@ for (const upvoteButton of upvoteButtons) {
 }
 
 const downvoteButtons = document.getElementsByClassName("downvote-btn");
-const downvoteButtonClickListener = ()  => {
-    const entryID = downvoteButton.parent.dataset.id;
+const downvoteButtonClickListener = e  => {
+    const entryID = e.target.parentElement.parentElement.dataset.id;
     vote(entryID, false);
 };
 for (const downvoteButton of downvoteButtons) {
@@ -50,17 +57,38 @@ function navigateToAdd() {
 }
 
 function filter(filterString) {
-
+    filterString = filterString.toUpperCase();
+    const fetchURL = baseURL + "?type=" + filterString + "&size=" + defaultPagingValue;
+    fetchQuery(fetchURL);
 }
 
 function search(searchString) {
-    console.log(searchString);
+    const fetchURL = baseURL + "?search=" + encodeURIComponent(searchString.length === 0?"%":searchString);
+    console.log(fetchURL);
+    fetchQuery(fetchURL);
 }
 
 function sort(sortString) {
-
+    let query = sortString.toLowerCase().split(" ");
+    if (query[1] === "A-Z" || query[1] === "↑") {
+        query[1] = "asc";
+    } else {
+        query[1] = "desc";
+    }
+    const fetchURL = baseURL + "?sort=" + query[0] + "&direction=" + query[1];
+    console.log(fetchURL);
+    fetchQuery(fetchURL);
 }
 
 function vote(entryID, up) {
-    fetch()
-}
\ No newline at end of file
+    console.log(baseURL + "/id/" + entryID + "/" + (up?"upvote":"downvote"));
+    fetch(baseURL + "/id/" + entryID + "/" + up?"upvote":"downvote");
+}
+
+function incrementPageCount() {
+    lastQuery.currentPage++;
+}
+
+
+
+
diff --git a/src/main/resources/templates/index.html b/src/main/resources/templates/index.html
index d345799..f80de12 100644
--- a/src/main/resources/templates/index.html
+++ b/src/main/resources/templates/index.html
@@ -17,8 +17,14 @@
 
         <section id="tool-bar">
             <select id="sort-btn" title="Sort entries">Sort by
-                <option>Option 1</option>
-                <option>Option 2</option>
+                <option>Author A-Z</option>
+                <option>Author Z-A</option>
+                <option>Title A-Z</option>
+                <option>Title Z-A</option>
+                <option>Stars ↑</option>
+                <option>Stars ↓</option>
+                <option>Votes ↑</option>
+                <option>Votes ↓</option>
             </select>
             <div class="divider"></div>
             <select class="btn" id="filter-btn" title="Filter entries">Filter