diff options
Diffstat (limited to 'views/eventgroup.handlebars')
-rwxr-xr-x | views/eventgroup.handlebars | 114 |
1 files changed, 105 insertions, 9 deletions
diff --git a/views/eventgroup.handlebars b/views/eventgroup.handlebars index 03a5b27..d7726bd 100755 --- a/views/eventgroup.handlebars +++ b/views/eventgroup.handlebars @@ -5,16 +5,15 @@ {{/if}} <div class="row"> <div class="col-lg"> - <h3 id="eventName">{{eventGroupData.name}}</h3> + <h3 id="eventName" data-event-id="{{eventGroupData.id}}">{{eventGroupData.name}}</h3> </div> - {{#if editingEnabled}} <div class="col-lg-2 ml-2 edit-buttons"> - <div class="btn-group" role="group" aria-label="Event controls"> - <button type="button" id="editEvent" class="btn btn-success" data-toggle="modal" data-target="#editModal" ><i class="fas fa-edit"></i></button> - <button type="button" id="deleteEvent" class="btn btn-danger" data-toggle="modal" data-target="#deleteModal"><i class="fas fa-trash"></i></button> - </div> + {{#if editingEnabled}} + <button type="button" id="editEvent" class="btn btn-success text-nowrap" data-event-id="{{eventGroupData.id}}" data-toggle="modal" data-target="#editModal"><i class="fas fa-edit"></i> Edit group</button> + {{else}} + <button type="button" id="editEvent" class="btn btn-success text-nowrap" data-event-id="{{eventGroupData.id}}" data-toggle="modal" data-target="#editTokenModal"><i class="fas fa-edit"></i> Edit group</button> + {{/if}} </div> - {{/if}} </div> {{#if firstLoad}} <div class="alert alert-success alert-dismissible fade show" role="alert"> @@ -70,7 +69,7 @@ <td><span class="code">{{eventGroupData.id}}</span></td> </tr> <tr> - <td><strong>Event group secret editing code</strong></td> + <td><strong>Event group editing password</strong></td> <td><span class="code">{{eventGroupData.editToken}}</span></td> </tr> </table> @@ -116,7 +115,7 @@ <span aria-hidden="true">×</span> </button> </div> - <form action="/deleteeventgroup/{{eventGroupData.id}}/{{eventGroupData.editToken}}" method="post"> + <form id="deleteEventGroupForm" action="/deleteeventgroup/{{eventGroupData.id}}/{{eventGroupData.editToken}}" method="post"> <div class="modal-body"> <p>Are you sure you want to delete this event group? This action cannot be undone.</p> <p>This will <strong>not</strong> delete the individual events contained in this group. They can be linked to another group later.</p> @@ -132,6 +131,37 @@ {{/if}} +<div class="modal fade" id="editTokenModal" tabindex="-1" role="dialog" aria-labelledby="editTokenModalLabel" aria-hidden="true"> + <div class="modal-dialog" role="document"> + <div class="modal-content"> + <div class="modal-header"> + <h5 class="modal-title" id="editTokenModalLabel">Enter editing password</h5> + <button type="button" class="close" data-dismiss="modal" aria-label="Close"> + <span aria-hidden="true">×</span> + </button> + </div> + <form id="verifyTokenForm" action="/verifytoken/group/{{eventGroupData.id}}" method="post"> + <div class="modal-body"> + <div class="form-group"> + <p class="form-text small">Enter the editing password you received by email or were shown when the event was created.</p> + <div class="form-group"> + <input type="text" class="form-control" id="editToken" name="editToken" placeholder="Get it right!" data-validation="required"> + </div> + <div class="form-group"> + <div class="alert alert-danger" style="display:none;"></div> + </div> + </div> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> + <button type="submit" class="btn btn-primary">Edit group</button> + </div> + </form> + </div> + </div> +</div> + + <script> $.validate({ lang: 'en', @@ -141,6 +171,47 @@ }); $(document).ready(function() { + // Save the editing token from the URL, if it is valid + const eventID = $('#eventName').attr('data-event-id'); + const urlParams = new URLSearchParams(window.location.search); + if (urlParams.has('e')) { + $.ajax({ + type: "POST", + url: `/verifytoken/group/${eventID}`, + data: { editToken: urlParams.get('e') }, + success: function(response, status, xhr) { + if (xhr.status === 200) { + addStoredToken(eventID, urlParams.get('e')); + } + }, + error: function(response, status, xhr) { + // The editing token is wrong - remove it + removeStoredToken(eventID); + window.location = window.location.pathname; + } + }); + } else if (getStoredToken(eventID)) { + const editToken = getStoredToken(eventID); + $.ajax({ + type: "POST", + url: `/verifytoken/group/${eventID}`, + data: { editToken }, + success: function(response, status, xhr) { + if (xhr.status === 200) { + window.location.search = `?e=${editToken}`; + } + }, + error: function(response, status, xhr) { + // The editing token is wrong - remove it + removeStoredToken(eventID); + } + }); + } + + if (urlParams.has('show_edit')) { + $('#editModal').modal('show'); + } + $.uploadPreview({ input_field: "#eventGroupImageUpload", preview_box: "#eventGroupImagePreview", @@ -157,6 +228,31 @@ $("#copyEventLink").click(function(){ $(this).html('<i class="fas fa-copy"></i> Copied!'); setTimeout(function(){ $("#copyEventLink").html('<i class="fas fa-copy"></i> Copy');}, 5000); + }); + + $('#verifyTokenForm').on('submit', function(e) { + e.preventDefault(); + let form = $(this); + $.ajax({ + type: "POST", + url: form.attr('action'), + data: form.serialize(), + success: function(response, status, xhr) { + if (xhr.status === 200) { + // Save the token to localStorage for later + addStoredToken($('#eventName').attr('data-event-id'), new FormData(form[0]).get('editToken')); + window.location.search = `?e=${new FormData(form[0]).get('editToken')}&show_edit=true`; + } + }, + error: function(response, status, xhr) { + form.find('.alert').text('That editing password is incorrect. Try again.').show(); + } + }); + }); + + $('#deleteEvent').on('click', function() { + $('#editModal').modal('hide'); }) + }); </script> |