From f48ff1dc6283a5a96e027b9d32d49f2b78a0fa9a Mon Sep 17 00:00:00 2001
From: Connor <brockcc1@cardiff.ac.uk>
Date: Mon, 4 Dec 2023 14:13:42 +0000
Subject: [PATCH] Set up landing page for Dragons Tale, intergrated Thymeleaf
and related controllers. Applied simple CSS and JS button to redirect to a
new URL. Need to set up a controller to support this redirect.
---
.../Team5/SmartTowns/Landmarks/Landmarks.java | 7 ++++--
.../java/Team5/SmartTowns/trails/Trail.java | 1 +
.../SmartTowns/trails/TrailsController.java | 14 +++++++++--
.../resources/static/css/dragonstaless.css | 17 ++++++++++---
src/main/resources/static/scripts/qrCode.js | 0
.../towns/trails/dragonstale/index.html | 25 +++++++++++++++----
.../trails/welshhistory/welshhistory.html | 10 --------
7 files changed, 51 insertions(+), 23 deletions(-)
create mode 100644 src/main/resources/static/scripts/qrCode.js
delete mode 100644 src/main/resources/templates/towns/trails/welshhistory/welshhistory.html
diff --git a/src/main/java/Team5/SmartTowns/Landmarks/Landmarks.java b/src/main/java/Team5/SmartTowns/Landmarks/Landmarks.java
index 381ccf04..f9ceacf1 100644
--- a/src/main/java/Team5/SmartTowns/Landmarks/Landmarks.java
+++ b/src/main/java/Team5/SmartTowns/Landmarks/Landmarks.java
@@ -18,11 +18,10 @@ public class Landmarks {
// Initialized object to getID from trail.
//Predefined Landmark for Dragons Tale.
- public static List<Landmarks> landmarksDragonstrail = List.of(
+ private static List<Landmarks> landmarksDragonstrail = List.of(
new Landmarks( 1, "A scent of...Dragon", "The Dragon has been spotted near by, find the QR code to continue" , "Start your discovery, at the sweet shop."),
new Landmarks( 2, "They've been found!", "Don't let them escape, find the next QR code to continue!", "Location test")
);
-
private Integer trailID;
private int landmarkID;
@NotEmpty(message = "You must type in a username.")
@@ -34,6 +33,10 @@ public class Landmarks {
private String landmarkLocation;
private String landmarkPicture;
+ public static List<Landmarks> getLandmarksDragonstrail() {
+ return landmarksDragonstrail;
+ }
+
// Constructor for List above.
public Landmarks( int landmarkID, String landmarkName, String landmarkDescription, String landmarkLocation) {
this.landmarkID = landmarkID;
diff --git a/src/main/java/Team5/SmartTowns/trails/Trail.java b/src/main/java/Team5/SmartTowns/trails/Trail.java
index efc9e125..a7067f83 100644
--- a/src/main/java/Team5/SmartTowns/trails/Trail.java
+++ b/src/main/java/Team5/SmartTowns/trails/Trail.java
@@ -14,6 +14,7 @@ public class Trail {
new Trail(4,"Trail4", "This is trail four"),
new Trail(5,"A Dragon's Tale", "EDITING THIS")
);
+
int id;
String name;
String description;
diff --git a/src/main/java/Team5/SmartTowns/trails/TrailsController.java b/src/main/java/Team5/SmartTowns/trails/TrailsController.java
index 0b9b8f6c..c91c7abb 100644
--- a/src/main/java/Team5/SmartTowns/trails/TrailsController.java
+++ b/src/main/java/Team5/SmartTowns/trails/TrailsController.java
@@ -13,7 +13,7 @@ import org.springframework.web.servlet.ModelAndView;
import java.util.ArrayList;
import java.util.List;
-import static Team5.SmartTowns.Landmarks.Landmarks.landmarksDragonstrail;
+import static Team5.SmartTowns.Landmarks.Landmarks.getLandmarksDragonstrail;
@Controller
public class TrailsController {
@@ -40,11 +40,21 @@ public class TrailsController {
@GetMapping("/dragonstale")
public ModelAndView getDragonsTale(){
- List<Landmarks> landmarksList = landmarksDragonstrail;
+ List<Landmarks> landmarksList = getLandmarksDragonstrail();
+ Landmarks landmarks = new Landmarks();
+ int listSize = landmarksList.size();
ModelAndView modelAndView = new ModelAndView("towns/trails/dragonstale/index");
modelAndView.addObject("landmarksList", landmarksList);
+ modelAndView.addObject("getListSize", listSize);
return modelAndView;
}
+// @GetMapping("/dragonstale/{landmarks}")
+// public ModelAndView getDragonstaleLandmarks(){
+// ModelAndView modelAndView = new ModelAndView();
+// modelAndView.addObject()
+// }
+
+
}
diff --git a/src/main/resources/static/css/dragonstaless.css b/src/main/resources/static/css/dragonstaless.css
index 69503719..2f456a23 100644
--- a/src/main/resources/static/css/dragonstaless.css
+++ b/src/main/resources/static/css/dragonstaless.css
@@ -8,10 +8,19 @@
background-color: #927BB7;
}
-#homeimg.centre{
- box-shadow: 100px -100px purple;
+.landmarkName{
+ font-weight: bold;
+ text-align: left;
+}
+
+.landmarkDesc{
+ font-style: italic;
+ text-align: left;
}
body{
- background-color: #927BB7;
-}
\ No newline at end of file
+ background-color: #E8A87C;
+}
+
+
+
diff --git a/src/main/resources/static/scripts/qrCode.js b/src/main/resources/static/scripts/qrCode.js
new file mode 100644
index 00000000..e69de29b
diff --git a/src/main/resources/templates/towns/trails/dragonstale/index.html b/src/main/resources/templates/towns/trails/dragonstale/index.html
index 21ef46b0..80aa3293 100644
--- a/src/main/resources/templates/towns/trails/dragonstale/index.html
+++ b/src/main/resources/templates/towns/trails/dragonstale/index.html
@@ -5,14 +5,16 @@
<title>A Dragon's Tale</title>
<link rel="stylesheet" th:href="@{/css/dragonstaless.css}">
<link rel="stylesheet" th:href="@{/css/templatingstyle.css}">
+ <script src="./node_modules/html5-qrcode/html5-qrcode.min.js"></script>
</head>
<body>
<header th:insert="towns/Templating.html :: header"></header>
+ <!-- As this predefined trail will be accessible from multiple different towns, this thymeleaf element will display the town the user is currently trying to access and display it accordingly. <span th:text="${townName}"> -->
<div class="centre">
<h1> Welcome, to a dragon's tale! </h1>
<img th:src="@{/images/trails/dragonstalehome.png}" alt="Image of a dragon" id="homeimg">
- <h2> Discover the mystery of the dragon, track its location and follow it throughout the town of (thymeleaf element) to discover a prize! </h2>
+ <h2> Discover the mystery of the dragon, track its location and follow it throughout the town of to discover a prize! </h2>
</div>
<div class="centre">
@@ -22,15 +24,28 @@
</p>
</div>
+
+ <!-- tabs -->
<div class="centre">
- <ul th:each="item : ${landmarksList}">
- <p th:text="${item.landmarkName}"></p>
- <p th:text="${item.landmarkDescription}"></p>
+ <h2>There are <span th:text="${getListSize}"> Size of List </span> adventures in this journey! </h2>
+ <ul th:each="item : ${landmarksList}" id="tabBox">
+ <li>
+ <a id="tabIdCounter" href="#landmarkTabLink" th:text="${item.landmarkName}"> Landmark Tab</a>
+ </li>
</ul>
</div>
+
+ <!-- Need to mark each element to an ID then loop through them. -->
+ <div class="centre" id="listOfLandmarks">
+ <p th:each="item : ${landmarksList}">
+ <span th:text="${item.landmarkDescription}" class="landmarkDesc" id="landmarkTabLink"> Landmark Description</span>
+ </p>
+ </div>
+
+ <!-- If use is starting their journey, this will display begin. If not, they'll continue their journey. <span th:text="${beginOrContinue}"> -->
<div class="centre">
- <h3>Begin your hunt!</h3>
+ <h3> Begin or Continue your hunt!</h3>
<button type="button" id="begin">Click here!</button>
</div>
diff --git a/src/main/resources/templates/towns/trails/welshhistory/welshhistory.html b/src/main/resources/templates/towns/trails/welshhistory/welshhistory.html
deleted file mode 100644
index 9a4ae9e8..00000000
--- a/src/main/resources/templates/towns/trails/welshhistory/welshhistory.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8">
- <title>The Roman Empire</title>
-</head>
-<body>
-
-</body>
-</html>
\ No newline at end of file
--
GitLab