diff --git a/event/static/js/calendar.js b/event/static/js/calendar.js index a13ff83..a2019c9 100644 --- a/event/static/js/calendar.js +++ b/event/static/js/calendar.js @@ -33,6 +33,10 @@ class Calendar { this.events = []; + this.onlyDisplaySubscribedEvents = calendarParameters.onlyDisplaySubscribedEvents !== undefined + ? calendarParameters.onlyDisplaySubscribedEvents + : false; + this.eventDetailURLFormat = calendarParameters.eventDetailURLFormat !== undefined ? calendarParameters.eventDetailURLFormat : ""; @@ -81,6 +85,7 @@ class Calendar { this.updateHoursToDisplay(); this.updateEventContainerGridStyle(); this.updateTimeSlots(); + this.updateEventVisibilities(); this.updateCalendarNodeHeight(); @@ -93,6 +98,7 @@ class Calendar { this.updateHoursToDisplay(); this.updateEventContainerGridStyle(); this.updateTimeSlots(); + this.updateEventVisibilities(); this.updateCalendarNodeHeight(); @@ -114,7 +120,9 @@ class Calendar { let timeSlotHourRowHeight = $(".cal-time-slot-hour").outerHeight(); // Event grid - let eventContainerHeight = $(".cal-event-container") + this.containerNode.css("height", "calc(100% )"); + + let eventContainerHeight = this.eventContainerNode .css("grid-template-rows") .split("px ") .reduce((heightAccumulator, currentRowHeight) => { @@ -355,6 +363,32 @@ class Calendar { background: "#000" }); } + + + // Event filtering + + showEventsNotSubscribedByUser () { + this.onlyDisplaySubscribedEvents = false; + + this.updateEventVisibilities(); + this.updateCalendarNodeHeight(); + } + + hideEventsNotSubscribedByUser () { + this.onlyDisplaySubscribedEvents = true; + + this.updateEventVisibilities(); + this.updateCalendarNodeHeight(); + } + + toggleEventsNotSubscribedByUser () { + if (this.onlyDisplaySubscribedEvents) { + this.showEventsNotSubscribedByUser(); + } + else { + this.hideEventsNotSubscribedByUser(); + } + } } @@ -626,26 +660,41 @@ class Event { // Visibility + hide () { + this.stopDisplayingDetailsPopupOnClick(); + + this.node.hide(); + this.displayed = false; + } + + show () { + this.node.show(); + + this.updateNodeStyle(); + this.updatePositionInGrid(); + this.updateOverflowTooltipTriggering(); + this.startDisplayingDetailsPopupOnClick(); + + this.displayed = true; + } + updateVisibility () { + // If required, hide events which are not subscribed by the current user + if (this.calendar.onlyDisplaySubscribedEvents + && ! this.subscribedByUser) { + this.hide(); + return; + } + // Hide events which cannot apear in the calendar time span if (this.calendar.startDate.getTime() >= this.endDate.getTime() || this.calendar.endDate.getTime() <= this.startDate.getTime()) { - this.stopDisplayingDetailsPopupOnClick(); - - this.node.hide(); - - this.displayed = false; + this.hide(); + return; } - else { - this.node.show(); - this.updateNodeStyle(); - this.updatePositionInGrid(); - this.updateOverflowTooltipTriggering(); - this.startDisplayingDetailsPopupOnClick(); - - this.displayed = true; - } + // Otherwise, show the current event + this.show(); }