Made it so you can navigate through the website.

src/main/java/Team5/SmartTowns/data/Trail.java

@@ -4,15 +4,24 @@ package Team5.SmartTowns.data;
 import lombok.AllArgsConstructor;
 import lombok.Data;
 
+import java.io.File;
+import java.util.List;
+
 @Data
 @AllArgsConstructor
 public class Trail {
-    private String trailsId;
+    private Long trailsId;
     private String trailName;
     private String trailNumber;
+    private String imgPath;
 
+    public Trail(Long trailsId, String trailName, String trailNumber) {
+        this.trailsId = trailsId;
+        this.trailName = trailName;
+        this.trailNumber = trailNumber;
+    }
 
-    public String getTrailsId() {
+    public Long getTrailsId() {
         return trailsId;
     }
 
@@ -24,5 +33,19 @@ public class Trail {
         return trailNumber;
     }
 
+    public String getTrailLink(){
+        String[] split = trailName.split(" ");
+        return String.join("-", split);
+    }
+
+
+    public String getImagePath(){
+        /* Finds the image in the Path folder, if image is not found assigns default image */
+        String imgPath = "images/trails/trail" + trailsId + ".jpg";
+        String notFoundPath = "images/trails/trailNotFound.jpg";
+
+        File imgFile = new File("src/main/resources/static/" + imgPath);
+        return imgFile.exists() ? imgPath : notFoundPath;
+    }
 
 }

src/main/java/Team5/SmartTowns/data/TrailsRepository.java

@@ -6,4 +6,6 @@ import java.util.List;
 public interface TrailsRepository {
     List<Trail> getAllTrails();
     String getTrailNameWithID(String trailsID);
+
+    List<Trail> getAllTrailsFromCity(String cityName);
 }

src/main/java/Team5/SmartTowns/data/TrailsRepositoryJDBC.java

@@ -17,7 +17,7 @@ public class TrailsRepositoryJDBC implements TrailsRepository {
     }
     private void settrailsMapper(){
         trailMapper = (rs, i) -> new Trail(
-                rs.getString("trailID"),
+                rs.getLong("trailID"),
                 rs.getString("trailName"),
                 rs.getString("trailNumber")
         );
@@ -35,5 +35,11 @@ public class TrailsRepositoryJDBC implements TrailsRepository {
 
     }
 
+    @Override
+    public List<Trail> getAllTrailsFromCity(String cityName) {
+        String sql = "SELECT * FROM trails WHERE city = ?";
+        return jdbc.query(sql, trailMapper, cityName);
+    }
+
 
 }

src/main/java/Team5/SmartTowns/placeswithcoordinates/PlacesController.java

@@ -4,6 +4,8 @@ import Team5.SmartTowns.data.Location;
 import Team5.SmartTowns.data.LocationRepository;
 import Team5.SmartTowns.data.Trail;
 import Team5.SmartTowns.data.TrailsRepository;
+import Team5.SmartTowns.rewards.RewardsRepository;
+import Team5.SmartTowns.users.UserRepository;
 import jakarta.validation.constraints.Max;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
@@ -28,6 +30,9 @@ public class PlacesController {
     @Autowired
     private TrailsRepository trailsRepo;
 
+    @Autowired
+    private RewardsRepository rewardsRepository;
+
 
     @GetMapping("/checkpoints")
     public ModelAndView getLocationPages(){
@@ -110,6 +115,8 @@ public class PlacesController {
         modelAndView.addObject("trail", trailslocations.get(trailID));
         modelAndView.addObject("locCoords", locCoords);
         modelAndView.addObject("locations", approvedLocations);
+
+        modelAndView.addObject("stickers", rewardsRepository.getAllStickersFromPack(1));
         return modelAndView;
     }
 

src/main/java/Team5/SmartTowns/trails/Trail.java

-package Team5.SmartTowns.trails;
-
-import lombok.Data;
-
-import java.io.File;
-import java.util.List;
-
-@Data
-public class Trail {
-    public static List<Trail> trails = List.of(
-            new Trail(1,"Caerphilly Castle Trail", "Take a stroll through the grounds of one of Europe's finest historic buildings and you will see stunning views of the castle and the lakes. The route of the trail is marked with eight special circular markers, which depict various fascinating historical facts relating to the castle. Pupils from Ysgol Gynradd Gymraeg Caerffili, Plasyfelin Junior School, Ysgol Y Castell and Twyn Primary worked with the artist to come up with the different designs. You do not need to pay to go in the castle to complete this trail. This Trail is fairly short at 1.5 miles and very suitable for wheelchairs and pushchairs as the route stays mostly on well-marked and ramped paths with just a couple of short diversions onto grassed areas."),
-            new Trail(2,"Trail2", "This is trail two"),
-            new Trail(3,"Trail3", "This is trail three"),
-            new Trail(4,"Trail4", "This is trail four"),
-            new Trail(5,"A Dragon's Tale", "EDITING THIS")
-    );
-
-    int id;
-    String name;
-    String description;
-    int nLandmarks;
-    int difficulty; //1-5
-    String imgPath;
-
-    public Trail(int id, String name, String description) {
-        this.id = id;
-        this.name = name;
-        this.description = description;
-        imgPath = findImagePath();
-    }
-
-    private String findImagePath(){
-        /* Finds the image in the Path folder, if image is not found assigns default image */
-        String imgPath = "images/trails/trail" + id + ".jpg";
-        String notFoundPath = "images/trails/trailNotFound.jpg";
-
-        File imgFile = new File("src/main/resources/static/" + imgPath);
-        return imgFile.exists() ? imgPath : notFoundPath;
-    }
-}
+//package Team5.SmartTowns.trails;
+//
+//import lombok.Data;
+//
+//import java.io.File;
+//import java.util.List;
+//
+//@Data
+//public class Trail {
+//    public static List<Trail> trails = List.of(
+//            new Trail(1,"Caerphilly Castle Trail", "Take a stroll through the grounds of one of Europe's finest historic buildings and you will see stunning views of the castle and the lakes. The route of the trail is marked with eight special circular markers, which depict various fascinating historical facts relating to the castle. Pupils from Ysgol Gynradd Gymraeg Caerffili, Plasyfelin Junior School, Ysgol Y Castell and Twyn Primary worked with the artist to come up with the different designs. You do not need to pay to go in the castle to complete this trail. This Trail is fairly short at 1.5 miles and very suitable for wheelchairs and pushchairs as the route stays mostly on well-marked and ramped paths with just a couple of short diversions onto grassed areas."),
+//            new Trail(2,"Trail2", "This is trail two"),
+//            new Trail(3,"Trail3", "This is trail three"),
+//            new Trail(4,"Trail4", "This is trail four"),
+//            new Trail(5,"A Dragon's Tale", "EDITING THIS")
+//    );
+//
+//    int id;
+//    String name;
+//    String description;
+//    int nLandmarks;
+//    int difficulty; //1-5
+//    String imgPath;
+//
+//    public Trail(int id, String name, String description) {
+//        this.id = id;
+//        this.name = name;
+//        this.description = description;
+//        imgPath = findImagePath();
+//    }
+//
+//    private String findImagePath(){
+//        /* Finds the image in the Path folder, if image is not found assigns default image */
+//        String imgPath = "images/trails/trail" + id + ".jpg";
+//        String notFoundPath = "images/trails/trailNotFound.jpg";
+//
+//        File imgFile = new File("src/main/resources/static/" + imgPath);
+//        return imgFile.exists() ? imgPath : notFoundPath;
+//    }
+//}

src/main/java/Team5/SmartTowns/trails/TrailsController.java

 package Team5.SmartTowns.trails;
 
 
+import Team5.SmartTowns.data.LocationRepository;
+import Team5.SmartTowns.data.LocationRepositoryJDBC;
+import Team5.SmartTowns.data.Trail;
+import Team5.SmartTowns.data.TrailsRepository;
 import Team5.SmartTowns.landmarks.Landmarks;
+import Team5.SmartTowns.placeswithcoordinates.PlacesCoordinatesRepository;
+import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
 import org.springframework.web.bind.annotation.*;
@@ -17,10 +23,14 @@ import static Team5.SmartTowns.landmarks.Landmarks.landmarksDragonstrail;
 
 @Controller
 public class TrailsController {
-    @GetMapping("/allTrails")
-    public ModelAndView getAllTrails(){
+
+    @Autowired
+    private TrailsRepository trailsRepository;
+
+    @GetMapping("/allTrails-{city}")
+    public ModelAndView getAllTrails(@PathVariable String city){
         ModelAndView mav = new ModelAndView("allTrails/allTrails");
-        mav.addObject("trails", Trail.trails); //Mock data for trails
+        mav.addObject("trails", trailsRepository.getAllTrailsFromCity(city)); //Mock data for trails
         return mav;
     }
     @RequestMapping(value="/id", method=RequestMethod.POST)
@@ -32,7 +42,7 @@ public class TrailsController {
     @GetMapping("/allTrails/{id}")
     public ModelAndView getResultBySearchKey(@PathVariable int id)
     {
-        List<Trail> trailList= Trail.trails;//results from db
+        List<Trail> trailList = trailsRepository.getAllTrails();//results from db
         ModelAndView mv= new ModelAndView("fragments/allTrailsFrags :: trailSection");
         mv.addObject("trail", trailList.get(id-1));
         return mv;

src/main/resources/data.sql

 delete from trails;
-insert into trails ( trailID, trailName, trailNumber) value ( 0101,'Caerphilly Castle Trail','0101');
-insert into trails ( trailID, trailName, trailNumber) value ( 0102,'Caerphilly Pub Trail','0102');
-insert into trails ( trailID, trailName, trailNumber) value ( 0103,'Caerphilly Heritage Trail','0103');
-insert into trails ( trailID, trailName, trailNumber) value ( 0201,'Risca Heritage Trail','0201');
-insert into trails ( trailID, trailName, trailNumber) value ( 0301,'Penarth Esplanade Trail','0301');
+insert into trails ( trailID, trailName, trailNumber, city) value ( 0101,'Caerphilly Castle Trail','0101', 'Caerphilly');
+insert into trails ( trailID, trailName, trailNumber, city) value ( 0102,'Caerphilly Pub Trail','0102', 'Caerphilly');
+insert into trails ( trailID, trailName, trailNumber, city) value ( 0103,'Caerphilly Heritage Trail','0103', 'Caerphilly');
+insert into trails ( trailID, trailName, trailNumber, city) value ( 0201,'Risca Heritage Trail','0201', 'Risca');
+insert into trails ( trailID, trailName, trailNumber, city) value ( 0301,'Penarth Esplanade Trail','0301', 'Penarth');
 
 delete from locations;
 insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID, locationApproved) value ( 'St Cenydd','','Location description here','Caerphilly',0101, false);

src/main/resources/schema.sql

@@ -24,7 +24,8 @@ create table if not exists trails
 (
     trailID varchar(128) primary key,
     trailName varchar(128),
-    trailNumber varchar(128)
+    trailNumber varchar(128),
+    city varchar(128)
 )   engine=InnoDB;
 
 drop table if exists locationCoordinates;

src/main/resources/static/css/allTrails.css

 #allTrailsBar {
     width: 100%;
-    height: auto;
+    min-height: 70svh;
     /*margin: 1svh auto;*/
     display: flex;
-    flex-wrap: wrap;
+    flex-direction: column;
     justify-content: space-evenly;
+    position: relative;
 
 }
+
+.trailWrapper {
+    position: relative;
+    display: flex;
+    width: 70vw;
+    height: 20svh;
+    margin-inline: auto;
+    & h1 {
+        display: flex;
+        width: 100%;
+        position: absolute;
+        align-items: flex-start;
+        padding-top: 1svh;
+        padding-bottom: 0.5svh;
+        text-align: center;
+        justify-content: center;
+        text-decoration: none;
+        color: white;
+        font-weight: 600;
+        text-shadow: rgba(0, 0, 0, 0.2) 0 1svh 1svh;
+        font-size: 2em;
+        border-bottom: black solid 2px;
+        background-color: rgba(31, 31, 31, 0.2);
+        border-radius: 20px 20px 0 0;
+    }
+}
+
 .trailsImages {
-    margin: 1svh 0;
-    height: 8svh;
-    aspect-ratio: 1;
+    width: 100%;
+    height: 100%;
+    /*margin: 1svh 0;*/
+    /*height: auto;*/
+    /*aspect-ratio: 1;*/
     border-radius: 20px;
     border: solid grey 4px;
     transition: 0.5s ease-out 100ms;
@@ -30,78 +60,78 @@
     100% { opacity: 1; }
 }
 
-#trailInfoContainer {
+/*#trailInfoContainer {*/
 
-    overflow: scroll;
-}
+/*    overflow: scroll;*/
+/*}*/
 
-.trailInfoFrag {
-    background-color: rgb(84, 33, 128);
-    border: #000000 solid 2px;
-    border-radius: 10px;
-    box-shadow: 0 5px 20px 0 #000000;
-    margin: 2svh auto;
-    padding-bottom: 2svw;
-    width: 70vw;
-    height: auto;
-    min-height: 30svh;
-    animation: fadeIn 3s;
+/*.trailInfoFrag {*/
+/*    background-color: rgb(84, 33, 128);*/
+/*    border: #000000 solid 2px;*/
+/*    border-radius: 10px;*/
+/*    box-shadow: 0 5px 20px 0 #000000;*/
+/*    margin: 2svh auto;*/
+/*    padding-bottom: 2svw;*/
+/*    width: 70vw;*/
+/*    height: auto;*/
+/*    min-height: 30svh;*/
+/*    animation: fadeIn 3s;*/
 
-    display: grid;
-    grid-template-areas:
-            "header header header"
-            "image text text";
-    grid-template-columns: 30% 30% auto;
-    grid-template-rows: 10% auto;
-    grid-column-gap: 2vw;
-    grid-row-gap: 2svh;
-    & .trailInfoHeader {
-        grid-area: header;
-        width: 100%;
-        height: 100%;
-        margin-top: 1svh;
-        padding: 0;
-        & h1 {
-            color: white;
-            padding:0;
-            margin:0 25%;
-            font-size: 2vw;
-            text-align: center;
-            box-shadow: 0 10px 10px -10px black;
-        }
+/*    display: grid;*/
+/*    grid-template-areas:*/
+/*            "header header header"*/
+/*            "image text text";*/
+/*    grid-template-columns: 30% 30% auto;*/
+/*    grid-template-rows: 10% auto;*/
+/*    grid-column-gap: 2vw;*/
+/*    grid-row-gap: 2svh;*/
+/*    & .trailInfoHeader {*/
+/*        grid-area: header;*/
+/*        width: 100%;*/
+/*        height: 100%;*/
+/*        margin-top: 1svh;*/
+/*        padding: 0;*/
+/*        & h1 {*/
+/*            color: white;*/
+/*            padding:0;*/
+/*            margin:0 25%;*/
+/*            font-size: 2vw;*/
+/*            text-align: center;*/
+/*            box-shadow: 0 10px 10px -10px black;*/
+/*        }*/
 
-    }
+/*    }*/
 
-    & img {
-        grid-area: image;
-        border-radius: 10px;
-        border: black solid 1px;
-        margin-left: 2vw;
-        margin-right: 2vw;
-        width: 100%;
-        height: auto;
-        box-shadow: 0 10px 20px -10px black;
-    }
-    & p {
-        grid-area: text;
-        color: white;
-        margin: 0;
-        padding: 0 2vw;
-        font-size: 1.3vw;
-        text-align: justify;
-        text-justify: inter-character;
-        line-height: 1.5;
-        width: fit-content;
-        height: fit-content;
-        overflow: scroll;
+/*    & img {*/
+/*        grid-area: image;*/
+/*        border-radius: 10px;*/
+/*        border: black solid 1px;*/
+/*        margin-left: 2vw;*/
+/*        margin-right: 2vw;*/
+/*        width: 100%;*/
+/*        height: auto;*/
+/*        box-shadow: 0 10px 20px -10px black;*/
+/*    }*/
+/*    & p {*/
+/*        grid-area: text;*/
+/*        color: white;*/
+/*        margin: 0;*/
+/*        padding: 0 2vw;*/
+/*        font-size: 1.3vw;*/
+/*        text-align: justify;*/
+/*        text-justify: inter-character;*/
+/*        line-height: 1.5;*/
+/*        width: fit-content;*/
+/*        height: fit-content;*/
+/*        overflow: scroll;*/
 
-    }
-}
+/*    }*/
+/*}*/
 
-#trailFragContent {
-    margin: 0;
-    padding: 0;
-    display: flex;
-    min-height: 40svh;
-    flex-wrap: wrap;
-}
\ No newline at end of file
+/*#trailFragContent {*/
+/*    margin: 0;*/
+/*    padding: 0;*/
+/*    display: flex;*/
+/*    min-height: 40svh;*/
+/*    flex-wrap: wrap;*/
+/*}*/
\ No newline at end of file

src/main/resources/templates/allTrails/allTrails.html

@@ -14,20 +14,22 @@
 
 <main>
     <section id="allTrailsBar" class="centerFlex">
-        <img class="trailsImages"
-             th:each="trail : ${trails}"
-             th:src="@{${trail.getImgPath()}}"
-             th:onclick="'updateOutputTrail('+ ${trail.getId()} +');'"
-             th:id="'img' + ${trail.getId()}" th:alt="${trail.getName()}"
-        >
-    </section>
-    <section id="trailInfoContainer" class="trailInfoFrag">
-        <!--All this section is loaded from thymeleaf, based on what tail is selected
-            in the #allTrailsBar -->
-        <div class="trailInfoHeader">
-            <h1 class="centerFlex">Please select your trail</h1>
-        </div>
+        <a th:each="trail : ${trails}" th:href="'/trails/' + ${trail.getTrailLink()}" class="trailWrapper">
+            <h1 th:text="${trail.getTrailName()}"></h1>
+            <img class="trailsImages"
+                th:src="${trail.getImagePath()}"
+                th:onclick="'updateOutputTrail('+ ${trail.getTrailsId()} +');'"
+                th:id="'img' + ${trail.getTrailsId()}" th:alt="${trail.getTrailName()}"
+        ></a>
+
     </section>
+<!--    <section id="trailInfoContainer" class="trailInfoFrag">-->
+<!--        &lt;!&ndash;All this section is loaded from thymeleaf, based on what tail is selected-->
+<!--            in the #allTrailsBar &ndash;&gt;-->
+<!--        <div class="trailInfoHeader">-->
+<!--            <h1 class="centerFlex">Please select your trail</h1>-->
+<!--        </div>-->
+<!--    </section>-->
 </main>
 <footer th:replace="~{/fragments/banners :: footer}"></footer>
 

src/main/resources/templates/fragments/locationPageFrags.html

@@ -6,9 +6,10 @@
 
     <link rel="stylesheet" th:href="@{/css/templatingstyle.css}">
     <link rel="stylesheet" th:href="@{/css/locationPageFragsStyle.css}">
+    <link rel="stylesheet" th:href="@{/css/mobile-style.css}">
 </head>
 <body >
-<header th:insert="~{/fragments/Templating.html::header}"></header>
+<header th:replace="~{/fragments/banners::header}"></header>
     <main>
 
         <hr style="height:40px; visibility:hidden;" />
@@ -35,6 +36,6 @@
         <hr style="height:40px; visibility:hidden;" />
     </main>
 
-<footer th:insert="~{/fragments/Templating.html::footer}"></footer>
+<footer th:replace="~{/fragments/banners::footer}"></footer>
 </body>
 </html>
\ No newline at end of file

src/main/resources/templates/fragments/trailsPageFrags.html

@@ -6,11 +6,13 @@
 
     <link rel="stylesheet" th:href="@{/css/templatingstyle.css}">
     <link rel="stylesheet" th:href="@{/css/trailsPageFragsStyle.css}">
+    <link rel="stylesheet" th:href="@{/css/mobile-style.css}">
+    <link rel="stylesheet" th:href="@{/css/userProfile.css}">
 
 
 </head>
 <body >
-<header th:insert="~{/fragments/Templating.html::header}"></header>
+<header th:replace="~{/fragments/banners::header}"></header>
 <main>
 
     <hr style="height:40px; visibility:hidden;" />
@@ -104,11 +106,21 @@
 
 
 
+        </div>
+    </article>
+
+    <article>
+        <h1> Stickers </h1>
+        <br>
+
+        <div class="stickersContainer">
+            <img th:class="'stickerImg gotSticker'"  th:each="sticker : ${stickers}" th:src="@{'../' + ${sticker.getDisplayImg()}}"
+                 th:id="'img' + ${sticker.getId()}" th:alt="${sticker.getName()}" >
         </div>
     </article>
     <hr style="height:40px; visibility:hidden;" />
 </main>
 
-<footer th:insert="~{/fragments/Templating.html::footer}"></footer>
+<footer th:replace="~{/fragments/banners::footer}"></footer>
 </body>
 </html>

src/main/resources/templates/landmarks/locationPage.html

@@ -5,11 +5,12 @@
     <title>Checkpoint</title>
 <!--    todo make this a list per trail or per town that when clicked brings to unique location page-->
     <link rel="stylesheet" th:href="@{/css/templatingstyle.css}">
+    <link rel="stylesheet" th:href="@{/css/mobile-style.css}">
 </head>
 <body>
 
 <main>
-    <header th:insert="~{/fragments/Templating.html::header}"></header>
+    <header th:replace="~{/fragments/banners::header}"></header>
     <div th:each="coord, indexValue:${locationCoords}">
         <p th:text="*{coord.getLocationID()}"></p>
 <!--        <p th:text="${locations[indexValue.index]}"></p>-->
@@ -42,6 +43,6 @@
 
 
 </main>
-<footer th:insert="~{/fragments/Templating.html::footer}"></footer>
+<footer th:replace="~{/fragments/banners::footer}"></footer>
 </body>
 </html>
\ No newline at end of file

src/main/resources/templates/towns/home/mobile-homepage.html

@@ -19,7 +19,7 @@
     <article class="towns-wrapper">
         <div th:each="town:${towns}" class="gridContainer2">
             <h2 class="town-name" th:text="${town.getName()}"></h2>
-            <a href="/allTrails" class="img-container">
+            <a th:href="'/allTrails-' + ${town.getName()}" class="img-container">
                 <img class="town-img" th:src="${town.getImageTown()}" th:alt="${town.getName()}">
             </a>
             <div class="BannerTrail">

src/test/java/Team5/SmartTowns/DatasourceConfig.java

 package Team5.SmartTowns;
 
+import javax.sql.DataSource;
 import org.springframework.context.annotation.Bean;
 import org.springframework.context.annotation.Configuration;
 import org.springframework.jdbc.datasource.DriverManagerDataSource;
 
-import javax.sql.DataSource;
 @Configuration
 public class DataSourceConfig {
 
     @Bean
     public DataSource dataSource(){
-        DriverManagerDataSource dataSource = new DriverManagerDataSource();
-        dataSource.setUrl("jdbc:mariadb://localhost:3306/test_towns");
-        dataSource.setUsername("root");
-        dataSource.setPassword("comsc");
-        return dataSource;
+            DriverManagerDataSource dataSource = new DriverManagerDataSource();
+            dataSource.setUrl("jdbc:mariadb://localhost:3306/test_towns");
+            dataSource.setUsername("root");
+            dataSource.setPassword("comsc");
+            return dataSource;
     }
-
-}
+}
\ No newline at end of file