diff options
Diffstat (limited to 'views')
32 files changed, 391 insertions, 614 deletions
diff --git a/views/emails/addeventattendee.handlebars b/views/emails/addEventAttendee/addEventAttendeeHtml.handlebars index 971364c..971364c 100644 --- a/views/emails/addeventattendee.handlebars +++ b/views/emails/addEventAttendee/addEventAttendeeHtml.handlebars diff --git a/views/emails/addEventAttendee/addEventAttendeeText.handlebars b/views/emails/addEventAttendee/addEventAttendeeText.handlebars new file mode 100644 index 0000000..2e0eca7 --- /dev/null +++ b/views/emails/addEventAttendee/addEventAttendeeText.handlebars @@ -0,0 +1,11 @@ +You just marked yourself as attending an event on {{siteName}}. Thank you! We'll send you another email if there are any updates to the event. Your email will be automatically removed from the database once the event finishes. + +Follow this link to open the event page any time: https://{{domain}}/{{eventID}} + +Need to remove yourself from this event? Head to the event page and use this deletion password: {{removalPassword}} + +Love, + +{{siteName}} + +If you didn't mark yourself as attending an event on {{siteName}}, someone may have accidentally typed your email instead of theirs. If you don't want to attend this event, use the deletion password above to remove yourself from the event page. diff --git a/views/emails/addeventcomment.handlebars b/views/emails/addEventComment/addEventCommentHtml.handlebars index 8ab7ec1..8ab7ec1 100644 --- a/views/emails/addeventcomment.handlebars +++ b/views/emails/addEventComment/addEventCommentHtml.handlebars diff --git a/views/emails/addEventComment/addEventCommentText.handlebars b/views/emails/addEventComment/addEventCommentText.handlebars new file mode 100644 index 0000000..d7c045e --- /dev/null +++ b/views/emails/addEventComment/addEventCommentText.handlebars @@ -0,0 +1,9 @@ +{{commentAuthor}} has just posted a comment on an event you're attending on {{siteName}}. + +Click here to see the comment: https://{{domain}}/{{eventID}} + +Love, + +{{siteName}} + +If you didn't mark yourself as attending an event on {{siteName}}, someone may have accidentally typed your email instead of theirs. Don't worry - there isn't anything you need to do. Your email will be removed from the system when the event finishes. diff --git a/views/emails/createevent.handlebars b/views/emails/createEvent/createEventHtml.handlebars index 030ee58..030ee58 100644 --- a/views/emails/createevent.handlebars +++ b/views/emails/createEvent/createEventHtml.handlebars diff --git a/views/emails/createEvent/createEventText.handlebars b/views/emails/createEvent/createEventText.handlebars new file mode 100644 index 0000000..e3c3a91 --- /dev/null +++ b/views/emails/createEvent/createEventText.handlebars @@ -0,0 +1,7 @@ +Your event has been created! + +Use this link to share it with people: https://{{domain}}/{{eventID}} + +Use the following link to edit your event. DO NOT SHARE THIS, as anyone with this link can edit your event. + +https://{{domain}}/{{eventID}}?e={{editToken}} diff --git a/views/emails/createeventgroup.handlebars b/views/emails/createEventGroup/createEventGroupHtml.handlebars index 3f03345..0a12e91 100644 --- a/views/emails/createeventgroup.handlebars +++ b/views/emails/createEventGroup/createEventGroupHtml.handlebars @@ -1,6 +1,6 @@ <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;">You just created a new event group on {{siteName}}! Thanks a bunch - we're delighted to have you.</p> <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;">You can edit your event group by clicking the button below, or just following this link: <a href="https://{{domain}}/group/{{eventGroupID}}?e={{editToken}}">https://{{domain}}/{{eventGroupID}}?e={{editToken}}</a></p> -<p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;">To add events to this group (whether brand new events or ones you've already made), click the 'This event is part of an event group' checkbox. You will need to copy the following two codes into the dark grey box which opens:</p> +<p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;">To add events to this group (whether brand new events or ones you've already made), click the 'This event is part of an event group' checkbox. You will need to copy the following two codes into the box which opens:</p> <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;"><strong>Event group ID</strong>: {{eventGroupID}}</p> <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;"><strong>Event group secret editing code</strong>: {{editToken}}</p> <table border="0" cellpadding="0" cellspacing="0" class="btn btn-primary" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; width: 100%; box-sizing: border-box;"> @@ -24,4 +24,4 @@ <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;">{{siteName}}</p> <hr/> <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;"><strong>Hold up - I have no idea what this email is about!</strong></p> -<p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;">If you didn't make an event group on {{siteName}}, someone may have accidentally typed your email instead of theirs when they were making an event. Don't worry - there isn't anything you need to do. Your email will be removed from the system when the event finishes, and if you're still worried, just click on the edit link above and delete that event group, which removes your email from the system as well.</p> +<p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0; Margin-bottom: 15px;">If you didn't make an event group on {{siteName}}, someone may have accidentally typed your email instead of theirs when they were making the group. Just click on the edit link above and delete that event group, which removes your email from the system as well.</p> diff --git a/views/emails/createEventGroup/createEventGroupText.handlebars b/views/emails/createEventGroup/createEventGroupText.handlebars new file mode 100644 index 0000000..34ad618 --- /dev/null +++ b/views/emails/createEventGroup/createEventGroupText.handlebars @@ -0,0 +1,21 @@ +You just created a new event group on {{siteName}}! Thanks a bunch - we're delighted to have you. + +You can edit your event group by clicking the button below, or just following this link: https://{{domain}}/{{eventGroupID}}?e={{editToken}} + +To add events to this group (whether brand new events or ones you've already made), click the 'This event is part of an event group' checkbox. You will need to copy the following two codes into the box which opens: + +Event group ID: {{eventGroupID}} + +Event group secret editing code: {{editToken}} + +Edit the event group here: https://{{domain}}/group/{{eventGroupID}}?e={{editToken}} + +To let others know about your event group, send them this link: https://{{domain}}/{{eventGroupID}} + +And that's it - have a great day! + +Love, + +{{siteName}} + +If you didn't make an event group on {{siteName}}, someone may have accidentally typed your email instead of theirs when they were making the group. Just click on the edit link above and delete that event group, which removes your email from the system as well. diff --git a/views/emails/deleteevent.handlebars b/views/emails/deleteEvent/deleteEventHtml.handlebars index 5a3670c..5a3670c 100644 --- a/views/emails/deleteevent.handlebars +++ b/views/emails/deleteEvent/deleteEventHtml.handlebars diff --git a/views/emails/deleteEvent/deleteEventText.handlebars b/views/emails/deleteEvent/deleteEventText.handlebars new file mode 100644 index 0000000..77c1cc3 --- /dev/null +++ b/views/emails/deleteEvent/deleteEventText.handlebars @@ -0,0 +1,3 @@ +The {{eventName}} event you're attending on {{siteName}} was just deleted by its creator. + +If you didn't mark yourself as attending an event on {{siteName}}, someone may have accidentally typed your email instead of theirs. Don't worry - that event, and your email, is deleted from the system now. diff --git a/views/emails/editevent.handlebars b/views/emails/editEvent/editEventHtml.handlebars index ddb9885..ddb9885 100644 --- a/views/emails/editevent.handlebars +++ b/views/emails/editEvent/editEventHtml.handlebars diff --git a/views/emails/editEvent/editEventText.handlebars b/views/emails/editEvent/editEventText.handlebars new file mode 100644 index 0000000..cdcffd3 --- /dev/null +++ b/views/emails/editEvent/editEventText.handlebars @@ -0,0 +1,11 @@ +An event you're attending on {{siteName}} has just been edited. + +{{{diffText}}} + +Click here to see the event: https://{{domain}}/{{eventID}} + +Love, + +{{siteName}} + +If you didn't mark yourself as attending an event on {{siteName}}, someone may have accidentally typed your email instead of theirs. Don't worry - there isn't anything you need to do. Your email will be removed from the system when the event finishes. diff --git a/views/emails/eventgroupupdated.handlebars b/views/emails/eventGroupUpdated/eventGroupUpdatedHtml.handlebars index 3231327..3231327 100644 --- a/views/emails/eventgroupupdated.handlebars +++ b/views/emails/eventGroupUpdated/eventGroupUpdatedHtml.handlebars diff --git a/views/emails/eventGroupUpdated/eventGroupUpdatedText.handlebars b/views/emails/eventGroupUpdated/eventGroupUpdatedText.handlebars new file mode 100644 index 0000000..3ed5cb2 --- /dev/null +++ b/views/emails/eventGroupUpdated/eventGroupUpdatedText.handlebars @@ -0,0 +1,11 @@ +A new event has been added to the event group '{{eventGroupName}}' on {{siteName}}. + +The event is '{{eventName}}': https://{{domain}}/{{eventID}}. + +Click here to see the event group: https://{{domain}}/group/{{eventGroupID}} + +Love, + +{{siteName}} + +If you didn't subscribe yourself to this event group on {{siteName}}, someone may have accidentally typed your email instead of theirs. Click here to unsubscribe: https://{{domain}}/unsubscribe/{{eventGroupID}}?email={{emailAddress}}. diff --git a/views/emails/removeeventattendee.handlebars b/views/emails/removeEventAttendee/removeEventAttendeeHtml.handlebars index 66ca858..66ca858 100644 --- a/views/emails/removeeventattendee.handlebars +++ b/views/emails/removeEventAttendee/removeEventAttendeeHtml.handlebars diff --git a/views/emails/removeEventAttendee/removeEventAttendeeText.handlebars b/views/emails/removeEventAttendee/removeEventAttendeeText.handlebars new file mode 100644 index 0000000..0a94121 --- /dev/null +++ b/views/emails/removeEventAttendee/removeEventAttendeeText.handlebars @@ -0,0 +1,3 @@ +You have been removed from the event {{eventName}} on {{siteName}} by the organizer of the event. + +If you didn't mark yourself as attending an event on {{siteName}}, someone may have accidentally typed your email instead of theirs. Don't worry - you won't receive any more of these emails for this event, and your email has been removed from the database. diff --git a/views/emails/subscribed.handlebars b/views/emails/subscribed/subscribedHtml.handlebars index 3a3c4ad..3a3c4ad 100644 --- a/views/emails/subscribed.handlebars +++ b/views/emails/subscribed/subscribedHtml.handlebars diff --git a/views/emails/subscribed/subscribedText.handlebars b/views/emails/subscribed/subscribedText.handlebars new file mode 100644 index 0000000..68418bc --- /dev/null +++ b/views/emails/subscribed/subscribedText.handlebars @@ -0,0 +1,9 @@ +You have been subscribed to the event group '{{eventGroupName}}' on {{siteName}}. + +You will receive emails when new events are added to the group, and can unsubscribe at any time. + +Love, + +{{siteName}} + +If you didn't subscribe yourself to this event group on {{siteName}}, someone may have accidentally typed your email instead of theirs. Click here to unsubscribe: https://{{domain}}/unsubscribe/{{eventGroupID}}?email={{emailAddress}}. diff --git a/views/emails/unattendevent.handlebars b/views/emails/unattendEvent/unattendEventHtml.handlebars index 62dac8a..62dac8a 100644 --- a/views/emails/unattendevent.handlebars +++ b/views/emails/unattendEvent/unattendEventHtml.handlebars diff --git a/views/emails/unattendEvent/unattendEventText.handlebars b/views/emails/unattendEvent/unattendEventText.handlebars new file mode 100644 index 0000000..dbe83b4 --- /dev/null +++ b/views/emails/unattendEvent/unattendEventText.handlebars @@ -0,0 +1,11 @@ +You just removed yourself from an event on {{siteName}}. You will no longer receive update emails for this event. + +If you didn't mean to do this, someone else who knows your email removed you from the event. + +Follow this link to open the event page any time: https://{{domain}}/{{eventID}} + +Love, + +{{siteName}} + +If you didn't mark yourself as attending an event on {{siteName}}, someone may have accidentally typed your email instead of theirs, then removed it. Don't worry - you won't receive any more emails linked to this event. diff --git a/views/event.handlebars b/views/event.handlebars index 1576647..ae6674a 100755 --- a/views/event.handlebars +++ b/views/event.handlebars @@ -136,7 +136,7 @@ {{#unless noMoreSpots}} <button type="button" id="attendEvent" class="btn btn-success" data-event-id="{{eventData.id}}"><i class="fas fa-user-plus"></i> Add me</button> {{/unless}} - <button type="button" id="unattendEvent" class="btn btn-seco.split("?")[0];dary" data-toggle="modal" data-target="#unattendModal"><i class="fas fa-user-times"></i> Remove me</button> + <button type="button" id="unattendEvent" class="btn btn-secondary" data-toggle="modal" data-target="#unattendModal"><i class="fas fa-user-times"></i> Remove me</button> </div> </h5> <div class="card-body"> @@ -397,18 +397,12 @@ {{/if}} <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> -{{#unless eventHasConcluded}} -{{#if editingEnabled}} -<script type="text/javascript" src="/js/generate-timezones.js"></script> -{{/if}} -{{/unless}} + +<script> +window.eventData = {{{ json jsonData }}}; +</script> + <script> - $.validate({ - lang: 'en', - errorElementClass: "is-invalid", - errorMessageClass: "text-danger", - successElementClass: "is-valid" - }); {{#if editingEnabled}} $('#removeAttendeeModal').on('show.bs.modal', function (event) { @@ -419,24 +413,6 @@ modal.find('.modal-title').text('Remove ' + attendeeName + ' from {{eventData.name}}') modal.find('#removeAttendeeForm').attr('action', '/removeattendee/{{eventData.id}}/' + attendeeID); }) - {{#unless eventHasConcluded}} - $('#eventStart').datepicker({ - language: 'en', - timepicker: true, - dateFormat: 'd MM yyyy', - dateTimeSeparator: ', ', - onSelect: function(formattedDate, rawDate){ - $('#eventEnd').datepicker().data('datepicker').update('minDate', rawDate).clear(); - } - }); - $('#eventEnd').datepicker({ - language: 'en', - timepicker: true, - dateFormat: 'd MM yyyy', - dateTimeSeparator: ', ' - }); - $("#timezone").val('{{eventData.timezone}}').trigger('change'); - {{/unless}} {{/if}} $(".commentTimestamp").html(function(){ parsedDate = moment($(this).html()).fromNow(); @@ -512,26 +488,10 @@ document.body.removeChild(a); } - $.uploadPreview({ - input_field: "#image-upload", - preview_box: "#image-preview", - label_field: "#image-label", - label_default: "Choose file", - label_selected: "Change file", - no_label: false - }); - $("#image-preview").css("background-image", "url('/events/{{eventData.image}}')"); - $("#image-preview").css("background-size", "cover"); - $("#image-preview").css("background-position", "center center"); - {{#if editingEnabled}} - $('#eventStart').datepicker().data('datepicker').selectDate(moment('{{parsedStart}}', 'YYYYMMDD[T]HHmmss').toDate()); - $('#eventEnd').datepicker().data('datepicker').selectDate(moment('{{parsedEnd}}', 'YYYYMMDD[T]HHmmss').toDate()); - {{/if}} new ClipboardJS('#copyEventLink'); - autosize($('textarea')); $("#exportICS").click(function(){ let eventID = $(this).attr('data-event-id'); - $.get('/exportevent/' + eventID, function(response) { + $.get('/export/event/' + eventID, function(response) { downloadFile(response, eventID + '.ics'); }) }) @@ -548,39 +508,6 @@ if ($("#joinCheckbox").is(':checked')){ $("#maxAttendeesCheckboxContainer").css("display","flex"); } - $("#maxAttendeesCheckbox").on("click", function() { - if ($(this).is(':checked')) { - $("#maxAttendeesContainer").slideDown('fast').css("display","flex"); - $("#maxAttendees").attr("data-validation-optional","false"); - } - else { - $("#maxAttendeesContainer").slideUp('fast'); - $("#maxAttendees").attr("data-validation-optional","true").val("").removeClass('is-valid is-invalid'); - } - }); - $("#joinCheckbox").on("click", function() { - if ($(this).is(':checked')) { - $("#maxAttendeesCheckboxContainer").slideDown('fast').css("display","flex"); - } - else { - $("#maxAttendeesCheckboxContainer").slideUp('fast'); - $("#maxAttendeesCheckbox").prop("checked",false); - $("#maxAttendeesContainer").slideUp('fast'); - $("#maxAttendees").attr("data-validation-optional","true").val("").removeClass('is-valid is-invalid'); - } - }); - $("#eventGroupCheckbox").on("click", function() { - if ($(this).is(':checked')) { - $("#eventGroupData").slideDown('fast'); - $("#eventGroupID").removeAttr("data-validation-optional").attr("data-validation","required"); - $("#eventGroupEditToken").removeAttr("data-validation-optional").attr("data-validation","required"); - } - else { - $("#eventGroupData").slideUp('fast'); - $("#eventGroupID").removeAttr("data-validation").attr("data-validation-optional","true").val(""); - $("#eventGroupEditToken").removeAttr("data-validation").attr("data-validation-optional","true").val(""); - } - }); $('#attendEvent').on('click', function(event) { const modal = $('#attendModal'); const eventID = $(this).attr('data-event-id'); diff --git a/views/eventgroup.handlebars b/views/eventgroup.handlebars index 9afee2c..0643ed6 100755 --- a/views/eventgroup.handlebars +++ b/views/eventgroup.handlebars @@ -5,7 +5,7 @@ {{/if}} <div class="row"> <div class="col-lg"> - <h3 id="eventName" data-event-id="{{eventGroupData.id}}">{{eventGroupData.name}}</h3> + <h3 id="eventGroupName" data-event-id="{{eventGroupData.id}}">{{eventGroupData.name}}</h3> </div> <div class="col-lg-2 ml-2 edit-buttons"> {{#if editingEnabled}} @@ -16,7 +16,7 @@ </div> </div> {{#if firstLoad}} -<div class="alert alert-success alert-dismissible fade show" role="alert"> +<div class="alert alert-success alert-dismissible fade show mt-4" role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">×</span> </button> @@ -30,7 +30,7 @@ <div class="card-body"> <ul class="fa-ul eventInformation"> {{#if eventGroupHasHost}} - <li> + <li id="hostName"> <span class="fa-li"> <i class="fas fa-fw fa-user-circle"></i> </span> @@ -38,7 +38,7 @@ </li> {{/if}} {{#if eventGroupData.url}} - <li> + <li id="eventGroupURL"> <span class="fa-li"> <i class="fas fa-link"></i> </span> @@ -91,17 +91,17 @@ </div> {{#if editingEnabled}} - <div class="alert alert-success"> + <div class="alert alert-info"> <p>To add an event to this group, copy and paste the two codes below into the 'Event Group' box when creating a new event or editing an existing event.</p> <div class="table-responsive"> <table style="width:100%"> <tr style="border-bottom:1px solid rgba(0,0,0,0.2)"> <td><strong>Event group ID</strong></td> - <td><span class="code">{{eventGroupData.id}}</span></td> + <td><span class="code" id="eventGroupID">{{eventGroupData.id}}</span></td> </tr> <tr> <td><strong>Event group editing password</strong></td> - <td><span class="code">{{eventGroupData.editToken}}</span></td> + <td><span class="code" id="eventGroupEditToken">{{eventGroupData.editToken}}</span></td> </tr> </table> </div> @@ -222,15 +222,11 @@ </div> </div> - <script> - $.validate({ - lang: 'en', - errorElementClass: "is-invalid", - errorMessageClass: "text-danger", - successElementClass: "is-valid" - }); +window.groupData = {{{ json jsonData }}}; +</script> +<script> $(document).ready(function() { // Save the editing token from the URL, if it is valid const eventID = $('#eventName').attr('data-event-id'); @@ -273,23 +269,12 @@ $('#editModal').modal('show'); } - $.uploadPreview({ - input_field: "#eventGroupImageUpload", - preview_box: "#eventGroupImagePreview", - label_field: "#eventGroupImageLabel", - label_default: "Choose file", - label_selected: "Change file", - no_label: false - }); - $("#eventGroupImagePreview").css("background-image", "url('/events/{{eventGroupData.image}}')"); - $("#eventGroupImagePreview").css("background-size", "cover"); - $("#eventGroupImagePreview").css("background-position", "center center"); new ClipboardJS('#copyEventLink'); new ClipboardJS('#copyFeedLink'); autosize($('textarea')); $("#exportICS").click(function(){ let eventGroupID = $(this).attr('data-event-id'); - $.get('/exportgroup/' + eventGroupID, function(response) { + $.get('/export/group/' + eventGroupID, function(response) { downloadFile(response, eventGroupID + '.ics'); }) }) diff --git a/views/layouts/main.handlebars b/views/layouts/main.handlebars index ee6817b..daa5a37 100755 --- a/views/layouts/main.handlebars +++ b/views/layouts/main.handlebars @@ -53,6 +53,8 @@ <script src="/js/moment-timezone.js"></script> <script src="/js/util.js"></script> + <script src="//unpkg.com/alpinejs" defer></script> + </head> <body> diff --git a/views/newevent.handlebars b/views/newevent.handlebars index 5e7752f..349c355 100755 --- a/views/newevent.handlebars +++ b/views/newevent.handlebars @@ -1,30 +1,36 @@ -<h2>New event</h2> -<hr> -<div class="alert alert-info mb-4 text-center" role="alert"> - <i class="fas fa-exclamation-circle"></i> Events are visible to anyone who knows the link. -</div> - - -{{#each errors}} - <div class="alert alert-danger" role="alert">{{this.msg}}</div> -{{/each}} - <div class="container mb-4"> <div class="row"> <div class="col-sm-4 p-2"> - <button type="button" id="showNewEventFormButton" class="btn btn-secondary w-100"><i class="fas fa-file"></i> Create a new event</button> + <button type="button" id="showNewEventFormButton" class="btn btn-secondary w-100"><i class="fas fa-calendar-day"></i> Create a new event</button> </div> <div class="col-sm-4 p-2"> <button type="button" id="showImportEventFormButton" class="btn btn-secondary w-100"><i class="fas fa-file-import"></i> Import an existing event</button> </div> <div class="col-sm-4 p-2"> - <button type="button" id="showNewEventGroupFormButton" class="btn btn-secondary w-100"><i class="fas fa-folder-open"></i> Create a new event group </button> + <button type="button" id="showNewEventGroupFormButton" class="btn btn-secondary w-100"><i class="fas fa-calendar-alt"></i> Create a new event group </button> </div> </div> </div> +<div class="alert alert-info mb-4 text-center" role="alert"> + <i class="fas fa-exclamation-circle"></i> Events are visible to anyone who knows the link. +</div> + <div id="newEventFormContainer"> - {{>neweventform}} + <h4 class="mb-2">Create an event</h4> + <form id="newEventForm" enctype="multipart/form-data" x-data="newEventForm()" x-init="init()" @submit.prevent="submitForm"> + {{>eventForm}} + <div class="form-group row"> + <div class="col-sm-12 pt-3 pb-3 text-center"> + <button + id="newEventFormSubmit" + type="submit" + class="btn btn-primary w-50" + x-bind:disabled="submitting" + >Create</button> + </div> + </div> + </form> </div> <div id="importEventFormContainer"> @@ -32,80 +38,18 @@ </div> <div id="newEventGroupFormContainer"> - {{>neweventgroupform}} + <h4 class="mb-2">Create an event group</h4> + <p class="text-muted">An event group is a holding area for a set of linked events, like a recurring game night, a festival, or a band tour. You can share a public link to your event group just like an individual event link, and people who know the secret editing code will be able to add future events to the group.</p> + <p class="text-muted">Event groups do not get automatically removed like events do, but events which have been removed from {{siteName}} will of course not show up in an event group.</p> + <form id="newEventGroupForm" enctype="multipart/form-data" x-data="newEventGroupForm()" @submit.prevent="submitForm"> + {{> eventGroupForm }} + <div class="form-group row"> + <div class="col-sm-12 pt-3 pb-3 text-center"> + <button type="submit" class="btn btn-primary w-50" x-bind:disabled="submitting">Create</button> + </div> + </div> + </form> </div> - <script> - $.validate({ - lang: 'en', - errorElementClass: "is-invalid", - errorMessageClass: "text-danger", - successElementClass: "is-valid" - }); - $(document).ready(function(){ - if ($('#icsImportControl')[0].files[0] != null){ - var file = $('#icsImportControl')[0].files[0].name; - $('#icsImportControl').next('label').html('<i class="far fa-file-alt"></i> ' + file); - } - $('#eventStart').datepicker({ - language: 'en', - minDate: new Date(), - timepicker: true, - dateFormat: 'd MM yyyy', - dateTimeSeparator: ', ', - onSelect: function(formattedDate, rawDate){ - $('#eventEnd').datepicker().data('datepicker').update('minDate', rawDate).clear(); - } - }); - $('#eventEnd').datepicker({ - language: 'en', - minDate: new Date(), - timepicker: true, - dateFormat: 'd MM yyyy', - dateTimeSeparator: ', ' - }); - $("#showNewEventFormButton").click(function(){ - $("button").removeClass("active"); - $("#showImportEventFormButton #showNewEventGroupFormButton").removeClass("active"); - if ($("#newEventFormContainer").is(":visible")){ - $("#newEventFormContainer").slideUp("fast"); - } - else { - $("#newEventFormContainer").slideDown("fast"); - $("#importEventFormContainer").slideUp("fast"); - $("#newEventGroupFormContainer").slideUp("fast"); - $(this).addClass("active"); - } - }) - $("#showImportEventFormButton").click(function(){ - $("button").removeClass("active"); - $("#showNewEventFormButton #showNewEventGroupFormButton").removeClass("active"); - if ($("#importEventFormContainer").is(":visible")){ - $("#importEventFormContainer").slideUp("fast"); - } - else { - $("#importEventFormContainer").slideDown("fast"); - $("#newEventFormContainer").slideUp("fast"); - $("#newEventGroupFormContainer").slideUp("fast"); - $(this).addClass("active"); - } - }) - $("#showNewEventGroupFormButton").click(function(){ - $("button").removeClass("active"); - $("#showNewEventFormButton #showImportEventFormButton").removeClass("active"); - if ($("#newEventGroupFormContainer").is(":visible")){ - $("#newEventGroupFormContainer").slideUp("fast"); - } - else { - $("#newEventGroupFormContainer").slideDown("fast"); - $("#newEventFormContainer").slideUp("fast"); - $("#importEventFormContainer").slideUp("fast"); - $(this).addClass("active"); - } - }) - $('#icsImportControl').change(function(){ - var file = $('#icsImportControl')[0].files[0].name; - $(this).next('label').html('<i class="far fa-file-alt"></i> ' + file); - }); - }) - </script> +<script src="/js/generate-timezones.js"></script> +<script src="/js/modules/new.js"></script>
\ No newline at end of file diff --git a/views/partials/editeventgroupmodal.handlebars b/views/partials/editeventgroupmodal.handlebars index 3b8f55a..2506e26 100644 --- a/views/partials/editeventgroupmodal.handlebars +++ b/views/partials/editeventgroupmodal.handlebars @@ -8,32 +8,10 @@ </button> </div> <div class="modal-body"> - <form id="editEventForm" action="/editeventgroup/{{eventGroupData.id}}/{{eventGroupData.editToken}}" method="post" enctype="multipart/form-data" autocomplete="off"> - <div class="form-group"> - <label for="eventGroupName" >Name</label> - <input type="text" class="form-control" id="eventGroupName" name="eventGroupName" placeholder="Make it snappy." value="{{eventGroupData.name}}" data-validation="required length" data-validation-length="3-120"> - </div> - <div class="form-group"> - <label for="eventGroupDescription" >Description</label> - <textarea class="form-control" id="eventGroupDescription" name="eventGroupDescription" data-validation="required">{{eventGroupData.description}}</textarea> - <small class="form-text"><a href="https://commonmark.org/help/">Markdown</a> formatting supported.</small> - </div> - <div class="form-group"> - <label for="eventGroupURL" >Link</label> - <input type="url" class="form-control" id="eventURL" name="eventGroupURL" value="{{eventGroupData.url}}" placeholder="For tickets or a page with more information (optional)." data-validation="url" data-validation-optional="true"> - </div> - <div class="form-group"> - <label for="hostName" >Host or organisation name</label> - <input type="text" class="form-control" id="hostName" name="hostName" placeholder="Will be shown on the event group page (optional)." value="{{eventGroupData.hostName}}" data-validation="length" data-validation-length="3-120" data-validation-optional="true"> - </div> - <div class="form-group"> - <label>Cover image</label> - <div class="image-preview" id="eventGroupImagePreview"> - <label for="eventGroupImageUpload" id="eventGroupImageLabel">Choose file</label> - <input type="file" name="eventGroupImageUpload" id="eventGroupImageUpload" /> - </div> - <small class="form-text">Recommended dimensions (w x h): 920px by 300px.</small> - </div> + <form id="editEventForm" enctype="multipart/form-data" x-data="editEventGroupForm()" @submit.prevent="submitForm"> + + {{> eventGroupForm }} + <div class="form-group"> <div class="card border-danger mb-3"> <div class="card-header text-danger">Delete this event group</div> @@ -51,3 +29,5 @@ </div> </div> </div> + +<script type="text/javascript" src="/js/modules/group-edit.js"></script>
\ No newline at end of file diff --git a/views/partials/editeventmodal.handlebars b/views/partials/editeventmodal.handlebars index b4b0ea6..a36cd98 100644 --- a/views/partials/editeventmodal.handlebars +++ b/views/partials/editeventmodal.handlebars @@ -8,140 +8,21 @@ </button> </div> <div class="modal-body"> - <form id="editEventForm" action="/editevent/{{eventData.id}}/{{eventData.editToken}}" method="post" - enctype="multipart/form-data" autocomplete="off"> - <div class="form-group"> - <label for="eventName" class="col-form-label">Event name</label> - <input type="text" class="form-control" id="eventName" name="eventName" - placeholder="Make it snappy." value="{{eventData.name}}" data-validation="required length" - data-validation-length="3-120"> - </div> - <div class="form-group"> - <label for="eventLocation" class="col-form-label">Location</label> - <input type="text" class="form-control" id="eventLocation" name="eventLocation" - placeholder="Be specific." value="{{eventData.location}}" data-validation="required length" - data-validation-length="3-120"> - </div> - <div class="form-group"> - <label for="eventStart" class="col-form-label">Starts</label> - <input readonly type="text" class="form-control" id="eventStart" name="eventStart" value="" - data-validation="required"> - </div> - <div class="form-group"> - <label for="eventEnd" class="col-form-label">Ends</label> - <input readonly type="text" class="form-control" id="eventEnd" name="eventEnd" value="" - data-validation="required"> - </div> - <div class="form-group"> - <label for="timezone" class="col-form-label">Timezone</label> - <select class="select2" id="timezone" name="timezone"></select> - </div> - <div class="form-group"> - <label for="eventDescription" class="col-form-label">Description</label> - <textarea class="form-control" id="eventDescription" name="eventDescription" - data-validation="required">{{eventData.description}}</textarea> - <small class="form-text"><a href="https://commonmark.org/help/">Markdown</a> formatting - supported.</small> - </div> - <div class="form-group"> - <label for="eventURL" class="col-form-label">Link</label> - <input type="url" class="form-control" id="eventURL" name="eventURL" value="{{eventData.url}}" - placeholder="For tickets or another event page (optional)." data-validation="url" - data-validation-optional="true"> - </div> - <div class="form-group"> - <label for="hostName" class="col-form-label">Host name</label> - <input type="text" class="form-control" id="hostName" name="hostName" - placeholder="Will be shown on the event page (optional)." value="{{eventData.hostName}}" - data-validation="length" data-validation-length="3-120" data-validation-optional="true"> - </div> - <div class="form-group"> - <label for="eventImage" class="col-form-label">Cover image</label> - <div class="image-preview" id="image-preview"> - <label for="image-upload" id="image-label">Choose file</label> - <input type="file" name="imageUpload" id="image-upload" /> - </div> - <small class="form-text">Recommended dimensions (w x h): 920px by 300px.</small> - {{#if eventData.image}} - <button type="button" class="btn btn-danger" id="deleteImage">Delete image</button> - {{/if}} - </div> - <div class="form-group"> - <div class="mb-2">Options</div> - <div class="form-check"> - <input class="form-check-input" type="checkbox" id="eventGroupCheckbox" - name="eventGroupCheckbox" {{#if eventData.eventGroup}}checked{{/if}}> - <label class="form-check-label" for="eventGroupCheckbox"> - This event is part of an event group - </label> - </div> - <div class="card text-white bg-secondary my-2" id="eventGroupData" {{#if eventData.eventGroup}}style="display:flex" {{/if}}> - <div class="card-header"> - <strong>Link this event to an event group</strong> - </div> - <div class="card-body"> - <div class="form-group"> - <label for="eventGroupID" class="form-label">Event group ID</label> - <div class="form-group"> - <input type="text" class="form-control" id="eventGroupID" name="eventGroupID" - placeholder="" data-validation-optional="true" value="{{eventData.eventGroup.id}}"> - <small class="form-text">You can find this short string of characters in the - event group's link, in your confirmation email, or on the event group's - page.</small> - </div> - </div> - <div class="form-group"> - <label for="eventGroupEditToken" class="form-label">Event group secret - editing code</label> - <div class="form-group"> - <input type="text" class="form-control" id="eventGroupEditToken" - name="eventGroupEditToken" placeholder="" data-validation-optional="true" value="{{eventData.eventGroup.editToken}}"> - <small class="form-text">You can find this long string of characters in the - confirmation email you received when you created the event group.</small> - </div> - </div> - </div> - </div> - <div class="form-check"> - <input class="form-check-input" type="checkbox" id="interactionCheckbox" - name="interactionCheckbox" {{#if eventData.usersCanComment}}checked{{/if}}> - <label class="form-check-label" for="interactionCheckbox"> - Users can post comments on this event - </label> - </div> - <div class="form-check"> - <input class="form-check-input {{#unless eventData.usersCanAttend}}unchecked{{/unless}}" - type="checkbox" id="joinCheckbox" name="joinCheckbox" - {{#if eventData.usersCanAttend}}checked{{/if}}> - <label class="form-check-label" for="joinCheckbox"> - Users can mark themselves as attending this event - </label> - </div> - <div class="form-check" id="maxAttendeesCheckboxContainer" - {{#if eventData.maxAttendees}}style="display:flex" {{/if}}> - <input class="form-check-input" type="checkbox" id="maxAttendeesCheckbox" - name="maxAttendeesCheckbox" {{#if eventData.maxAttendees}}checked{{/if}}> - <label class="form-check-label" for="maxAttendeesCheckbox"> - Set a limit on the maximum number of attendees - </label> - </div> - </div> - <div class="form-group" id="maxAttendeesContainer" - {{#if eventData.maxAttendees}}style="display:flex" {{/if}}> - <label for="maxAttendees" class="col-form-label">Attendee limit</label> - <input type="number" class="form-control" id="maxAttendees" name="maxAttendees" - placeholder="Enter a number." data-validation="number" data-validation-optional="true" - value="{{eventData.maxAttendees}}"> - </div> + <form id="editEventForm" enctype="multipart/form-data" x-data="editEventForm()" x-init="init()" + @submit.prevent="submitForm"> - <div class="form-group"> - <div class="card border-danger mb-3"> - <div class="card-header text-danger">Delete this event</div> - <div class="card-body text-danger"> - <button type="button" id="deleteEvent" class="btn btn-danger" data-toggle="modal" data-target="#deleteModal" data-event-id="{{eventData.id}}"><i class="fas fa-trash"></i> Delete</button> + {{> eventForm }} + + <div class="form-group"> + <div class="card border-danger mb-3"> + <div class="card-header text-danger">Delete this event</div> + <div class="card-body text-danger"> + <button type="button" id="deleteEvent" class="btn btn-danger" data-toggle="modal" + data-target="#deleteModal" data-event-id="{{eventData.id}}"><i class="fas fa-trash"></i> + Delete</button> + </div> </div> </div> - </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> @@ -153,13 +34,16 @@ </div> <script> -$('#deleteImage').click(function() { - $.post('/deleteimage/{{eventData.id}}/{{eventData.editToken}}', function(response) { - if (response === "Success") { - location.reload(); - } else { - alert(response); - } - }); -}) + $('#deleteImage').click(function () { + $.post('/deleteimage/{{eventData.id}}/{{eventData.editToken}}', function (response) { + if (response === "Success") { + location.reload(); + } else { + alert(response); + } + }); + }) </script> + +<script type="text/javascript" src="/js/generate-timezones.js"></script> +<script type="text/javascript" src="/js/modules/event-edit.js"></script> diff --git a/views/partials/eventForm.handlebars b/views/partials/eventForm.handlebars new file mode 100755 index 0000000..93d679d --- /dev/null +++ b/views/partials/eventForm.handlebars @@ -0,0 +1,141 @@ +<div class="form-group"> + <label for="eventName" >Event name</label> + <div class="form-group "> + <input type="text" class="form-control" id="eventName" name="eventName" placeholder="Make it snappy." x-model="data.eventName" > + </div> +</div> +<div class="form-group"> + <label for="eventLocation" >Location</label> + <div class="form-group "> + <input type="text" class="form-control" id="eventLocation" name="eventLocation" placeholder="Be specific." x-model="data.eventLocation"> + </div> +</div> +<div class="form-group"> + <label for="eventStart" >Starts</label> + <div class="form-group"> + <input type="datetime-local" class="form-control" id="eventStart" name="eventStart" x-model="data.eventStart"> + </div> +</div> +<div class="form-group"> + <label for="eventEnd" >Ends</label> + <div class="form-group "> + <input type="datetime-local" class="form-control" id="eventEnd" name="eventEnd" x-model="data.eventEnd"> + </div> +</div> +<div class="form-group"> + <label for="timezone" >Timezone</label> + <div class="form-group "> + <select class="select2" id="timezone" name="timezone" x-ref="timezone"></select> + </div> +</div> +<div class="form-group"> + <label for="eventDescription" >Description</label> + <div class="form-group "> + <textarea class="form-control expand" id="eventDescription" name="eventDescription" placeholder="You can always edit it later." x-model="data.eventDescription" ></textarea> + <small class="form-text"><a href="https://commonmark.org/help/">Markdown</a> formatting supported.</small> + </div> +</div> +<div class="form-group"> + <label for="eventURL" >Link</label> + <div class="form-group "> + <input type="url" class="form-control" id="eventURL" name="eventURL" placeholder="For tickets or another event page (optional)." x-model="data.eventURL" > + </div> +</div> +<div class="form-group"> + <label for="eventImage" >Cover image</label> + <div class="form-group "> + <div class="image-preview" id="event-image-preview"> + <label for="image-upload" id="event-image-label">Choose file</label> + <input type="file" name="imageUpload" id="event-image-upload" accept="image/jpeg,image/gif,image/png" x-ref="eventImageUpload" /> + </div> + <small class="form-text">Recommended dimensions (w x h): 920px by 300px.</small> + {{#if eventData.image}} + <button type="button" class="btn btn-danger" id="deleteImage">Delete image</button> + {{/if}} + </div> +</div> +<div class="form-group"> + <label for="hostName" >Host name</label> + <div class="form-group "> + <input type="text" class="form-control" id="hostName" name="hostName" placeholder="Will be shown on the event page (optional)." x-model="data.hostName" > + </div> +</div> +<div class="form-group"> + <label for="creatorEmail" >Your email</label> + <div class="form-group "> + <input type="email" class="form-control" id="creatorEmail" name="creatorEmail" placeholder="Will not be shown anywhere (optional)." x-model="data.creatorEmail" > + <small class="form-text">If you provide your email, we will send your secret editing password here, and use it to notify you of updates to the event.</small> + </div> +</div> +<div class="form-group"> + <label>Options</label> + <div > + <div class="form-check"> + <input class="form-check-input" type="checkbox" id="eventGroupCheckbox" name="eventGroupCheckbox" x-model="data.eventGroupCheckbox"> + <label class="form-check-label" for="eventGroupCheckbox"> + This event is part of an event group + </label> + </div> + <div class="card my-2" id="eventGroupData" x-show="data.eventGroupCheckbox"> + <div class="card-header"> + <strong>Link this event to an event group</strong> + </div> + <div class="card-body"> + <div class="form-group"> + <label for="eventGroupID" class="col-12">Event group ID</label> + <div class="form-group col-12"> + <input type="text" class="form-control" id="eventGroupID" name="eventGroupID" placeholder="" x-model="data.eventGroupID" > + <small class="form-text">You can find this short string of characters in the event group's link, in your confirmation email, or on the event group's page.</small> + </div> + </div> + <div class="form-group"> + <label for="eventGroupEditToken" class="col-12">Event group secret editing code</label> + <div class="form-group col-12"> + <input type="text" class="form-control" id="eventGroupEditToken" name="eventGroupEditToken" placeholder="" x-model="data.eventGroupEditToken" > + <small class="form-text">You can find this long string of characters in the confirmation email you received when you created the event group.</small> + </div> + </div> + </div> + </div> + <div class="form-check"> + <input class="form-check-input" type="checkbox" id="interactionCheckbox" name="interactionCheckbox" x-model="data.interactionCheckbox"> + <label class="form-check-label" for="interactionCheckbox"> + Users can post comments on this event + </label> + </div> + <div class="form-check"> + <input class="form-check-input" type="checkbox" id="joinCheckbox" name="joinCheckbox" x-model="data.joinCheckbox"> + <label class="form-check-label" for="joinCheckbox"> + Users can mark themselves as attending this event + </label> + </div> + <div class="form-check" id="maxAttendeesCheckboxContainer" x-show="data.joinCheckbox"> + <input class="form-check-input" type="checkbox" id="maxAttendeesCheckbox" name="maxAttendeesCheckbox" x-model="data.maxAttendeesCheckbox"> + <label class="form-check-label" for="maxAttendeesCheckbox"> + Set a limit on the maximum number of attendees + </label> + </div> + </div> +</div> +<div class="form-group" id="maxAttendeesContainer" x-show="data.maxAttendeesCheckbox && data.joinCheckbox"> + <label for="maxAttendees" >Attendee limit</label> + <div class="form-group "> + <input type="number" class="form-control" id="maxAttendees" name="maxAttendees" placeholder="Enter a number." x-model="data.maxAttendees" > + </div> +</div> +<div class="form-group"> + <div class="col-12"> + <div + class="alert alert-danger" + role="alert" + x-show="errors.length > 0" + > + <p><i class="fas fa-exclamation-triangle"></i> Please fix these errors:</p> + <ul> + <template x-for="error in errors"> + <li x-text="error.message"></li> + </template> + </ul> + </div> + </div> +</div> diff --git a/views/partials/eventGroupForm.handlebars b/views/partials/eventGroupForm.handlebars new file mode 100644 index 0000000..0b18bba --- /dev/null +++ b/views/partials/eventGroupForm.handlebars @@ -0,0 +1,47 @@ +<div class="form-group"> + <label for="eventGroupName">Name</label> + <input type="text" class="form-control" id="eventGroupName" name="eventGroupName" placeholder="Make it snappy." x-model="data.eventGroupName"> +</div> +<div class="form-group"> + <label for="eventGroupDescription">Description</label> + <textarea class="form-control" id="eventGroupDescription" name="eventGroupDescription" x-model="data.eventGroupDescription">{{eventGroupData.description}}</textarea> + <small class="form-text"><a href="https://commonmark.org/help/">Markdown</a> formatting supported.</small> +</div> +<div class="form-group"> + <label for="eventGroupURL">Link</label> + <input type="url" class="form-control" id="eventGroupURL" name="eventGroupURL" placeholder="For tickets or a page with more information (optional)." x-model="data.eventGroupURL"> +</div> +<div class="form-group"> + <label for="hostName">Host or organisation name</label> + <input type="text" class="form-control" id="eventGroupHostName" name="hostName" placeholder="Will be shown on the event group page (optional)." x-model="data.hostName"> +</div> +<div class="form-group"> + <label for="creatorEmail">Your email</label> + <div class="form-group"> + <input type="email" class="form-control" id="eventGroupCreatorEmail" name="creatorEmail" placeholder="Will not be shown anywhere (optional)." x-model="data.creatorEmail"> + <small class="form-text">If you provide your email, we will send your secret editing password here, and use it to notify you of updates to the event.</small> + </div> +</div> +<div class="form-group"> + <label>Cover image</label> + <div class="image-preview" id="group-image-preview"> + <label for="eventGroupImageUpload" id="group-image-label">Choose file</label> + <input type="file" name="imageUpload" id="group-image-upload" accept="image/jpeg,image/gif,image/png" x-ref="eventGroupImageUpload"/> + </div> + <small class="form-text">Recommended dimensions (w x h): 920px by 300px.</small> +</div> +<div class="form-group"> + <div class="col-12"> + <div + class="alert alert-danger" + role="alert" + x-show="errors.length > 0" + > + <p><i class="fas fa-exclamation-triangle"></i> Please fix these errors:</p> + <ul> + <template x-for="error in errors"> + <li x-text="error.message"></li> + </template> + </ul> + </div> + </div>
\ No newline at end of file diff --git a/views/partials/importeventform.handlebars b/views/partials/importeventform.handlebars index 9ad038a..13fd2ac 100644 --- a/views/partials/importeventform.handlebars +++ b/views/partials/importeventform.handlebars @@ -5,10 +5,10 @@ <img class="img-thumbnail mb-3 d-block mx-auto" src="/images/facebook-export.png" alt="Image showing the location of the export option on Facebook" /> -<form id="icsImportForm" action="/importevent" method="post" enctype="multipart/form-data"> +<form id="icsImportForm" enctype="multipart/form-data" x-data="importEventForm()" @submit.prevent="submitForm"> <div class="form-group"> <div class="custom-file" id="icsImportContainer"> - <input required name="icsImportControl" type="file" class="custom-file-input" id="icsImportControl" aria-describedby="fileHelp" accept="text/calendar"> + <input required name="icsImportControl" type="file" class="custom-file-input" id="icsImportControl" aria-describedby="fileHelp" accept="text/calendar" x-ref="icsImportControl"/> <label name="icsImportLabel" class="custom-file-label" id="icsImportLabel" for="icsImportControl"> <i class="far fa-file-alt"></i> Select file </label> @@ -17,9 +17,25 @@ <div class="form-group"> <label for="creatorEmail" class="form-label">Your email</label> <div class="form-group"> - <input type="email" class="form-control" id="creatorEmail" name="creatorEmail" placeholder="We won't spam you <3" data-validation="email" data-validation-optional="true"> - <small class="form-text">We will send your secret editing link to this email address.</small> + <input type="email" class="form-control" id="importCreatorEmail" name="creatorEmail" placeholder="Will not be shown anywhere (optional)." x-model="data.creatorEmail" > + <small class="form-text">If you provide your email, we will send your secret editing password here, and use it to notify you of updates to the event.</small> </div> </div> - <button type="submit" class="d-block mt-3 mx-auto btn btn-primary w-50">Import</button> + <div class="form-group"> + <div class="col-12"> + <div + class="alert alert-danger" + role="alert" + x-show="errors.length > 0" + > + <p><i class="fas fa-exclamation-triangle"></i> Please fix these errors:</p> + <ul> + <template x-for="error in errors"> + <li x-text="error.message"></li> + </template> + </ul> + </div> + </div> + </div> + <button type="submit" class="d-block mt-3 mx-auto btn btn-primary w-50 mb-4">Import</button> </form> diff --git a/views/partials/neweventform.handlebars b/views/partials/neweventform.handlebars deleted file mode 100755 index 3c7e060..0000000 --- a/views/partials/neweventform.handlebars +++ /dev/null @@ -1,179 +0,0 @@ -<h4 class="mb-2">Create an event</h4> -<form id="newEventForm" action="/newevent" method="post" enctype="multipart/form-data"> - <div class="form-group row"> - <label for="eventName" class="col-sm-2 col-form-label">Event name</label> - <div class="form-group col-sm-10"> - <input type="text" class="form-control" id="eventName" name="eventName" placeholder="Make it snappy." value="{{data.eventName}}" data-validation="required length" data-validation-length="3-120"> - </div> - </div> - <div class="form-group row"> - <label for="eventLocation" class="col-sm-2 col-form-label">Location</label> - <div class="form-group col-sm-10"> - <input type="text" class="form-control" id="eventLocation" name="eventLocation" placeholder="Be specific." value="{{data.eventLocation}}" data-validation="required length" data-validation-length="3-120"> - </div> - </div> - <div class="form-group row"> - <label for="eventStart" class="col-sm-2 col-form-label">Starts</label> - <div class="form-group col-sm-10"> - <input readonly type="text" class="form-control" id="eventStart" name="eventStart" placeholder="Click me!" value="{{data.eventStart}}" data-validation="required"> - </div> - </div> - <div class="form-group row"> - <label for="eventEnd" class="col-sm-2 col-form-label">Ends</label> - <div class="form-group col-sm-10"> - <input readonly type="text" class="form-control" id="eventEnd" name="eventEnd" placeholder="Click me!" value="{{data.eventEnd}}" data-validation="required"> - </div> - </div> - <div class="form-group row"> - <label for="timezone" class="col-sm-2 col-form-label">Timezone</label> - <div class="form-group col-sm-10"> - <select class="select2" id="timezone" name="timezone"></select> - </div> - </div> - <div class="form-group row"> - <label for="eventDescription" class="col-sm-2 col-form-label">Description</label> - <div class="form-group col-sm-10"> - <textarea class="form-control expand" id="eventDescription" name="eventDescription" data-validation="required" placeholder="You can always edit it later."></textarea> - <small class="form-text"><a href="https://commonmark.org/help/">Markdown</a> formatting supported.</small> - </div> - </div> - <div class="form-group row"> - <label for="eventURL" class="col-sm-2 col-form-label">Link</label> - <div class="form-group col-sm-10"> - <input type="url" class="form-control" id="eventURL" name="eventURL" placeholder="For tickets or another event page (optional)." data-validation="url" data-validation-optional="true"> - </div> - </div> - <div class="form-group row"> - <label for="eventImage" class="col-sm-2 col-form-label">Cover image</label> - <div class="form-group col-sm-10"> - <div class="image-preview" id="eventImagePreview"> - <label for="image-upload" id="eventImageLabel">Choose file</label> - <input type="file" name="imageUpload" id="eventImageUpload" accept="image/jpeg,image/gif,image/png" /> - </div> - <small class="form-text">Recommended dimensions (w x h): 920px by 300px.</small> - </div> - </div> - <div class="form-group row"> - <label for="hostName" class="col-sm-2 col-form-label">Host name</label> - <div class="form-group col-sm-10"> - <input type="text" class="form-control" id="hostName" name="hostName" placeholder="Will be shown on the event page (optional)." data-validation="length" data-validation-length="2-60" data-validation-optional="true"> - </div> - </div> - <div class="form-group row"> - <label for="creatorEmail" class="col-sm-2 col-form-label">Your email</label> - <div class="form-group col-sm-10"> - <input type="email" class="form-control" id="creatorEmail" name="creatorEmail" placeholder="We won't spam you <3 (optional)" data-validation="email" data-validation-optional="true"> - <small class="form-text">If you provide your email, we will send your secret editing password here, and use it to notify you of updates to the event.</small> - </div> - </div> - <div class="form-group row"> - <div class="col-sm-2">Options</div> - <div class="col-sm-10"> - <div class="form-check"> - <input class="form-check-input" type="checkbox" id="eventGroupCheckbox" name="eventGroupCheckbox"> - <label class="form-check-label" for="eventGroupCheckbox"> - This event is part of an event group - </label> - </div> - <div class="card text-white bg-secondary my-2" id="eventGroupData"> - <div class="card-header"> - <strong>Link this event to an event group</strong> - </div> - <div class="card-body"> - <div class="form-group row"> - <label for="eventGroupID" class="col-sm-2 col-form-label">Event group ID</label> - <div class="form-group col-sm-10"> - <input type="text" class="form-control" id="eventGroupID" name="eventGroupID" placeholder="" data-validation-optional="true"> - <small class="form-text">You can find this short string of characters in the event group's link, in your confirmation email, or on the event group's page.</small> - </div> - </div> - <div class="form-group row"> - <label for="eventGroupEditToken" class="col-sm-2 col-form-label">Event group secret editing code</label> - <div class="form-group col-sm-10"> - <input type="text" class="form-control" id="eventGroupEditToken" name="eventGroupEditToken" placeholder="" data-validation-optional="true"> - <small class="form-text">You can find this long string of characters in the confirmation email you received when you created the event group.</small> - </div> - </div> - </div> - </div> - <div class="form-check"> - <input class="form-check-input" type="checkbox" id="interactionCheckbox" name="interactionCheckbox"> - <label class="form-check-label" for="interactionCheckbox"> - Users can post comments on this event - </label> - </div> - <div class="form-check"> - <input class="form-check-input" type="checkbox" id="joinCheckbox" name="joinCheckbox"> - <label class="form-check-label" for="joinCheckbox"> - Users can mark themselves as attending this event - </label> - </div> - <div class="form-check" id="maxAttendeesCheckboxContainer"> - <input class="form-check-input" type="checkbox" id="maxAttendeesCheckbox" name="maxAttendeesCheckbox"> - <label class="form-check-label" for="maxAttendeesCheckbox"> - Set a limit on the maximum number of attendees - </label> - </div> - </div> - </div> - <div class="form-group row" id="maxAttendeesContainer"> - <label for="maxAttendees" class="col-sm-2 col-form-label">Attendee limit</label> - <div class="form-group col-sm-10"> - <input type="number" class="form-control" id="maxAttendees" name="maxAttendees" placeholder="Enter a number." data-validation="number" data-validation-optional="true"> - </div> - </div> - <div class="form-group row"> - <div class="col-sm-12 pt-3 pb-3 text-center"> - <button id="newEventFormSubmit" type="submit" class="btn btn-primary w-50">Create</button> - </div> - </div> -</form> - -<script type="text/javascript" src="/js/generate-timezones.js"></script> - -<script> - $(document).ready(function() { - $.uploadPreview({ - input_field: "#eventImageUpload", - preview_box: "#eventImagePreview", - label_field: "#eventImageLabel", - label_default: "Choose file", - label_selected: "Change file", - no_label: false - }); - autosize($('textarea')); - $("#maxAttendeesCheckbox").on("click", function() { - if ($(this).is(':checked')) { - $("#maxAttendeesContainer").slideDown('fast').css("display","flex"); - $("#maxAttendees").attr("data-validation-optional","false"); - } - else { - $("#maxAttendeesContainer").slideUp('fast'); - $("#maxAttendees").attr("data-validation-optional","true").val("").removeClass('is-valid is-invalid'); - } - }); - $("#joinCheckbox").on("click", function() { - if ($(this).is(':checked')) { - $("#maxAttendeesCheckboxContainer").slideDown('fast').css("display","flex"); - } - else { - $("#maxAttendeesCheckboxContainer").slideUp('fast'); - $("#maxAttendeesCheckbox").prop("checked",false); - $("#maxAttendeesContainer").slideUp('fast'); - $("#maxAttendees").attr("data-validation-optional","true").val("").removeClass('is-valid is-invalid'); - } - }); - $("#eventGroupCheckbox").on("click", function() { - if ($(this).is(':checked')) { - $("#eventGroupData").slideDown('fast'); - $("#eventGroupID").removeAttr("data-validation-optional").attr("data-validation","required"); - $("#eventGroupEditToken").removeAttr("data-validation-optional").attr("data-validation","required"); - } - else { - $("#eventGroupData").slideUp('fast'); - $("#eventGroupID").removeAttr("data-validation").attr("data-validation-optional","true").val(""); - $("#eventGroupEditToken").removeAttr("data-validation").attr("data-validation-optional","true").val(""); - } - }); - }); -</script> diff --git a/views/partials/neweventgroupform.handlebars b/views/partials/neweventgroupform.handlebars deleted file mode 100755 index 616b8ca..0000000 --- a/views/partials/neweventgroupform.handlebars +++ /dev/null @@ -1,66 +0,0 @@ -<h4 class="mb-2">Create an event group</h4> -<p>An event group is a holding area for a set of linked events, like a series of film nights, a festival, or a band tour. You can share a public link to your event group just like an individual event link, and people who know the secret editing code (sent in an email when you create the event group) will be able to add future events to the group.</p> -<p>Event groups do not get automatically removed like events do, but events which have been removed from {{siteName}} will of course not show up in an event group.</p> -<form id="newEventForm" action="/neweventgroup" method="post" enctype="multipart/form-data"> - <div class="form-group row"> - <label for="eventGroupName" class="col-sm-2 col-form-label">Event group name</label> - <div class="form-group col-sm-10"> - <input type="text" class="form-control" id="eventGroupName" name="eventGroupName" placeholder="Make it snappy." value="{{data.eventName}}" data-validation="required length" data-validation-length="3-120"> - </div> - </div> - <div class="form-group row"> - <label for="eventGroupDescription" class="col-sm-2 col-form-label">Description</label> - <div class="form-group col-sm-10"> - <textarea class="form-control expand" id="eventGroupDescription" name="eventGroupDescription" data-validation="required" placeholder="You can always edit it later."></textarea> - <small class="form-text"><a href="https://commonmark.org/help/">Markdown</a> formatting supported.</small> - </div> - </div> - <div class="form-group row"> - <label for="eventGroupURL" class="col-sm-2 col-form-label">Link</label> - <div class="form-group col-sm-10"> - <input type="url" class="form-control" id="eventGroupURL" name="eventGroupURL" placeholder="For tickets or a page with more information (optional)." data-validation="url" data-validation-optional="true"> - </div> - </div> - <div class="form-group row"> - <label for="eventGroupImage" class="col-sm-2 col-form-label">Cover image</label> - <div class="form-group col-sm-10"> - <div class="image-preview" id="eventGroupImagePreview"> - <label for="image-upload" id="eventGroupImageLabel">Choose file</label> - <input type="file" name="imageUpload" id="eventGroupImageUpload" /> - </div> - <small class="form-text">Recommended dimensions (w x h): 920px by 300px.</small> - </div> - </div> - <div class="form-group row"> - <label for="hostName" class="col-sm-2 col-form-label">Host or organisation name</label> - <div class="form-group col-sm-10"> - <input type="text" class="form-control" id="hostName" name="hostName" placeholder="Will be shown on the event group page (optional)." data-validation="length" data-validation-length="2-60" data-validation-optional="true"> - </div> - </div> - <div class="form-group row"> - <label for="creatorEmail" class="col-sm-2 col-form-label">Your email</label> - <div class="form-group col-sm-10"> - <input type="email" class="form-control" id="creatorEmail" name="creatorEmail" placeholder="We won't spam you <3 (optional)" data-validation="email" data-validation-optional="true"> - <small class="form-text">If you provide your email, we will send your secret editing password here, and use it to notify you of updates to the event.</small> - </div> - </div> - <div class="form-group row"> - <div class="col-sm-12 pt-3 pb-3 text-center"> - <button type="submit" class="btn btn-primary w-50">Create</button> - </div> - </div> -</form> - -<script> - $(document).ready(function() { - $.uploadPreview({ - input_field: "#eventGroupImageUpload", - preview_box: "#eventGroupImagePreview", - label_field: "#eventGroupImageLabel", - label_default: "Choose file", - label_selected: "Change file", - no_label: false - }); - autosize($('textarea')); - }); -</script> diff --git a/views/partials/sidebar.handlebars b/views/partials/sidebar.handlebars index 980e699..5d8e847 100755 --- a/views/partials/sidebar.handlebars +++ b/views/partials/sidebar.handlebars @@ -3,5 +3,5 @@ <p class="lead text-center mb-4">Nicer events</p> - <a class="btn btn-success mb-2 btn-block" href="/new"><i class="far fa-calendar-plus"></i> New event</a> + <a class="btn btn-success mb-2 btn-block" href="/new"><i class="far fa-calendar-plus"></i> New</a> </div> |