Add basic support for viewing datasets

src/main/resources/static/details.js

@@ -0,0 +1,51 @@
+import Dataset from "./dataset.js";
+
+const mainElement = document.getElementsByTagName("main")[0];
+
+const title = document.getElementById("title");
+const rating = document.getElementById("rating");
+const shortDescription = document.getElementById("short-description");
+const url = document.getElementById("url");
+const date = document.getElementById("date");
+const category = document.getElementById("category");
+const license = document.getElementById("license");
+const termsOfUse = document.getElementById("terms-of-use");
+const fullDescription = document.getElementById("full-description");
+
+const currentLocation = new URL(location.href);
+if (currentLocation.searchParams.has("id")) {
+    const id = currentLocation.searchParams.get("id");
+    const response = await fetch(`${currentLocation.origin}/api/v1/datasets/id/${id}`);
+    console.dir(response);
+
+    if (response.ok) {
+        const data = await response.json();
+        const dataset = new Dataset(data);
+        console.dir(data, dataset);
+        const upvoteComponent = dataset.createUpvoteComponent();
+
+        title.innerText = dataset.title;
+        title.dataset.type = dataset.type.toLowerCase();
+        rating.innerText = dataset.rating;
+        rating.style.setProperty("--rating", `${dataset.rating}`);
+        shortDescription.innerText = dataset.shortDescription;
+        url.href = dataset.url;
+        url.innerText = dataset.url;
+        mainElement.querySelector(".upvote").replaceWith(upvoteComponent);
+
+        date.innerText = dataset.parseDate().toLocaleDateString(undefined, {
+            day: "numeric",
+            month: "long",
+            year: "numeric",
+        });
+        date.dataset.date = dataset.parseDate().getTime();
+        category.innerText = dataset.category.name;
+        category.dataset.id = dataset.category.id;
+        license.innerText = dataset.license;
+        termsOfUse.href = dataset.termsOfUse;
+
+        fullDescription.innerText = dataset.fullDescription;
+
+        mainElement.classList.remove("skeleton");
+    }
+}