diff --git a/src/mainapp/models.py b/src/mainapp/models.py index 61529f5..c488af8 100644 --- a/src/mainapp/models.py +++ b/src/mainapp/models.py @@ -14,7 +14,7 @@ class Venue(models.Model): ) name = models.CharField(max_length=255) - description = models.TextField(blank=True) + description = models.TextField(blank=True, max_length=500) extra_notes = models.TextField(blank=True) venue_type = models.CharField(choices=VENUE_TYPES, max_length=50) diff --git a/src/mainapp/templates/venues.html b/src/mainapp/templates/venues.html index 3c317db..4d8714c 100644 --- a/src/mainapp/templates/venues.html +++ b/src/mainapp/templates/venues.html @@ -52,10 +52,32 @@ -
+
{% for venue in venues %} -
-
+
+
+
+
+
+
{{ venue.name }}
+

{{ venue.street_address }}

+

{{ venue.city }}, {{ venue.provence }}

+

{{ venue.postal_code }}

+

{{ venue.phone_number }}

+

{{ venue.email_address }}

+
+
+
+ 6 Waters +
+ +
+
+
+
+
{% endfor %}
@@ -120,7 +139,7 @@
-
+
@@ -172,7 +191,7 @@
Please enter a valid Street Address
-
+
@@ -184,7 +203,7 @@
- + @@ -193,7 +212,7 @@
- + @@ -202,9 +221,12 @@
- + +
Please enter a Country
@@ -225,7 +247,7 @@
-
+
@@ -413,11 +435,30 @@
- + + +
+ + + +
+
diff --git a/src/static/js/mainapp/venues.js b/src/static/js/mainapp/venues.js index 92e4ac9..6cb68e0 100644 --- a/src/static/js/mainapp/venues.js +++ b/src/static/js/mainapp/venues.js @@ -9,8 +9,7 @@ const formControls = [ { id: "venueName", validation: function (element) { - const value = element.val(); - const minlength = element.attr("minlength") || 0; // FIELD IS VALID IF: + const value = element.val(); // FIELD IS VALID IF: return (!element.attr("required") || value.trim() !== ""); // - element is not required OR not empty }, errorMessage: function (element) { @@ -18,7 +17,58 @@ const formControls = [ return `Enter a venue name longer than ${minlength} characters`; } }, + { + id: "venueType", + validation: function (element) { + const value = element.val(); // FIELD IS VALID IF: + return (!element.attr("required") || value !== null); // - element is not required OR not empty + }, + errorMessage: function (element) { + return "Please selected a type of venue"; + } + }, // Address Tab + { + id: "venueStreetAddress", + validation: function (element) { + const value = element.val(); + return (!element.attr("required") || value.trim() !== ""); + }, + errorMessage: function (element) { + return "Enter the street address of the venue"; + } + }, + { + id: "venueCity", + validation: function (element) { + const value = element.val(); + return (!element.attr("required") || value.trim() !== ""); + }, + errorMessage: function (element) { + return "Enter the town or city of the venue"; + } + }, + { + id: "venueProvence", + validation: function (element) { + const value = element.val(); + return (!element.attr("required") || value.trim() !== ""); + }, + errorMessage: function (element) { + return "Enter the provence of the venue"; + } + }, + { + id: "venuePostCode", + validation: function (element) { + const value = element.val(); + return (!element.attr("required") || value.trim() !== ""); + }, + errorMessage: function (element) { + return "Enter the postal code of the venue"; + } + }, + ]; $(document).ready(function() { @@ -39,6 +89,12 @@ $("#newVenueAddressTabBtn").on("shown.bs.tab", function() { zoom:8, layers: [tileLayer] }); + + const UKSouthWest = L.latLng(49.823809, -8.649357); + const UKNorthEast = L.latLng(60.905124, 2.637773); + const UKBounds = L.latLngBounds(UKSouthWest, UKNorthEast); + + map.setMaxBounds(UKBounds); } venueCoords = { @@ -137,20 +193,23 @@ function openVenueModal(venue_id) { const detailsTab = new bootstrap.Tab("#newVenueDetailsTabBtn"); detailsTab.show(); // back to the first tab + $("#venueForm .form-control, #venueForm .form-select").removeClass("is-valid is-invalid"); + $("#venueForm .invalid-feedback").text(""); if (venue_id == -1) { $("#venueModal .edit").hide(); $("#venueModal .create").show(); $("#venueName").val(""); - $("#venueDescription").val(""); $("#venueType").val("").change(); + $("#venueDescription").val(""); + $("#venueExtraNotes").val(""); $("#venueStreetAddress").val(""); $("#venueCity").val(""); $("#venueProvence").val(""); $("#venuePostCode").val(""); - $("#venueCountry").val(""); + // $("#venueCountry").val(""); $("#venueLatitude").val(""); $("#venueLongitude").val(""); @@ -174,14 +233,15 @@ function openVenueModal(venue_id) { const venue = response.data; $("#venueName").val(venue.name); - $("#venueDescription").val(venue.description); $("#venueType").val(venue.venue_type).change(); + $("#venueDescription").val(venue.description); + $("#venueExtraNotes").val(venue.extra_notes); $("#venueStreetAddress").val(venue.street_address); $("#venueCity").val(venue.city); $("#venueProvence").val(venue.provence); $("#venuePostCode").val(venue.postal_code); - $("#venueCountry").val(venue.country); + // $("#venueCountry").val(venue.country); $("#venueLatitude").val(venue.latitude); $("#venueLongitude").val(venue.longitude); @@ -211,7 +271,7 @@ $("#venueForm").on("submit", function(event) { function validateVenue() { // Reset the validation indicators and messages - $("#venueForm .form-control").removeClass("is-valid is-invalid"); + $("#venueForm .form-control, #venueForm .form-select").removeClass("is-valid is-invalid"); $("#venueForm .invalid-feedback").text(""); var valid = true; @@ -272,4 +332,40 @@ function saveVenue() { alert("error: " + JSON.stringify(error)); } }); -} \ No newline at end of file +} + +$("#newVenueTabLeft").on("click", function() { + + const currentTab = $("#newVenueTabBtns .nav-link.active").parent(); + const previousTabParent = currentTab.prev(); + const previousTab = previousTabParent.find(".nav-link"); + previousTab.click(); + + if (previousTabParent.is(":first-child")) { + $("#newVenueTabLeft").prop("disabled", true); + $("#newVenueTabRight").prop("disabled", false); + } + else { + $("#newVenueTabRight").prop("disabled", false); + $("#saveVenue").hide(); + } + +}); + +$("#newVenueTabRight").on("click", function() { + + const currentTab = $("#newVenueTabBtns .nav-link.active").parent(); + const nextTabParent = currentTab.next(); + const nextTab = nextTabParent.find(".nav-link"); + nextTab.click(); + + if (nextTabParent.is(":last-child")) { + $("#newVenueTabRight").prop("disabled", true); + $("#saveVenue").show(); + $("#newVenueTabLeft").prop("disabled", false); + } + else { + $("#newVenueTabLeft").prop("disabled", false); + } + +}); \ No newline at end of file diff --git a/src/static/scss/base.scss b/src/static/scss/base.scss index ddd9719..993312c 100644 --- a/src/static/scss/base.scss +++ b/src/static/scss/base.scss @@ -103,26 +103,27 @@ } -.card-badge-container { - position: relative; +// .card-badge-container { +// position: relative; - .card-badge { - width: 60px; - height: 60px; +// .card-badge { +// aspect-ratio: 1 / 1; - position: absolute; - top: -30px; - right: -30px; +// height: calc(100% + 20px); - background-color: #04385c; - border-bottom: 30px; - border-left: 30px; - border-right: 30px; +// position: absolute; +// top: calc(-30% - 21px); +// left: -26px; - transform: rotate(45deg); - -webkit-transform: rotate(45deg); - } -} +// background-color: #04385c; +// border-bottom: 30px; +// border-left: 30px; +// border-right: 30px; + +// transform: rotate(45deg); +// // -webkit-transform: rotate(45deg); +// } +// } #newVenueTabBtns {