Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 15 additions & 0 deletions app/components/public/add-to-calender.hbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<div class="ui list basic segment m-0 pb-0">
<div class="item">
<i class="clock alternate outline icon pt-1"></i>
<div class="content">
{{#if this.isSingleDay}}
{{general-date @event.startsAt @event.timezone "dddd, MMMM DD, YYYY"}}<br>{{general-date @event.startsAt @event.timezone "h:mm A"}} {{t 'to'}} {{general-date @event.endsAt @event.timezone "h:mm A"}}
{{else}}
{{general-date @event.startsAt @event.timezone "dddd, MMMM DD, YYYY h:mm A"}} {{t 'to'}} {{general-date @event.endsAt @event.timezone "dddd, MMMM DD, YYYY h:mm A"}}
{{/if}}
({{this.timezone}})
<br>
<a href={{this.calendarUrl}} target="_blank" rel="noreferrer nofollow">{{t 'Add to Google Calendar'}}</a>
</div>
</div>
</div>
37 changes: 37 additions & 0 deletions app/components/public/add-to-calender.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import Component from '@glimmer/component';
import moment, { Moment } from 'moment';
import Event from 'open-event-frontend/models/event';

interface Args {
event: Event,
location: string
}

export default class AddToCalender extends Component<Args> {

get timezone(): string {
return moment.tz(this.args.event.timezone).format('z');
}

get startsAt(): Moment {
const { event } = this.args;
return moment(event.startsAt).tz(event.timezone);
}

get endsAt(): Moment {
const { event } = this.args;
return moment(event.endsAt).tz(event.timezone);
}

get isSingleDay(): boolean {
return this.startsAt.isSame(this.endsAt, 'day');
}

get calendarUrl(): string {
const { event } = this.args;
const startTime = this.startsAt.utc().format('YYYYMMDD[T]HHmmSS[Z]');
const endTime = this.endsAt.utc().format('YYYYMMDD[T]HHmmSS[Z]');
return `https://calendar.google.com/calendar/render?action=TEMPLATE&dates=${startTime}/${endTime}&text=${event.name}&location=${this.args.location}&ctz=${event.timezone}&details=${event.description}`;
}

}
2 changes: 1 addition & 1 deletion app/components/public/social-links.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import Component from '@ember/component';
import { computed } from '@ember/object';

export default Component.extend({
classNames: ['ui', 'basic', 'segment'],
classNames: ['ui', 'basic', 'segment', 'm-0', 'pt-0'],

socialLinks: A(),

Expand Down
4 changes: 4 additions & 0 deletions app/styles/partials/utils.scss
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,10 @@
padding: .25rem !important;
}

.pt-1 {
padding-top: .25rem !important;
}

.p-4 {
padding: 1rem !important;
}
Expand Down
3 changes: 2 additions & 1 deletion app/templates/public.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,8 @@
{{/each}}
</div>
{{/if}}
<Public::SocialLinks @externalUrl={{this.model.externalEventUrl}} @socialLinks={{this.model.socialLinks}} />
<Public::AddToCalender @event={{this.model}} @location={{this.headerLocation}}/>
<Public::SocialLinks @externalUrl={{this.model.externalEventUrl}} @socialLinks={{this.model.socialLinks}}/>
{{/if}}
</div>
</div>
Expand Down