Allow hiding/blurring sessions and timeslots based on TimeSlotType in the schedule editor

 - Legacy-Id: 19438

Author: jennifer-richards

ietf/meeting/helpers.py

@@ -310,7 +310,7 @@ def _session_name_keyword(self, session):
 
     @property
     def filterable_purposes(self):
-        return SessionPurposeName.objects.exclude(slug='session').order_by('name')
+        return SessionPurposeName.objects.exclude(slug='regular').order_by('name')
 
 
 class AgendaFilterOrganizer(AgendaKeywordTool):

ietf/meeting/views.py

@@ -991,6 +991,14 @@ def cubehelix(i, total, hue=1.2, start_angle=0.5):
             p.light_scheduling_color = "rgb({}, {}, {})".format(*tuple(int(round((0.9 + 0.1 * x) * 255)) for x in rgb_color))
 
     session_purposes = sorted(set(s.purpose for s in sessions if s.purpose), key=lambda p: p.name)
+    timeslot_types = sorted(
+        set(
+            s.type for s in sessions if s.type
+        ).union(
+            t.type for t in timeslots_qs.all()
+        ),
+        key=lambda tstype: tstype.name,
+    )
 
     return render(request, "meeting/edit_meeting_schedule.html", {
         'meeting': meeting,
@@ -1003,6 +1011,7 @@ def cubehelix(i, total, hue=1.2, start_angle=0.5):
         'unassigned_sessions': unassigned_sessions,
         'session_parents': session_parents,
         'session_purposes': session_purposes,
+        'timeslot_types': timeslot_types,
         'hide_menu': True,
         'lock_time': lock_time,
     })

ietf/secr/sreq/forms.py

@@ -94,8 +94,10 @@ def __init__(self, group, meeting, data=None, *args, **kwargs):
         self.session_forms = formset_class(group=self.group, meeting=meeting, data=data)
         super(SessionForm, self).__init__(data=data, *args, **kwargs)
 
+        # Allow additional sessions for non-wg-like groups
         if not self.group.features.acts_like_wg:
             self.fields['num_session'].choices = ((n, str(n)) for n in range(1, 13))
+
         self.fields['comments'].widget = forms.Textarea(attrs={'rows':'3','cols':'65'})
 
         other_groups = list(allowed_conflicting_groups().exclude(pk=group.pk).values_list('acronym', 'acronym').order_by('acronym'))

ietf/static/ietf/css/ietf.css

