diff --git a/src/main/java/Team5/SmartTowns/Towns/TownController.java b/src/main/java/Team5/SmartTowns/Towns/TownController.java
new file mode 100644
index 0000000000000000000000000000000000000000..aa15a341da7fe2ef346f5278ae1a55faaa3136fc
--- /dev/null
+++ b/src/main/java/Team5/SmartTowns/Towns/TownController.java
@@ -0,0 +1,21 @@
+package Team5.SmartTowns.Towns;
+
+import org.springframework.stereotype.Controller;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.servlet.ModelAndView;
+
+import java.util.List;
+
+@Controller
+public class TownController {
+
+ @GetMapping("/home")
+ public ModelAndView getTownList(){
+ ModelAndView modelAndView = new ModelAndView("Towns/home/homePage");
+ TownStorage townsCurrent= new TownStorage().getInstance();
+ List<Towns> towns = townsCurrent.getTownList();
+ modelAndView.addObject("towns",towns);
+ return modelAndView;
+
+ }
+}
diff --git a/src/main/java/Team5/SmartTowns/Towns/TownStorage.java b/src/main/java/Team5/SmartTowns/Towns/TownStorage.java
new file mode 100644
index 0000000000000000000000000000000000000000..d2d99ea992086630324fa131ad5bb410acd3c425
--- /dev/null
+++ b/src/main/java/Team5/SmartTowns/Towns/TownStorage.java
@@ -0,0 +1,44 @@
+package Team5.SmartTowns.Towns;
+
+import java.util.ArrayList;
+import java.util.List;
+
+public class TownStorage {
+ private List<Towns> townList;
+ private static TownStorage singleton;
+
+ TownStorage() {
+ townList = new ArrayList<>();
+ townList.addAll(
+ List.of(
+ new Towns("Caerphilly",01,3,70,"/images/CaerphillyCastle.jpg"),
+ new Towns("Risca",02,2,34,"/images/RiscaBanner.jpg"),
+ new Towns("Penarth",03,5,0,"/images/PenarthBanner.jpg"),
+ new Towns("Penarth",03,5,50,"/images/PenarthBanner.jpg"),
+ new Towns("Caerphilly",01,3,70,"/images/CaerphillyCastle.jpg"),
+ new Towns("Risca",02,2,90,"/images/RiscaBanner.jpg"),
+ new Towns("Penarth",03,5,100,"/images/PenarthBanner.jpg")
+
+
+
+ )
+
+ );
+
+ }
+ public static TownStorage getInstance() {
+ if (singleton == null) {
+ singleton = new TownStorage();
+
+ }
+ return singleton;
+ }
+
+ public List<Towns> getTownList() {
+ return townList;
+ }
+
+
+
+
+}
diff --git a/src/main/java/Team5/SmartTowns/Towns/Towns.java b/src/main/java/Team5/SmartTowns/Towns/Towns.java
new file mode 100644
index 0000000000000000000000000000000000000000..a1b103f7abf6aa4379d877c645185f2c522a25ba
--- /dev/null
+++ b/src/main/java/Team5/SmartTowns/Towns/Towns.java
@@ -0,0 +1,62 @@
+package Team5.SmartTowns.Towns;
+
+import lombok.Data;
+
+@Data
+public class Towns {
+ private String name;
+ private Integer id;
+ private int trailNumber;
+ private int trailProgress;
+
+ private String imageTown;
+
+
+ public String getName() {
+ return name;
+ }
+
+ public void setName(String name) {
+ this.name = name;
+ }
+
+ public Integer getId() {
+ return id;
+ }
+
+ public void setId(Integer id) {
+ this.id = id;
+ }
+
+ public int getTrailNumber() {
+ return trailNumber;
+ }
+
+ public void setTrailNumber(int trailNumber) {
+ this.trailNumber = trailNumber;
+ }
+
+ public int getTrailProgress() {
+ return trailProgress;
+ }
+
+ public void setTrailProgress(int trailProgress) {
+ this.trailProgress = trailProgress;
+ }
+
+ public String getImageTown() {
+ return imageTown;
+ }
+
+ public void setImageTown(String imageTown) {
+ this.imageTown = imageTown;
+ }
+
+ public Towns(String name, Integer id, int trailNumber, int trailProgress, String imageTown) {
+ this.name = name;
+ this.id = id;
+ this.trailNumber = trailNumber;
+ this.trailProgress = trailProgress;
+ this.imageTown = imageTown;
+ }
+}
diff --git a/src/main/java/Team5/SmartTowns/Webpages/WebpageController.java b/src/main/java/Team5/SmartTowns/Webpages/WebpageController.java
index 5338f32f6dcbd262d1b9070169fcbaa211363a44..37a30366e5335d1870c202d1a49b4a5d2bca474d 100644
--- a/src/main/java/Team5/SmartTowns/Webpages/WebpageController.java
+++ b/src/main/java/Team5/SmartTowns/Webpages/WebpageController.java
@@ -11,27 +11,28 @@ import org.springframework.stereotype.Controller;
public class WebpageController {
@GetMapping("/Caerleon")
public ModelAndView getCaerleonPage(){
- ModelAndView modelAndView = new ModelAndView("towns/caerleon");
+ ModelAndView modelAndView = new ModelAndView("Towns/caerleon");
return modelAndView;
}
@GetMapping("/Caerphilly")
public ModelAndView getCaerphillyPage(){
- ModelAndView modelAndView = new ModelAndView("towns/caerphilly");
+ ModelAndView modelAndView = new ModelAndView("Towns/caerphilly");
return modelAndView;
}
@GetMapping("/Risca")
public ModelAndView getRiscaPage(){
- ModelAndView modelAndView = new ModelAndView("towns/risca");
+ ModelAndView modelAndView = new ModelAndView("Towns/risca");
return modelAndView;
}
- @GetMapping("/home")
- public ModelAndView getHome(){
- ModelAndView modelAndView = new ModelAndView("towns/home/homePage");
- return modelAndView;
- }
+// @GetMapping("/home")
+// public ModelAndView getHome(){
+// ModelAndView modelAndView = new ModelAndView("Towns/home/homePage");
+// return modelAndView;
+// }
+
@RequestMapping(value="/test_ajax_frag", method=RequestMethod.POST)
public String sendHtmlFragment(Model map) {
diff --git a/src/main/resources/data.sql b/src/main/resources/data.sql
index c7b960defab205639d46c66fcad52df8ffb3fc18..13137e1537cdf71c3ea608325401c3e70c58cfa4 100644
--- a/src/main/resources/data.sql
+++ b/src/main/resources/data.sql
@@ -3,32 +3,32 @@ insert into users (userID, Name) value ('1', 'Hannah');
insert into users (userID, Name) value ('2', 'Nigel');
delete from trails;
-insert into trails (trailID, Name) value ('1', 'Caerphilly Coffee Trail');
-insert into trails (trailID, Name) value ('2', 'Penarth Dragon Trail');
+insert into trails ( Name) value ( 'Caerphilly Coffee Trail');
+insert into trails ( Name) value ( 'Penarth Dragon Trail');
delete from locations;
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (1, 'St Cenydd','','Location description here','Caerphilly',0101);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (2, 'The Castle','','Location description here','Caerphilly',0101);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (3, 'Medieval Trades','','Location description here','Caerphilly',0101);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (4, 'The Queen''s War','','Location description here','Caerphilly',0101);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (5, 'The Green Lady','','Location description here','Caerphilly',0101);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (6, 'Armoury','','Location description here','Caerphilly',0101);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (7, 'Architecture','','Location description here','Caerphilly',0101);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (8, '21st Century Landmark','','Location description here','Caerphilly',0101);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'St Cenydd','','Location description here','Caerphilly',0101);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'The Castle','','Location description here','Caerphilly',0101);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Medieval Trades','','Location description here','Caerphilly',0101);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'The Queen''s War','','Location description here','Caerphilly',0101);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'The Green Lady','','Location description here','Caerphilly',0101);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Armoury','','Location description here','Caerphilly',0101);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Architecture','','Location description here','Caerphilly',0101);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( '21st Century Landmark','','Location description here','Caerphilly',0101);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (9, 'JD Wetherspoons-Malcolm Uphill','','Location description here','Caerphilly',0102);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (10, 'Caerphilly Cwtch','','Location description here','Caerphilly',0102);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (11, 'Caerphilly Conservative Club','','Location description here','Caerphilly',0102);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (12, 'The King''s Arms','','Location description here','Caerphilly',0102);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'JD Wetherspoons-Malcolm Uphill','','Location description here','Caerphilly',0102);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Caerphilly Cwtch','','Location description here','Caerphilly',0102);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Caerphilly Conservative Club','','Location description here','Caerphilly',0102);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'The King''s Arms','','Location description here','Caerphilly',0102);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (13, 'Caerphilly Bus Station','','Location description here','Caerphilly',0103);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (14, 'The Medieval Courthouse','','Location description here','Caerphilly',0103);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (15 ,'Caerphilly Castle','','Location description here','Caerphilly',0103);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (16, 'Ty Vaughan House','','Location description here','Caerphilly',0103);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Caerphilly Bus Station','','Location description here','Caerphilly',0103);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'The Medieval Courthouse','','Location description here','Caerphilly',0103);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ('Caerphilly Castle','','Location description here','Caerphilly',0103);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Ty Vaughan House','','Location description here','Caerphilly',0103);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (17, 'Risca Colliery','','Location description here','Risca',0201);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (18, 'Black Vein Colliery Disaster','','Location description here','Risca',0201);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Risca Colliery','','Location description here','Risca',0201);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'Black Vein Colliery Disaster','','Location description here','Risca',0201);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (19, 'The Esplanade','','Location description here','Penarth',0301);
-insert into locations (locationID, locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value (20, 'The Old Swimming Baths','','Location description here','Penarth',0301);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'The Esplanade','','Location description here','Penarth',0301);
+insert into locations ( locationName , locationEmail,locationDescription,locationPlace, locationTrailID) value ( 'The Old Swimming Baths','','Location description here','Penarth',0301);
diff --git a/src/main/resources/static/css/homePageStyle.css b/src/main/resources/static/css/homePageStyle.css
index 6e2a91e341594ae4f89a867da1bc89fb93d4c4f1..64f767d40b32ccef413ea7b749e11356ef045aa4 100644
--- a/src/main/resources/static/css/homePageStyle.css
+++ b/src/main/resources/static/css/homePageStyle.css
@@ -1,3 +1,4 @@
+
body{
background-color: rgb(41, 41, 41)
}
@@ -8,117 +9,164 @@ body{
.submitLand{
grid-area: submitButton;
}
-.caerphillyBanner , .riscaBanner,.penarthBanner{
+.Banner {
margin-top: 20px;
background-color: darkslategrey;
margin-bottom: 20px;
- border: solid 2px whitesmoke;
+ /*border: solid 2px whitesmoke;*/
/*border colour here at .banner and .bannertrail*/
border-right: none;
}
-.caerphillyBannerTrail,.riscaBannerTrail,.penarthBannerTrail{
- background-color: darkslategrey;
+
+/* .BannerTrail.Complete(100%) .BannerTrail.closeComplete(90-99%) .BannerTrail.nearComplete(70-99%) .BannerTrail.farComplete(50-69%) .BannerTrail.notComplete(0-49%) */
+.BannerTrail, .BannerTrail.Complete, .BannerTrail.closeComplete, .BannerTrail.nearComplete, .BannerTrail.farComplete, .BannerTrail.notComplete {
margin-top: 20px;
margin-bottom: 20px;
border: solid 2px whitesmoke;
- border-left: none;
text-align: center;
}
-.penarthBannerTrail{
- background-image: linear-gradient(to right, darkslategrey , darkgoldenrod 40%);
+.BannerTrail th, .BannerTrail.Complete th, .BannerTrail.closeComplete th, .BannerTrail.nearComplete th, .BannerTrail.farComplete th, .BannerTrail.notComplete th{
+ grid-area:townBannerDetsR
}
-.caerphillyBannerTrail{
- margin-top: 20px;
- margin-bottom: 20px;
- border: solid 2px whitesmoke;
- border-left: none;
- background-image: linear-gradient(to right, darkslategrey , darkgoldenrod 30%);
+.BannerTrail, .BannerTrail.Complete, .BannerTrail.closeComplete, .BannerTrail.nearComplete, .BannerTrail.farComplete, .BannerTrail.notComplete{
+ grid-area:townBannerDets;
}
-.caerphillyBanner{
- grid-area:townBannerC;
- background-image: url('/images/CaerphillyCastle.jpg');
- /*// from cadw*/
- background-size: 850px 200px;
- background-repeat: no-repeat;
- background-position: left 35%;
- color: inherit;
- text-decoration: none;
- /*filter: grayscale(30%);*/
+.BannerTrail {
+ background-color: darkslategrey;
+
}
-/*!*https://www.stayinwales.co.uk/wales_picture.cfm?p=4454*! Risca img*/
+.BannerTrail.Complete {
+ background-color: gold;
+ border: 2px solid gold;
+ border-left: solid 2px whitesmoke;
+}
+.BannerTrail.closeComplete {
+ background-color: darkgoldenrod;
+ background-color: darkgoldenrod;
+ border: 2px solid darkgoldenrod;
+ border-left: solid 2px whitesmoke;
+}
-.riscaBanner {
- /* #caerUrl{*/
- grid-area: townBannerR;
- background-image: url('/images/RiscaBanner.jpg');
- background-size: 850px 200px;
- background-repeat: no-repeat;
- background-position: left 65%;
- color: inherit;
- text-decoration: none;
+.BannerTrail.nearComplete {
+ background-color: deepskyblue;
+ background-color: deepskyblue;
+ border: 2px solid deepskyblue;
+ border-left: solid 2px whitesmoke;
}
-.penarthBanner {
- grid-area: townBannerP;
- background-image: url('/images/PenarthBanner.jpg');
- background-size: 850px 200px;
- background-repeat: no-repeat;
- background-position: left 78%;
- color: inherit;
- text-decoration: none;
+.BannerTrail.farComplete {
+ background-color: green;
+ background-color: green;
+ border: 2px solid green;
+ border-left: solid 2px whitesmoke;
+}
+
+.BannerTrail.notComplete {
+ background-color: red;
+ background-color: red;
+ border: 2px solid red;
+ border-left: solid 2px whitesmoke;
}
-.caerphillyBannerTrail{
- grid-area:townBannerDetsC;
+
+/*Below selects banner that has the Complete class to change color*/
+.Banner:has(+.BannerTrail.Complete){
+ border: 2px solid gold;
+ border-right: solid 2px whitesmoke;
}
-.riscaBanner{
- grid-area:townBannerR;
+
+.Banner:has(+.BannerTrail.closeComplete){
+ border: 2px solid darkgoldenrod;
+ border-right: solid 2px whitesmoke;
}
-.riscaBannerTrail{
- grid-area:townBannerDetsR;
+
+
+.Banner:has(+.BannerTrail.nearComplete){
+ border: 2px solid deepskyblue;
+ border-right: solid 2px whitesmoke;
}
-.penarthBanner{
- grid-area:townBannerP;
+.Banner:has(+.BannerTrail.farComplete){
+ border: 2px solid green;
+ border-right: solid 2px whitesmoke;
}
-.penarthBannerTrail{
- grid-area:townBannerDetsP;
+.Banner:has(+.BannerTrail.notComplete){
+ border: 2px solid red;
+ border-right: solid 2px whitesmoke;
}
+
+
+.BannerTrail {
+ background-color: darkslategrey;
+
+}
+
+
+
+
+
+
+.Banner {
+ grid-area:townBanner;
+ color: inherit;
+ text-decoration: none;
+ background-color: hotpink;
+}
+
+
+a{
+ background-size: contain;
+
+}
+
+
+
#aboutUsFlavour{
grid-area: textFlavour;
margin-top: 25px;
margin-bottom: 15px;
color: whitesmoke;
}
-#trailCountCaer,#trailCountRisca,#trailCountPenarth{
+#trailCount{
flex:1;
- /*align-items: center;*/
- /*justify-content: center;*/
+
}
-#trailProgressCaer,#trailProgressRisca,#trailProgressPenarth{
+#trailProgress{
flex:2;
align-content: center;
}
-.gridContainer1{
+.gridContainer1 {
display:grid;
grid-template-columns: 10% 10% 60% 5% 5% 10%;
grid-template-rows: auto;
grid-template-areas:
". pageTitle pageTitle pageTitle pageTitle ."
- ". . . submitButton submitButton ."
- ". townBannerC townBannerC townBannerDetsC . ."
- ". townBannerR townBannerR townBannerDetsR . ."
- ". townBannerP townBannerP townBannerDetsP . ."
- " . . textFlavour . . .";
+ ". . . submitButton submitButton .";
+}
+
+.gridContainer2 {
+ display:grid;
+ grid-template-columns: 10% 10% 60% 5% 5% 10%;
+ grid-template-rows: auto;
+ grid-template-areas:
+
+ ". townBanner townBanner townBannerDets . .";
}
+.gridContainer3 {
+ display:grid;
+ grid-template-columns: 10% 10% 60% 5% 5% 10%;
+ grid-template-rows: auto;
+ grid-template-areas:
+ " . . textFlavour . . .";
+}
diff --git a/src/main/resources/templates/Landmarks/LandmarkFormTh.html b/src/main/resources/templates/Landmarks/LandmarkFormTh.html
index b54a9143e3a41726670ad9acdb98c82b1cef3aca..b77bb90ece04cc582bc5fa5ea369bd8ba45e864b 100644
--- a/src/main/resources/templates/Landmarks/LandmarkFormTh.html
+++ b/src/main/resources/templates/Landmarks/LandmarkFormTh.html
@@ -5,9 +5,7 @@
<title>Landmark Sign Up</title>
<link rel="stylesheet" th:href="@{css/landmarkFormStyle.css}">
<link rel="stylesheet" th:href="@{css/templatingstyle.css}">
-<!-- <link rel="script" th:href="@{scripts/landmarkFormThScript.js}">-->
<script src="scripts/landmarkFormThScript.js"></script>
-<!-- <style in="scripts/landmarkFormThScript.js"></style>-->
</head>
diff --git a/src/main/resources/templates/towns/home/homePage.html b/src/main/resources/templates/towns/home/homePage.html
index 0f80da587b942b6f12ef7bce29913df3fa077838..2cdc1e854fba95f89dd2da702bbeb6d5011ed5d8 100644
--- a/src/main/resources/templates/towns/home/homePage.html
+++ b/src/main/resources/templates/towns/home/homePage.html
@@ -2,62 +2,58 @@
<html lang="en">
<head>
<meta charset="UTF-8">
- <title>Title</title>
+ <title>VZTA - Smart Towns Trails</title>
<link rel="stylesheet" th:href="@{/css/homePageStyle.css}">
<link rel="stylesheet" th:href="@{/css/templatingstyle.css}">
-
</head>
<body>
<header th:insert="~{/towns/Templating.html::header}"></header>
<main>
-<div class="gridContainer1">
- <H1 id="homeTitle"> VZTA Smart Towns - Trails</H1>
- <a class="submitLand" href="/landmarkSubmission"> <button> Submit Landmark!</button></a>
-
- <a href="/allTrails" class="caerphillyBanner">
- <H2> Caerphilly</H2></a>
-
-
- <div class="caerphillyBannerTrail">
- <div id="trailCountCaer">Trails: 3</div>
- <div id="trailProgressCaer">70%</div>
- </div>
-
- <a href="/allTrails" class="riscaBanner">
- <H2> Risca</H2> </a>
-
- <div class="riscaBannerTrail">
- <div id="trailCountRisca">Trails: 2</div>
- <div id="trailProgressRisca">0%</div>
+ <div class="gridContainer1">
+ <H1 id="homeTitle"> VZTA Smart Towns - Trails</H1>
+ <a class="submitLand" href="/landmarkSubmission"> <button> Submit Landmark!</button></a>
+<!-- <div th:text="${towns}">-->
</div>
+ <div th:each="town:${towns}" class="gridContainer2">
- <a href="/allTrails" class="penarthBanner">
- <H2> Penarth</H2> </a>
- <div class="penarthBannerTrail">
- <div id="trailCountPenarth">Trails: 5</div>
- <div id="trailProgressPenarth">60%</div>
- </div>
-
- <div id="aboutUsFlavour"> This is placeholder text about VZTA, this application,
- the trails and towns and resultant awards written in an excitable manner!!</div>
+ <a href="/allTrails" class="Banner"
+ th:style="'background:url('+ ${town.getImageTown()} +');'"
+ th:styleappend="'background-size: 80vw 24vh;'+'background-repeat: no-repeat;'+'background-position: left 30%;'" />
-</div>
+ <H2 th:text="${town.getName()}"> </H2></a>
+ <div class="BannerTrail"th:classappend="|${town.getTrailProgress()==100 ? 'Complete' : ''} ${town.getTrailProgress()<100 and town.getTrailProgress()>=90 ? 'closeComplete' : ''''} ${town.getTrailProgress()<90 and town.getTrailProgress()>=70 ? 'nearComplete' : ''''} ${town.getTrailProgress()<70 and town.getTrailProgress()>=50 ? 'farComplete' : ''''} ${town.getTrailProgress()<50 ? 'notComplete' : ''''}|"
+ >
+<!--Rough class append used to distinguish progress, using a class append based on progress can allow for further customisation to banners later on
+rough % outline;
+100 -gold
+90-99 - darkgold
+70-89 - blue
+50-69-green
+0-49-red-->
+ <div id="trailCount" th:text="'Trails: '+ ${town.getTrailNumber()}">Trails: </div>
+ <div id="trailProgress" th:text="${town.getTrailProgress()}+'%'"></div>
+ </div>
+ </div>
+<div class="gridContainer3">
+ <div id="aboutUsFlavour"> This is placeholder text about VZTA, this application,
+ the trails and towns and resultant awards written in an excitable manner!!</div>
+ </div>
</main>
<footer th:insert="~{/towns/Templating.html::footer}"></footer>
diff --git a/src/main/resources/templates/towns/home/homePageOld.html b/src/main/resources/templates/towns/home/homePageOld.html
new file mode 100644
index 0000000000000000000000000000000000000000..bf35e662607a4b2a101aeef83f3a05a65fd50ad2
--- /dev/null
+++ b/src/main/resources/templates/towns/home/homePageOld.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>Title</title>
+<!-- <link rel="stylesheet" th:href="@{/css/homePageStyle.css}">-->
+ <link rel="stylesheet" th:href="@{/css/templatingstyle.css}">
+
+</head>
+<body>
+
+<header th:insert="~{/towns/Templating.html::header}"></header>
+<main>
+<div class="gridContainer1">
+ <H1 id="homeTitle"> VZTA Smart Towns - Trails</H1>
+ <a class="submitLand" href="/landmarkSubmission"> <button> Submit Landmark!</button></a>
+
+ <a href="/allTrails" class="caerphillyBanner">
+ <H2> Caerphilly</H2></a>
+
+
+ <div class="caerphillyBannerTrail">
+ <div id="trailCountCaer">Trails: 3</div>
+ <div id="trailProgressCaer">70%</div>
+ </div>
+
+ <a href="/allTrails" class="riscaBanner">
+ <H2> Risca</H2> </a>
+
+ <div class="riscaBannerTrail">
+ <div id="trailCountRisca">Trails: 2</div>
+ <div id="trailProgressRisca">0%</div>
+ </div>
+
+
+ <a href="/allTrails" class="penarthBanner">
+ <H2> Penarth</H2> </a>
+ <div class="penarthBannerTrail">
+ <div id="trailCountPenarth">Trails: 5</div>
+ <div id="trailProgressPenarth">60%</div>
+ </div>
+
+ <div id="aboutUsFlavour"> This is placeholder text about VZTA, this application,
+ the trails and towns and resultant awards written in an excitable manner!!</div>
+
+</div>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+</main>
+<footer th:insert="~{/towns/Templating.html::footer}"></footer>
+
+</body>
+</html>