Skip to content

Commit dff423f

Browse files
BrianRamsayBrianRamsay
authored
Merge pull request #1296 from BCStudentSoftwareDevTeam/eventtoggles
Create Events Page: Split the toggle buttons into 2 sections, and make one of 3 toggles required
2 parents b85faed + dc379b6 commit dff423f

File tree

3 files changed

+64
-25
lines changed

3 files changed

+64
-25
lines changed

‎app/static/css/createEvent.css

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
.toggleHeader{
2+
padding-bottom: 10px;
3+
font-weight: bold;
4+
text-align: center;
5+
margin-left: 50%; /* Position the header at 50% of the viewport width */
6+
transform: translateX(-50%);
7+
width: 200px
8+
}
9+
.columnDivide{
10+
flex: 1;
11+
border-left: 2px solid grey;
12+
margin-left: 10px;
13+
margin-right: -30px;
14+
}

‎app/static/js/createEvents.js

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,12 @@ function calculateRecurringEventFrequency(){
5959
}
6060

6161
$(document).ready(function () {
62+
//makes sure bonners toggle will stay on between event pages
63+
if (window.location.pathname == '/event/' + $('#newEventID').val() + '/edit') {
64+
if ($("#checkBonners")) {
65+
$("#checkBonners").prop('checked', true);
66+
}
67+
}
6268
// Initialize datepicker with proper options
6369
$.datepicker.setDefaults({
6470
dateFormat: 'yy/mm/dd', // Ensures compatibility across browsers
@@ -98,10 +104,24 @@ $(document).ready(function () {
98104
$("#limitGroup").hide();
99105
}
100106
});
107+
// Determine which checkbox was clicked and its current checked status, uncheck others
108+
$("#checkIsTraining, #checkServiceHours, #checkBonners").on('click', function (event) {
109+
$("#checkIsTraining, #checkServiceHours, #checkBonners").not($(event.target)).prop('checked', false);
110+
});
101111

102-
// Disable button when we are ready to submit
103112
$("#saveEvent").on('submit', function (event) {
104-
$(this).find("input[type=submit]").prop("disabled", true);
113+
let trainingStatus = $("#checkIsTraining").is(":checked")
114+
let serviceHourStatus = $("#checkServiceHours").is(":checked")
115+
let bonnersStatus = $("#checkBonners").is(":checked")
116+
//check if user has selected a toggle, cancel form submission if not
117+
if(trainingStatus || serviceHourStatus || bonnersStatus){
118+
// Disable button when we are ready to submit
119+
$(this).find("input[type=submit]").prop("disabled", true);
120+
}
121+
else {
122+
msgFlash("You must toggle event is a training, event earns service hours, or is a Bonners Scholars event!", "danger");
123+
event.preventDefault();
124+
}
105125
});
106126

107127
$("#checkIsRecurring").click(function () {

‎app/templates/admin/createEvent.html

Lines changed: 28 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@
3737
{% block styles %}
3838
{{super()}}
3939
<link href="https://cdn.jsdelivr.net/gh/kartik-v/[email protected]/css/fileinput.min.css" media="all" rel="stylesheet" type="text/css" />
40+
<link rel="stylesheet" href="/static/css/createEvent.css">
4041
{% endblock %}
4142

4243
{% block app_content %}
@@ -59,10 +60,7 @@ <h1>{{page_title}}</h1>
5960

6061
<div class="form-group mb-4">
6162
<label class="required form-label" for='inputEventLocation-{{pageLocation}}'><strong>Location</strong></label>
62-
<input class="form-control" id='inputEventLocation-{{pageLocation}}' placeholder="Enter location" name="location" required>
63-
{% if eventData.location %}
64-
value="{{eventData.location}}"
65-
{% endif %}
63+
<input class="form-control" id='inputEventLocation-{{pageLocation}}' placeholder="Enter location" name="location" value="{{eventData.location}}" required>
6664
</div>
6765
<!-- Start and End Datepickers -->
6866
<div class="row col-md-12">
@@ -134,7 +132,7 @@ <h1>{{page_title}}</h1>
134132
<div class="row p-2">
135133
<div class="col-md-6">
136134
{% if eventData.id %}
137-
<input type="hidden" name="id" value="{{eventData.id}}">
135+
<input type="hidden" id="newEventID" name="id" value="{{eventData.id}}">
138136
{% endif %}
139137
<div class="form-group mb-4">
140138
<label class="required form-label" for='inputEventName'><strong>Event Name</strong></label>
@@ -233,35 +231,42 @@ <h1>{{page_title}}</h1>
233231
</div>
234232
{% if page_title != 'Create All Volunteer Training' %}
235233
<div class="pt-4 mb-4">
236-
<div class="row col-md-12">
237-
<div class="form-group col-md-6">
234+
<div class="row">
235+
<div class="form-group col-xl-5">
236+
<label class="label toggleHeader">(Optional)</label>
238237
<div class="form-check form-switch mb-2">
239238
<label class="custom-control-label" for='checkRSVP'><strong>This event requires RSVP.</strong></label>
240239
<input class="form-check-input" type="checkbox" id="checkRSVP" name="isRsvpRequired" {{"checked" if eventData.isRsvpRequired}}/>
241240
</div>
242-
</div>
243-
<div class="form-group col-md-6">
244-
<div class="form-check form-switch ">
245-
<label class="custom-control-label" for="checkIsTraining"><strong>This event is a training.</strong></label>
246-
<input class="form-check-input" type="checkbox" id="checkIsTraining" name="isTraining" {{"checked" if eventData.isTraining}}/>
247-
</div>
248-
</div>
249-
<div class="form-group col-md-6 mb-3">
250-
<div class="form-check form-switch">
251-
{% set hide = "" if eventData.isRsvpRequired else "display: none" %}
252-
<div class="form-group" id="limitGroup" style= "{{hide}}">
253-
<label class="form-label mt-2" for='limitRsvp'><strong>Attendance Limit</strong></label>
254-
<input class="form-control mb-2" type="number" id="limitRsvp" name="rsvpLimit" value="{{eventData.rsvpLimit}}" min="0" placeholder="No Limit" pattern="^[0-9]+$"></input>
241+
<div class="form-group mb-3">
242+
<div class="form-check form-switch">
243+
{% set hide = "" if eventData.isRsvpRequired else "display: none" %}
244+
<div class="form-group" id="limitGroup" style= "{{hide}}">
245+
<label class="form-label mt-2" for='limitRsvp'><strong>Attendance Limit</strong></label>
246+
<input class="form-control mb-2" type="number" id="limitRsvp" name="rsvpLimit" value="{{eventData.rsvpLimit}}" min="0" placeholder="No Limit" pattern="^[0-9]+$"></input>
247+
</div>
248+
<label class="custom-control-label" for="checkFood"><strong>This event will provide food.</strong></label>
249+
<input class="form-check-input" type="checkbox" id="checkFood" name="isFoodProvided" {{"checked" if eventData.isFoodProvided}}/>
255250
</div>
256-
<label class="custom-control-label" for="checkFood"><strong>This event will provide food.</strong></label>
257-
<input class="form-check-input" type="checkbox" id="checkFood" name="isFoodProvided" {{"checked" if eventData.isFoodProvided}}/>
258251
</div>
259252
</div>
260-
<div class="form-group col-md-6">
253+
<div class="col-xl-1 columnDivide"></div>
254+
<div class="form-group col-xl-6">
255+
<label class="label required toggleHeader">(Must Select One)</label>
256+
<div class="form-check form-switch">
257+
<label class="custom-control-label" for="checkIsTraining"><strong>This event is a training.</strong></label>
258+
<input class="form-check-input" type="checkbox" id="checkIsTraining" name="isTraining" {{"checked" if eventData.isTraining}}/>
259+
</div>
261260
<div class="form-check form-switch">
262261
<label class="custom-control-label" for='checkServiceHours'><strong>This event earns service hours.</strong></label>
263262
<input class="form-check-input" type="checkbox" id="checkServiceHours" name="isService" {{"checked" if eventData.isService}}/>
264263
</div>
264+
{% if eventData['program'].isBonnerScholars %}
265+
<div class="form-check form-switch">
266+
<label class="custom-control-label" for='checkBonners'><strong>This is a Bonner Scholars event.</strong></label>
267+
<input class="form-check-input" type="checkbox" id="checkBonners" name="isBonnersChecked" {{"checked" if eventData['program'].isBonnerScholars and not eventData.isService and not eventData.isTraining}}/>
268+
</div>
269+
{% endif %}
265270
</div>
266271
</div>
267272
</div>

0 commit comments

Comments
 (0)