Skip to content

Add calendar event icons #922

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
benjamin-antupit wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add calendar event icons #922

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
4 changes: 3 additions & 1 deletion events/cal.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -276,7 +276,8 @@ def generate_cal_json_publicfacing(queryset, from_date=None, to_date=None):
objects_body = []
for event in queryset:
field = {
"title": conditional_escape(event.cal_name()),
"title": conditional_escape("%icon% "+event.cal_name()),
"icon": '<span class="glyphicon '+event.icon+'" aria-hidden="true"></span>',
"url": reverse('events:detail', args=[event.id]),
"className": 'cal-status-' + slugify(event.status),
"start": datetime_to_timestamp(event.cal_start() + timezone.timedelta(hours=-5)),
Expand Down Expand Up @@ -309,6 +310,7 @@ def generate_cal_json(queryset, from_date=None, to_date=None):
field = {
"id": event.cal_guid(),
"title": event.cal_name(),
"icon": '<span class="glyphicon '+event.icon+'" aria-hidden="true"></span>' + ('<span class="glyphicon glyphicon-film" aria-hidden="true"></span>' if event.has_projection else ''),
"url": reverse('events:detail', args=[event.id]),
"className": 'cal-status-' + slugify(event.status),
"start": datetime_to_timestamp(event.cal_start() + timezone.timedelta(hours=-5)),
Expand Down
21 changes: 21 additions & 0 deletions events/models.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -357,6 +357,27 @@ def status(self):
return "Awaiting Payment"
else:
return "To Be Billed" # used to be "Open" git #245

@property
def icon(self):
if self.status == "Cancelled":
return "glyphicon-ban-circle"
elif self.status == "Closed":
return "glyphicon-ok-circle"
elif self.status == "Approved":
return "glyphicon-ok-sign"
elif self.status == "Awaiting Approval":
return "glyphicon-time"
elif self.status == "Awaiting Review":
return "glyphicon-exclamation-sign"
elif self.status == "Paid":
return "glyphicon-check"
elif self.status == "To Be Billed":
return "glyphicon-send"
elif self.status == "Awaiting Payment":
return "glyphicon-usd"
else:
return "glyphicon-question-sign"

@property
def unpaid(self):
Expand Down
29 changes: 23 additions & 6 deletions site_tmpl/events_cal.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,19 @@
border-color:rgb(42, 42, 42) !important
}

.cal-status-cancelled .fc-event-title { text-decoration: line-through; }

.cal-status-cancelled:hover .fc-event-title { text-decoration: none !important; }

.cal-status-awaiting-review { background-color: #e39c2b!important; border-color:#87572a !important}

.fc-event-title-container .glyphicon {
margin-left: 0.4rem;
padding: 1px;
line-height: inherit !important;
}

.key > span { padding: .3em .6em !important; }
</style>

<script>
Expand Down Expand Up @@ -89,6 +101,8 @@
arrow: true,
animation: 'shift-away',
});
console.log(info.event.extendedProps);
info.el.querySelector('.fc-event-title-container').insertAdjacentHTML('afterbegin',info.event.extendedProps.icon);
},
});
calendar.render();
Expand Down Expand Up @@ -159,13 +173,16 @@ <h4 class="well" style="margin: 10px 15px;">
<a class="btn btn-default{% if request.GET.projection == 'only'%} active{% endif %}" href="{% append_to_get projection='only' %}">Show Only Projection</a>
</div>
</h4>
<h4 class="well" style="margin: 10px 15px;">
<h4 class="well key" style="margin: 10px 15px;">
<span class="label" style="color:black">Event Color Key</span>
<span class="label cal-status-awaiting-approval">Awaiting Approval</span>
<span class="label cal-status-approved">Confirmed</span>
<span class="label cal-status-awaiting-review">Awaiting Billing Review</span>
<span class="label cal-status-paid">To be billed, Awaiting payment, Paid, Cancelled, or Closed</span> <!-- .cal-status-paid, .cal-status-cancelled, .cal-status-closed, .cal-status-awaiting-payment, .cal-status-to-be-billed -->
<span class="label" style="background-color: blue; border: darkblue;">Other/Unknown</span>
<span class="label cal-status-awaiting-approval"><span class="glyphicon glyphicon-time"></span> Awaiting Approval</span>
<span class="label cal-status-approved"><span class="glyphicon glyphicon-ok-sign"></span> Confirmed</span>
<span class="label cal-status-awaiting-review"><span class="glyphicon glyphicon-exclamation-sign"></span> Awaiting Billing Review</span>
<span class="label cal-status-awaiting-payment"><span class="glyphicon glyphicon-usd"></span> Awaiting payment</span>
<span class="label cal-status-paid"><span class="glyphicon glyphicon-check"></span> Paid</span>
<span class="label cal-status-cancelled"><span class="glyphicon glyphicon-ban-circle"></span> Cancelled</span>
<span class="label cal-status-closed"><span class="glyphicon glyphicon-ok-circle"></span> Closed</span>
<span class="label" style="background-color: blue; border: darkblue;"><span class="glyphicon glyphicon-question-sign"></span> Other/Unknown</span>
</h4>
</div>

Expand Down