From cff7e8166e458029a8e0ec316525a18db405c291 Mon Sep 17 00:00:00 2001
From: J-Klinke
Date: Sat, 6 Jul 2024 17:11:11 +0200
Subject: [PATCH 1/6] implemented delete & back button
---
src/main/resources/static/details.css | 42 ++++++++++++++++++++++++++
src/main/resources/static/details.html | 4 +++
src/main/resources/static/details.js | 36 +++++++++++++++++++---
3 files changed, 77 insertions(+), 5 deletions(-)
diff --git a/src/main/resources/static/details.css b/src/main/resources/static/details.css
index 86bb412..ad808bc 100644
--- a/src/main/resources/static/details.css
+++ b/src/main/resources/static/details.css
@@ -208,6 +208,48 @@ a {
}
}
+#details-btns > . {
+ float: right;
+}
+
+#delete-btn {
+ background: #861c1c;
+}
+
+/* button styling to be revisited */
+.btn {
+ padding: .5lh 1lh;
+ border: none;
+ border-radius: .5lh;
+ --btn-color: var(--fg-color);
+ background-color: var(--btn-color);
+ color: var(--text-color);
+ font-weight: bold;
+ font-size: 1rem;
+ transition: background-color 100ms, filter 200ms;
+ transition-timing-function: ease-out;
+ --drop-shadow-opacity: .5;
+ --drop-shadow-offset-y: 0;
+ --drop-shadow-blur: .25rem;
+ --drop-shadow: drop-shadow(
+ rgba(0, 0, 0, var(--drop-shadow-opacity))
+ 0 var(--drop-shadow-offset-y) var(--drop-shadow-blur)
+ );
+ filter: var(--drop-shadow);
+}
+
+.btn:focus-visible, #is-dataset:focus-visible + #is-dataset-toggle {
+ outline-offset: 2px;
+}
+
+.btn:not(:disabled):hover {
+ background-color: color-mix(in oklab, var(--btn-color) 80%, var(--bg-color));
+ --drop-shadow-opacity: .8;
+ --drop-shadow-offset-y: .25rem;
+ --drop-shadow-blur: .4rem;
+}
+
+
#nothing-found-bg {
background-position-x: calc(50% + 3cqh);
}
diff --git a/src/main/resources/static/details.html b/src/main/resources/static/details.html
index e91405e..1e867b3 100644
--- a/src/main/resources/static/details.html
+++ b/src/main/resources/static/details.html
@@ -58,6 +58,10 @@
ipsam nobis quis.
+
+
+
+
diff --git a/src/main/resources/static/details.js b/src/main/resources/static/details.js
index e770a5c..155b14d 100644
--- a/src/main/resources/static/details.js
+++ b/src/main/resources/static/details.js
@@ -13,6 +13,10 @@ const category = document.getElementById("category");
const license = document.getElementById("license");
const termsOfUse = document.getElementById("terms-of-use");
const fullDescription = document.getElementById("full-description");
+const backButton = document.getElementById("back-btn");
+const deleteButton = document.getElementById("delete-btn");
+
+let dataset = null;
const currentLocation = new URL(location.href);
if (currentLocation.searchParams.has("id")) {
@@ -22,10 +26,16 @@ if (currentLocation.searchParams.has("id")) {
if (response.ok) {
const data = await response.json();
- const dataset = new Dataset(data);
+ dataset = new Dataset(data);
console.dir(data, dataset);
const upvoteComponent = dataset.createUpvoteComponent();
+ console.log(dataset.storageGet());
+ debugger
+ if (dataset.storageGetKey("created-locally", false)) {
+ deleteButton.classList.remove("hidden");
+ }
+
title.innerText = dataset.title;
title.dataset.type = dataset.type.toLowerCase();
rating.value = dataset.rating;
@@ -41,10 +51,10 @@ if (currentLocation.searchParams.has("id")) {
month: "long",
year: "numeric",
});
- category.innerText = dataset.category.name;
- category.dataset.id = dataset.category.id;
- license.innerText = dataset.license;
- termsOfUse.href = dataset.termsOfUse;
+ //category.innerText = dataset.category.name;
+ //category.dataset.id = dataset.category.id;
+ //license.innerText = dataset.license;
+ //termsOfUse.href = dataset.termsOfUse;
fullDescription.innerText = dataset.fullDescription;
@@ -57,3 +67,19 @@ if (currentLocation.searchParams.has("id")) {
mainPage.classList.add("hidden");
notFoundPage.classList.remove("hidden");
}
+
+backButton.addEventListener("click", () => {
+ window.location.href = location.origin;
+})
+
+deleteButton.addEventListener("click", () => {
+ if (dataset != null) {
+ fetch(`${currentLocation.origin}/api/v1/datasets/id/` + dataset.id, {
+ method: 'DELETE'
+ }).then(resp => {
+ if (resp.ok) {
+ window.location.href = location.origin;
+ }
+ });
+ }
+});
From 1effb09cdba3740ea7541dab98d580ed4c0b6af2 Mon Sep 17 00:00:00 2001
From: Erik Foris
Date: Sat, 6 Jul 2024 18:03:27 +0200
Subject: [PATCH 2/6] feat: Update dataset voting logic to allow for zero stars
---
.../fim/PADAS/group3/DataDash/Dataset/DatasetController.java | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/main/java/de/uni_passau/fim/PADAS/group3/DataDash/Dataset/DatasetController.java b/src/main/java/de/uni_passau/fim/PADAS/group3/DataDash/Dataset/DatasetController.java
index 1d1ef41..1fe09b6 100644
--- a/src/main/java/de/uni_passau/fim/PADAS/group3/DataDash/Dataset/DatasetController.java
+++ b/src/main/java/de/uni_passau/fim/PADAS/group3/DataDash/Dataset/DatasetController.java
@@ -70,7 +70,7 @@ public class DatasetController {
if (datasetService.getDatasetById(id) == null) {
return new ResponseEntity<>(HttpStatus.NOT_FOUND);
}
- if (!(stars > 0 && stars < 6)) {
+ if (!(stars >= 0 && stars < 6)) {
return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
}
datasetService.voteDataset(id, stars);
From c0ad1ca8482bfaef2c969f225f7db4076fd6a573 Mon Sep 17 00:00:00 2001
From: J-Klinke
Date: Sat, 6 Jul 2024 18:28:07 +0200
Subject: [PATCH 3/6] rating is implemented, updates the stars and prohibits
voting more than once
---
src/main/resources/static/details.css | 11 +++++++
src/main/resources/static/details.html | 1 +
src/main/resources/static/details.js | 42 ++++++++++++++++++++++++--
src/main/resources/static/main.js | 2 +-
4 files changed, 53 insertions(+), 3 deletions(-)
diff --git a/src/main/resources/static/details.css b/src/main/resources/static/details.css
index ad808bc..416a76d 100644
--- a/src/main/resources/static/details.css
+++ b/src/main/resources/static/details.css
@@ -79,6 +79,17 @@ h1 {
grid-column: 1 / 3;
}
+#rating-input {
+ mask-image: url("stars.svg");
+ -webkit-mask-image: url("stars.svg");
+ mask-size: contain;
+ mask-mode: alpha;
+ width: 5lh;
+ height: 1lh;
+ margin-inline: .5ch;
+ background: linear-gradient(to right, yellow 33%, black 33%);
+}
+
#rating {
color: color-mix(in oklab, var(--text-color) 80%, black);
color: transparent;
diff --git a/src/main/resources/static/details.html b/src/main/resources/static/details.html
index 1e867b3..ff27926 100644
--- a/src/main/resources/static/details.html
+++ b/src/main/resources/static/details.html
@@ -24,6 +24,7 @@
Title
4
+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Perspiciatis recusandae laborum odio corrupti voluptas quisquam dicta, quibusdam ipsum qui exercitationem.
https://example.com/dataset
diff --git a/src/main/resources/static/details.js b/src/main/resources/static/details.js
index 155b14d..52cfa34 100644
--- a/src/main/resources/static/details.js
+++ b/src/main/resources/static/details.js
@@ -17,6 +17,8 @@ const backButton = document.getElementById("back-btn");
const deleteButton = document.getElementById("delete-btn");
let dataset = null;
+let currentRating = 0;
+let isRated = false;
const currentLocation = new URL(location.href);
if (currentLocation.searchParams.has("id")) {
@@ -35,11 +37,13 @@ if (currentLocation.searchParams.has("id")) {
if (dataset.storageGetKey("created-locally", false)) {
deleteButton.classList.remove("hidden");
}
+ isRated = dataset.storageGetKey("is-rated", false)
+
title.innerText = dataset.title;
title.dataset.type = dataset.type.toLowerCase();
rating.value = dataset.rating;
- ratingText.innerText = dataset.rating;
+ ratingText.innerText = parseFloat(dataset.rating).toFixed(1);
shortDescription.innerText = dataset.shortDescription;
url.href = dataset.url;
url.innerText = dataset.url;
@@ -51,7 +55,7 @@ if (currentLocation.searchParams.has("id")) {
month: "long",
year: "numeric",
});
- //category.innerText = dataset.category.name;
+ //category.innerText = dataset.category.name; // TODO: uncomment
//category.dataset.id = dataset.category.id;
//license.innerText = dataset.license;
//termsOfUse.href = dataset.termsOfUse;
@@ -83,3 +87,37 @@ deleteButton.addEventListener("click", () => {
});
}
});
+
+rating.addEventListener("mousemove", (event) => {
+ if (!isRated) {
+ let bounds = rating.getBoundingClientRect();
+ currentRating = Math.round(((event.clientX - bounds.left) / bounds.width) * 5);
+ console.log(currentRating);
+ rating.value = currentRating;
+ }
+
+});
+
+rating.addEventListener("mouseleave", () => {
+ rating.value = dataset.rating;
+});
+
+rating.addEventListener("click", () => {
+ if (!isRated) {
+ fetch(`${currentLocation.origin}/api/v1/datasets/id/` + dataset.id + "/stars?stars=" + currentRating, {
+ method: 'PUT'
+ }).then(resp => {
+ if (resp.ok) {
+ dataset.storageSetKey("is-rated", true);
+ isRated = true;
+ fetch(`${currentLocation.origin}/api/v1/datasets/id/` + dataset.id)
+ .then(resp => resp.json())
+ .then((data) => {
+ dataset = new Dataset(data);
+ ratingText.innerText = parseFloat(dataset.rating).toFixed(1);
+ rating.value = dataset.rating;
+ });
+ }
+ });
+ }
+})
diff --git a/src/main/resources/static/main.js b/src/main/resources/static/main.js
index ad98c3b..d58c423 100644
--- a/src/main/resources/static/main.js
+++ b/src/main/resources/static/main.js
@@ -1,4 +1,4 @@
-import { DATASET_ENDPOINT, getBaseURL } from "./constants.js";
+import { DATASET_ENDPOINT, getBaseURL } from "./constants.js"
import { fetchQuery } from "./contentUtility.js";
import Dataset from "./dataset.js";
From b87fafe36065182c77bf0f30dd73fa3d67947cb1 Mon Sep 17 00:00:00 2001
From: Erik Foris
Date: Sat, 6 Jul 2024 18:41:03 +0200
Subject: [PATCH 4/6] link to exmple site
---
src/main/resources/data.sql | 10 +++++-----
1 file changed, 5 insertions(+), 5 deletions(-)
diff --git a/src/main/resources/data.sql b/src/main/resources/data.sql
index 5f7c01b..9e1e6c8 100644
--- a/src/main/resources/data.sql
+++ b/src/main/resources/data.sql
@@ -11,11 +11,11 @@ INSERT INTO category (id, name) VALUES
-- Insert sample data into dataset
INSERT INTO dataset (date, raiting, upvotes, votes, categorie_id, id, abst, author, description, title, url, type, licence, terms_of_use) VALUES
-('2023-01-01', 4.5, 100, 120, '123e4567-e89b-12d3-a456-426614174000', '123e4567-e89b-12d3-a456-426614174100', 'Abstract 1', 'Author 1', 'Description 1', 'Title 1', 'http://example.com/1', 'API', 'MIT', 'http://url.de'),
-('2023-01-02', 4.7, 150, 170, '123e4567-e89b-12d3-a456-426614174001', '123e4567-e89b-12d3-a456-426614174101', 'Abstract 2', 'Author 2', 'Description 2', 'Title 2', 'http://example.com/2', 'DATASET', 'MIT', 'http://url.de'),
-('2023-01-03', 4.9, 200, 220, '123e4567-e89b-12d3-a456-426614174002', '123e4567-e89b-12d3-a456-426614174102', 'Abstract 3', 'Author 3', 'Description 3', 'Title 3', 'http://example.com/3', 'API', 'MIT', 'http://url.de'),
-('2023-01-04', 4.2, 80, 100, '123e4567-e89b-12d3-a456-426614174003', '123e4567-e89b-12d3-a456-426614174103', 'Abstract 4', 'Author 4', 'Description 4', 'Title 4', 'http://example.com/4', 'DATASET', 'MIT', 'http://url.de'),
-('2023-01-05', 4.6, 120, 140, '123e4567-e89b-12d3-a456-426614174004', '123e4567-e89b-12d3-a456-426614174104', 'Abstract 5', 'Author 5', 'Description 5', 'Title 5', 'http://example.com/5', 'API', 'MIT', 'http://url.de');
+('2023-01-01', 4.5, 100, 120, '123e4567-e89b-12d3-a456-426614174000', '123e4567-e89b-12d3-a456-426614174100', 'Abstract 1', 'Author 1', 'Description 1', 'Title 1', 'http://example.com/1', 'API', 'MIT', 'http://example.com'),
+('2023-01-02', 4.7, 150, 170, '123e4567-e89b-12d3-a456-426614174001', '123e4567-e89b-12d3-a456-426614174101', 'Abstract 2', 'Author 2', 'Description 2', 'Title 2', 'http://example.com/2', 'DATASET', 'MIT', 'http://example.com'),
+('2023-01-03', 4.9, 200, 220, '123e4567-e89b-12d3-a456-426614174002', '123e4567-e89b-12d3-a456-426614174102', 'Abstract 3', 'Author 3', 'Description 3', 'Title 3', 'http://example.com/3', 'API', 'MIT', 'http://example.com'),
+('2023-01-04', 4.2, 80, 100, '123e4567-e89b-12d3-a456-426614174003', '123e4567-e89b-12d3-a456-426614174103', 'Abstract 4', 'Author 4', 'Description 4', 'Title 4', 'http://example.com/4', 'DATASET', 'MIT', 'http://example.com'),
+('2023-01-05', 4.6, 120, 140, '123e4567-e89b-12d3-a456-426614174004', '123e4567-e89b-12d3-a456-426614174104', 'Abstract 5', 'Author 5', 'Description 5', 'Title 5', 'http://example.com/5', 'API', 'MIT', 'http://example.com');
-- Insert 10 more sample data into dataset
INSERT INTO dataset (date, raiting, upvotes, votes, categorie_id, id, abst, author, description, title, url, type, licence, terms_of_use) VALUES
('2023-01-06', 4.8, 180, 200, '123e4567-e89b-12d3-a456-426614174005', '123e4567-e89b-12d3-a456-426614174105', 'Abstract 6', 'Author 6', 'Description 6', 'Title 6', 'http://example.com/6', 'API', 'MIT', 'http://zip.com'),
From f1cb3c1af07c2714a67af85bc8197b914f27b758 Mon Sep 17 00:00:00 2001
From: J-Klinke
Date: Sat, 6 Jul 2024 19:28:12 +0200
Subject: [PATCH 5/6] minor styling changes
---
src/main/resources/static/details.css | 7 +++++--
src/main/resources/static/details.js | 8 ++++----
2 files changed, 9 insertions(+), 6 deletions(-)
diff --git a/src/main/resources/static/details.css b/src/main/resources/static/details.css
index 416a76d..92d1372 100644
--- a/src/main/resources/static/details.css
+++ b/src/main/resources/static/details.css
@@ -219,8 +219,11 @@ a {
}
}
-#details-btns > . {
- float: right;
+#details-btns {
+ grid-column: 1 / 4;
+ justify-content: end;
+ gap: 1rem;
+ display: flex;
}
#delete-btn {
diff --git a/src/main/resources/static/details.js b/src/main/resources/static/details.js
index 52cfa34..4f530a2 100644
--- a/src/main/resources/static/details.js
+++ b/src/main/resources/static/details.js
@@ -55,10 +55,10 @@ if (currentLocation.searchParams.has("id")) {
month: "long",
year: "numeric",
});
- //category.innerText = dataset.category.name; // TODO: uncomment
- //category.dataset.id = dataset.category.id;
- //license.innerText = dataset.license;
- //termsOfUse.href = dataset.termsOfUse;
+ category.innerText = dataset.category.name;
+ category.dataset.id = dataset.category.id;
+ license.innerText = dataset.license;
+ termsOfUse.href = dataset.termsOfUse;
fullDescription.innerText = dataset.fullDescription;
From 448bc30f03e15d00f76f7291472be70746100e1a Mon Sep 17 00:00:00 2001
From: J-Klinke
Date: Sat, 6 Jul 2024 19:40:35 +0200
Subject: [PATCH 6/6] found & fixed minor bug: sorting by stars now works
---
.../uni_passau/fim/PADAS/group3/DataDash/Dataset/Dataset.java | 2 +-
src/main/resources/static/index.html | 4 ++--
2 files changed, 3 insertions(+), 3 deletions(-)
diff --git a/src/main/java/de/uni_passau/fim/PADAS/group3/DataDash/Dataset/Dataset.java b/src/main/java/de/uni_passau/fim/PADAS/group3/DataDash/Dataset/Dataset.java
index 8a269c9..36796e3 100644
--- a/src/main/java/de/uni_passau/fim/PADAS/group3/DataDash/Dataset/Dataset.java
+++ b/src/main/java/de/uni_passau/fim/PADAS/group3/DataDash/Dataset/Dataset.java
@@ -52,7 +52,7 @@ public class Dataset {
private String licence;
- private static final List sortable = Arrays.asList("author", "title", "upvotes", "date");
+ private static final List sortable = Arrays.asList("author", "title", "upvotes", "raiting", "date");
@ManyToOne
private Category categorie;
diff --git a/src/main/resources/static/index.html b/src/main/resources/static/index.html
index 46da537..88979c4 100644
--- a/src/main/resources/static/index.html
+++ b/src/main/resources/static/index.html
@@ -45,8 +45,8 @@
-
-
+
+