summaryrefslogtreecommitdiff
path: root/views
diff options
context:
space:
mode:
Diffstat (limited to 'views')
-rwxr-xr-xviews/event.handlebars46
-rwxr-xr-xviews/eventgroup.handlebars164
-rwxr-xr-xviews/newevent.handlebars33
-rw-r--r--views/partials/editeventgroupmodal.handlebars45
-rw-r--r--views/partials/editeventmodal.handlebars205
-rw-r--r--views/partials/importeventform.handlebars1
-rwxr-xr-xviews/partials/neweventform.handlebars52
-rwxr-xr-xviews/partials/neweventgroupform.handlebars66
8 files changed, 500 insertions, 112 deletions
diff --git a/views/event.handlebars b/views/event.handlebars
index d4637f4..4d0cf28 100755
--- a/views/event.handlebars
+++ b/views/event.handlebars
@@ -32,17 +32,9 @@
<i class="fas fa-map-marked"></i> Show on OpenStreetMap
</a>
</li>
- {{#if eventHasHost}}
- <li>
- <span class="fa-li">
- <i class="fas fa-fw fa-user-circle"></i>
- </span>
- <span class="text-muted">Hosted by</span> {{eventData.hostName}}
- </li>
- {{/if}}
<li>
<span class="fa-li">
- <i class="far fa-fw fa-calendar-alt"></i>
+ <i class="fas fa-fw fa-calendar-day"></i>
</span>
{{{displayDate}}}
<br>
@@ -54,10 +46,26 @@
<i class="far fa-calendar-plus"></i> Add to Google Calendar
</a>
</li>
+ {{#if eventHasHost}}
+ <li>
+ <span class="fa-li">
+ <i class="fas fa-fw fa-user-circle"></i>
+ </span>
+ <span class="text-muted">Hosted by</span> {{eventData.hostName}}
+ </li>
+ {{/if}}
+ {{#if eventData.eventGroup}}
+ <li>
+ <span class="fa-li">
+ <i class="fas fa-fw fa-calendar-alt"></i>
+ </span>
+ <span class="text-muted">Part of</span> <a href="/group/{{eventData.eventGroup.id}}">{{eventData.eventGroup.name}}</a>
+ </li>
+ {{/if}}
{{#if eventData.url}}
<li>
<span class="fa-li">
- <i class="fas fa-link"></i>
+ <i class="fas fa-fw fa-link"></i>
</span>
<a href="{{eventData.url}}">
{{eventData.url}}
@@ -66,11 +74,9 @@
{{/if}}
<li>
<span class="fa-li">
- <i class="fas fa-share-square"></i>
+ <i class="fas fa-fw fa-share-square"></i>
</span>
- <a href="https://gath.io/{{eventData.id}}">
- gath.io/{{eventData.id}}
- </a>
+ <a href="https://gath.io/{{eventData.id}}">gath.io/{{eventData.id}}</a>
<button type="button" id="copyEventLink" class="eventInformationAction btn btn-outline-secondary btn-sm" data-clipboard-text="https://gath.io/{{eventData.id}}">
<i class="fas fa-copy"></i> Copy
</button>
@@ -417,6 +423,18 @@
$("#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/eventgroup.handlebars b/views/eventgroup.handlebars
new file mode 100755
index 0000000..00bae2c
--- /dev/null
+++ b/views/eventgroup.handlebars
@@ -0,0 +1,164 @@
+{{#if eventGroupHasCoverImage}}
+ <div id="eventImageContainer" style="background-image: url(/events/{{eventGroupData.image}});"></div>
+{{else}}
+ <div id="genericEventImageContainer" style="background-image: url(/images/seigaiha.png);"></div>
+{{/if}}
+<div class="row">
+ <div class="col-lg">
+ <h3 id="eventName">{{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>
+ </div>
+ {{/if}}
+</div>
+{{#if firstLoad}}
+<div class="alert alert-success alert-dismissible fade show" role="alert">
+ <button type="button" class="close" data-dismiss="alert" aria-label="Close">
+ <span aria-hidden="true">&times;</span>
+ </button>
+ Welcome to your event group! We've just sent you an email with your secret editing link, which you can also see in the address bar above. Haven't got the email? Check your spam or junk folder. To share your event group, use the link you can see just below this message - that way your attendees won't be able to edit or delete your event group!
+</div>
+{{/if}}
+<div class="card mt-4 mb-4">
+ <div class="card-body">
+ <ul class="fa-ul eventInformation">
+ {{#if eventGroupHasHost}}
+ <li>
+ <span class="fa-li">
+ <i class="fas fa-fw fa-user-circle"></i>
+ </span>
+ <span class="text-muted">Hosted by</span> {{eventGroupData.hostName}}
+ </li>
+ {{/if}}
+ {{#if eventGroupData.url}}
+ <li>
+ <span class="fa-li">
+ <i class="fas fa-link"></i>
+ </span>
+ <a href="{{eventGroupData.url}}">
+ {{eventGroupData.url}}
+ </a>
+ </li>
+ {{/if}}
+ <li>
+ <span class="fa-li">
+ <i class="fas fa-share-square"></i>
+ </span>
+ <a href="https://gath.io/group/{{eventGroupData.id}}">
+ gath.io/group/{{eventGroupData.id}}
+ </a>
+ <button type="button" id="copyEventLink" class="eventInformationAction btn btn-outline-secondary btn-sm" data-clipboard-text="https://gath.io/group/{{eventGroupData.id}}">
+ <i class="fas fa-copy"></i> Copy
+ </button>
+ </li>
+ </ul>
+ </div>
+</div>
+
+{{#if editingEnabled}}
+ <div class="alert alert-success">
+ <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>
+ </tr>
+ <tr>
+ <td><strong>Event group secret editing code</strong></td>
+ <td><span class="code">{{eventGroupData.editToken}}</span></td>
+ </tr>
+ </table>
+ </div>
+
+ </div>
+{{/if}}
+
+<div class="card mb-4" id="eventDescription">
+ <h5 class="card-header">About</h5>
+ <div class="card-body">
+ {{{parsedDescription}}}
+ </div>
+</div>
+<div class="card mt-4 mb-4">
+ <h5 class="card-header">Upcoming events</h5>
+ <div class="list-group list-group-flush">
+ {{#if upcomingEventsExist}}
+ {{#each events}}
+ {{#unless this.eventHasConcluded}}
+ <a href="/{{this.id}}" class="list-group-item list-group-item-action" target="_blank">
+ <i class="fas fa-fw fa-calendar-day"></i>
+ <strong>{{this.name}}</strong>
+ <span class="ml-2 text-muted">{{this.displayDate}}</span>
+ </a>
+ {{/unless}}
+ {{/each}}
+ {{else}}
+ <div class="list-group-item">No events!</div>
+ {{/if}}
+ </div>
+</div>
+
+{{#if editingEnabled}}
+{{> editeventgroupmodal }}
+
+<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h5 class="modal-title" id="deleteModalLabel">Delete '{{eventGroupData.name}}'</h5>
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">&times;</span>
+ </button>
+ </div>
+ <form 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>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+ <button type="submit" class="btn btn-danger">Delete event group</button>
+ </div>
+ </form>
+ </div>
+ </div>
+</div>
+
+{{/if}}
+
+<script>
+ $.validate({
+ lang: 'en',
+ errorElementClass: "is-invalid",
+ errorMessageClass: "text-danger",
+ successElementClass: "is-valid"
+ });
+
+ $(document).ready(function() {
+
+ $.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');
+ autosize($('textarea'));
+ $("#copyEventLink").click(function(){
+ $(this).html('<i class="fas fa-copy"></i> Copied!');
+ setTimeout(function(){ $("#copyEventLink").html('<i class="fas fa-copy"></i> Copy');}, 5000);
+ })
+ });
+
+ </script>
diff --git a/views/newevent.handlebars b/views/newevent.handlebars
index b63b43c..81d39c5 100755
--- a/views/newevent.handlebars
+++ b/views/newevent.handlebars
@@ -34,12 +34,15 @@
<div class="container mb-4">
<div class="row">
- <div class="col-sm-6 p-2">
+ <div class="col-sm-4 p-2">
<button type="button" id="showNewEventFormButton" class="btn btn-lg btn-secondary w-100"><i class="fas fa-file"></i> Create a new event</button>
</div>
- <div class="col-sm-6 p-2">
+ <div class="col-sm-4 p-2">
<button type="button" id="showImportEventFormButton" class="btn btn-lg 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-lg btn-secondary w-100"><i class="fas fa-folder-open"></i> Create a new event group </button>
+ </div>
</div>
</div>
@@ -58,6 +61,9 @@
{{>importeventform}}
</div>
+<div id="newEventGroupFormContainer">
+ {{>neweventgroupform}}
+</div>
<script>
$.validate({
@@ -89,26 +95,41 @@
dateTimeSeparator: ', '
});
$("#showNewEventFormButton").click(function(){
- $("#showImportEventFormButton").removeClass("active");
+ $("button").removeClass("active");
+ $("#showImportEventFormButton #showNewEventGroupFormButton").removeClass("active");
if ($("#newEventFormContainer").is(":visible")){
$("#newEventFormContainer").slideUp("fast");
- $(this).removeClass("active");
}
else {
$("#newEventFormContainer").slideDown("fast");
$("#importEventFormContainer").slideUp("fast");
+ $("#newEventGroupFormContainer").slideUp("fast");
$(this).addClass("active");
}
})
$("#showImportEventFormButton").click(function(){
- $("#showNewEventFormButton").removeClass("active");
+ $("button").removeClass("active");
+ $("#showNewEventFormButton #showNewEventGroupFormButton").removeClass("active");
if ($("#importEventFormContainer").is(":visible")){
$("#importEventFormContainer").slideUp("fast");
- $(this).removeClass("active");
}
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");
}
})
diff --git a/views/partials/editeventgroupmodal.handlebars b/views/partials/editeventgroupmodal.handlebars
new file mode 100644
index 0000000..7ab1221
--- /dev/null
+++ b/views/partials/editeventgroupmodal.handlebars
@@ -0,0 +1,45 @@
+<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="editModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h5 class="modal-title" id="editModalLabel">Edit '{{eventGroupData.name}}'</h5>
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">&times;</span>
+ </button>
+ </div>
+ <form id="editEventForm" action="/editeventgroup/{{eventGroupData.id}}/{{eventGroupData.editToken}}" method="post" enctype="multipart/form-data" autocomplete="off">
+ <div class="modal-body">
+ <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-60">
+ </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-60" 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>
+ </div>
+ <div class="modal-footer">
+ <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+ <button type="submit" class="btn btn-primary">Save changes</button>
+ </div>
+ </form>
+ </div>
+ </div>
+</div>
diff --git a/views/partials/editeventmodal.handlebars b/views/partials/editeventmodal.handlebars
index 68c8f80..553d961 100644
--- a/views/partials/editeventmodal.handlebars
+++ b/views/partials/editeventmodal.handlebars
@@ -1,108 +1,141 @@
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="editModalLabel" aria-hidden="true">
- <div class="modal-dialog" role="document">
- <div class="modal-content">
- <div class="modal-header">
- <h5 class="modal-title" id="editModalLabel">Edit '{{eventData.name}}'</h5>
- <button type="button" class="close" data-dismiss="modal" aria-label="Close">
- <span aria-hidden="true">&times;</span>
- </button>
- </div>
- <form id="editEventForm" action="/editevent/{{eventData.id}}/{{eventData.editToken}}" method="post" enctype="multipart/form-data" autocomplete="off">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h5 class="modal-title" id="editModalLabel">Edit '{{eventData.name}}'</h5>
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">&times;</span>
+ </button>
+ </div>
<div class="modal-body">
- <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="{{eventData.name}}" data-validation="required length" data-validation-length="3-60">
+ <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-60">
</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="{{eventData.location}}" data-validation="required length" data-validation-length="3-60">
+ <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-60">
</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" value="" data-validation="required">
+ <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>
- <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" value="" data-validation="required">
+ <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>
- <div class="form-group row">
- <label for="timezone" class="col-sm-2 col-form-label">Timezone</label>
- <div class="form-group col-sm-10">
+ <div class="form-group">
+ <label for="timezone" class="col-form-label">Timezone</label>
<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" 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 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>
- <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" value="{{eventData.url}}" placeholder="For tickets or another event page (optional)." data-validation="url" data-validation-optional="true">
+ <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>
- <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)." value="{{eventData.hostName}}" data-validation="length" data-validation-length="3-60" data-validation-optional="true">
+ <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-60" 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 id="image-preview">
+ <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>
</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="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-group">
+ <div class="mb-2">Options</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}}>
+ <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 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>
- </div>
- <div class="form-group row" id="maxAttendeesContainer" {{#if eventData.maxAttendees}}style="display:flex"{{/if}}>
- <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" value="{{eventData.maxAttendees}}">
- </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">Save changes</button>
- </div>
- </form>
- </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">Save changes</button>
+ </form>
+ </div>
+ </div>
+ </div>
+</div> \ No newline at end of file
diff --git a/views/partials/importeventform.handlebars b/views/partials/importeventform.handlebars
index 35baf6e..7bf5b17 100644
--- a/views/partials/importeventform.handlebars
+++ b/views/partials/importeventform.handlebars
@@ -1,3 +1,4 @@
+<h4 class="mb-2">Import an existing event</h4>
<p>
Upload an .ics file here to instantly create an event. You can save a Facebook event as an .ics file by clicking on the context menu next to the 'Import' and 'Edit' buttons on the event page and choosing the 'Export Event' option. Then select the 'Save to calendar' option and save the file on your computer.
</p>
diff --git a/views/partials/neweventform.handlebars b/views/partials/neweventform.handlebars
index 51d1695..fff2f4d 100755
--- a/views/partials/neweventform.handlebars
+++ b/views/partials/neweventform.handlebars
@@ -1,3 +1,4 @@
+<h4 class="mb-2">Create an event</h4>
<form id="newEventForm" action="/newevent" method="post" enctype="multipart/form-data">
<input type="text" hidden class="form-control" id="eventType" name="eventType" value="{{eventType}}">
<div class="form-group row">
@@ -46,9 +47,9 @@
<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 id="image-preview">
- <label for="image-upload" id="image-label">Choose file</label>
- <input type="file" name="imageUpload" id="image-upload" />
+ <div class="image-preview" id="eventImagePreview">
+ <label for="image-upload" id="eventImageLabel">Choose file</label>
+ <input type="file" name="imageUpload" id="eventImageUpload" />
</div>
<small class="form-text">Recommended dimensions (w x h): 920px by 300px.</small>
</div>
@@ -81,6 +82,33 @@
<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
@@ -118,9 +146,9 @@
<script>
$(document).ready(function() {
$.uploadPreview({
- input_field: "#image-upload",
- preview_box: "#image-preview",
- label_field: "#image-label",
+ input_field: "#eventImageUpload",
+ preview_box: "#eventImagePreview",
+ label_field: "#eventImageLabel",
label_default: "Choose file",
label_selected: "Change file",
no_label: false
@@ -147,5 +175,17 @@
$("#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
new file mode 100755
index 0000000..b7524d4
--- /dev/null
+++ b/views/partials/neweventgroupform.handlebars
@@ -0,0 +1,66 @@
+<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 Gathio 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-60">
+ </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" data-validation="email required">
+ <small class="form-text">We will send your secret editing link to this email address.</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>
generated by cgit v1.2.3 (git 2.25.1) at 2025-07-21 21:56:17 +0000