@@ -1333,10 +1333,20 @@ a.fc-event, .fc-event, .fc-content, .fc-title, .fc-event-container {
 
 .edit-meeting-schedule .scheduling-panel .preferences {
   margin: 0.5em 0;
+  display: flex;
+  align-items: flex-start;
 }
 
-.edit-meeting-schedule .scheduling-panel .preferences > span {
+.edit-meeting-schedule .scheduling-panel .preferences > div {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.edit-meeting-schedule .scheduling-panel .preferences > div > span {
+  margin-top: 0;
   margin-right: 1em;
+  white-space: nowrap;
 }
 
 .edit-meeting-schedule .sort-unassigned select {
@@ -1363,7 +1373,7 @@ a.fc-event, .fc-event, .fc-content, .fc-title, .fc-event-container {
   margin-top: 1em;
 }
 
-.edit-meeting-schedule .session-parent-toggles label {
+.edit-meeting-schedule .toggle-inputs label {
   font-weight: normal;
   margin-right: 1em;
   padding: 0 1em;

ietf/static/ietf/js/edit-meeting-schedule.js

@@ -724,6 +724,23 @@ jQuery(document).ready(function () {
     sessionParentInputs.on("click", updateSessionParentToggling);
     updateSessionParentToggling();
 
+    // Toggling timeslot types
+    let timeSlotTypeInputs = content.find('.timeslot-type-toggles input');
+    function updateTimeSlotTypeToggling() {
+        let checked = [];
+        timeSlotTypeInputs.filter(":checked").each(function () {
+            checked.push("[data-type=" + this.value + "]");
+        });
+
+        sessions.filter(checked.join(",")).removeClass('hidden-timeslot-type');
+        sessions.not(checked.join(",")).addClass('hidden-timeslot-type');
+        timeslots.filter(checked.join(",")).removeClass('hidden-timeslot-type');
+        timeslots.not(checked.join(",")).addClass('hidden-timeslot-type');
+    }
+
+    timeSlotTypeInputs.on("click", updateTimeSlotTypeToggling);
+    updateTimeSlotTypeToggling();
+
     // Toggling session purposes
     let sessionPurposeInputs = content.find('.session-purpose-toggles input');
     function updateSessionPurposeToggling() {

ietf/static/ietf/js/meeting/session_details_form.js

@@ -55,7 +55,7 @@
 
   function update_name_field_visibility(name_elt, purpose) {
     const row = name_elt.closest('tr');
-    if (purpose === 'session') {
+    if (purpose === 'regular') {
       row.setAttribute('hidden', 'hidden');
     } else {
       row.removeAttribute('hidden');

ietf/templates/meeting/edit_meeting_schedule.html

@@ -17,9 +17,12 @@
   .edit-meeting-schedule .past-flag { visibility: hidden; font-size: smaller; }
   .edit-meeting-schedule .edit-grid .timeslot.past .past-flag { visibility: visible; color: #aaaaaa; }
   {# type and purpose styling #}
-  .edit-meeting-schedule .edit-grid .timeslot.wrong-timeslot-type { background-color: transparent; ); }
-  .edit-meeting-schedule .edit-grid .timeslot.wrong-timeslot-type .time-label { color: transparent; ); }
-  .edit-meeting-schedule .session.hidden-purpose { filter: blur(3px); }
+  .edit-meeting-schedule .edit-grid .timeslot.wrong-timeslot-type,
+  .edit-meeting-schedule .edit-grid .timeslot.hidden-timeslot-type { background-color: transparent; ); }
+  .edit-meeting-schedule .edit-grid .timeslot.wrong-timeslot-type .time-label,
+  .edit-meeting-schedule .edit-grid .timeslot.hidden-timeslot-type .time-label { color: transparent; ); }
+  .edit-meeting-schedule .session.hidden-purpose,
+  .edit-meeting-schedule .session.hidden-timeslot-type { filter: blur(3px); }
 {% endblock morecss %}
 
 {% block title %}{{ schedule.name }}: IETF {{ meeting.number }} meeting agenda{% endblock %}
@@ -172,32 +175,44 @@
         </div>
 
         <div class="preferences">
-          <span class="sort-unassigned">
-            Sort unassigned:
-            <select name="sort_unassigned" class="form-control">
-              <option value="name" selected="selected">By name</option>
-              <option value="parent">By area</option>
-              <option value="duration">By duration</option>
-              <option value="comments">Special requests</option>
-            </select>
-          </span>
-
-          <span class="session-parent-toggles">
-            Show:
-            {% for p in session_parents %}
-              <label class="parent-{{ p.acronym }}"><input type="checkbox" checked value="{{ p.acronym }}"> {{ p.acronym }}</label>
-            {% endfor %}
-          </span>
+          <div>
+            <span class="sort-unassigned">
+              Sort unassigned:
+              <select name="sort_unassigned" class="form-control">
+                <option value="name" selected="selected">By name</option>
+                <option value="parent">By area</option>
+                <option value="duration">By duration</option>
+                <option value="comments">Special requests</option>
+              </select>
+            </span>
+
+            <span class="timeslot-group-toggles">
+              <button class="btn btn-default" data-toggle="modal" data-target="#timeslot-group-toggles-modal"><input type="checkbox" checked="checked" disabled> Timeslots</button>
+            </span>
+          </div>
 
-          <span class="session-purpose-toggles">
-            {% for purpose in session_purposes %}
-              <label class="purpose-{{ purpose.slug }}"><input type="checkbox" checked value="{{ purpose.slug }}"> {{ purpose }}</label>
-            {% endfor %}
-          </span>
+          <div>
+            <span class="toggle-inputs session-parent-toggles">
+              Show:
+              {% for p in session_parents %}
+                <label class="parent-{{ p.acronym }}"><input type="checkbox" checked value="{{ p.acronym }}"> {{ p.acronym }}</label>
+              {% endfor %}
+            </span>
 
-          <span class="timeslot-group-toggles">
-            <button class="btn btn-default" data-toggle="modal" data-target="#timeslot-group-toggles-modal"><input type="checkbox" checked="checked" disabled> Timeslots</button>
-          </span>
+            <span class="toggle-inputs session-purpose-toggles">
+              Purpose:
+              {% for purpose in session_purposes %}
+                <label class="purpose-{{ purpose.slug }}"><input type="checkbox" checked value="{{ purpose.slug }}"> {{ purpose }}</label>
+              {% endfor %}
+            </span>
+
+            <span class="toggle-inputs timeslot-type-toggles">
+              Type:
+              {% for type in timeslot_types %}
+                <label class="timeslot-type-{{ type.slug }}"><input type="checkbox" checked value="{{ type.slug }}"> {{ type }}</label>
+              {% endfor %}
+            </span>
+          </div>
         </div>
       </div>