bornhack-website/src/program/templates/schedule_base.html

{% extends 'program_base.html' %}
{% load dateutils %}

{% block program_content %}

<div class="row">
        <div class="schedule-days btn-group">
            <a href="{% url 'schedule_index' camp_slug=camp.slug %}" class="btn btn-{% if request.resolver_match.url_name == 'schedule_index' %}primary{% else %}default{% endif %}">
            <li>All days</li>
            </a>
            {% for day in camp.camp_days %}
            {% with month_padded=day.lower.date|date:"m" day_padded=day.lower.date|date:"d" %}
            <a href="{% url 'schedule_day' camp_slug=camp.slug year=day.lower.date.year month=month_padded day=day_padded %}" class="btn btn-{% if urlyear and urlyear|add:"0" == day.lower.date.year and urlmonth == month_padded and urlday == day_padded %}primary{% else %}default{% endif %}">
                {{ day.lower.date|date:"l" }}
            </a>
            {% endwith %}
            {% endfor %}
        </div>
</div>

<hr />

<div class="row">
    <div class="col-sm-3 col-sm-push-9 schedule-filter">
        <h4>Filter</h4>
        <form id="filter" class="form-inline">
            <div class="form-group">
                <div>
                    <h5>Type:</h5>
                    <ul>
                    {% for type in camp.event_types %}
                    <li>
                        <input type="checkbox"
                               name="event-type-{{ type.slug }}"
                               id="event-type-{{ type.slug }}"
                               value="{{ type.slug }}"
                               class="form-control event-type-checkbox" />

                        <div class="btn-group">
                            <label for="event-type-{{ type.slug }}" class="btn btn-default" style="min-width: 200px; text-align: left;">
                                <i class="fa fa-minus"></i>
                                <i class="fa fa-plus"></i>
                                &nbsp;&nbsp;
                                {{ type.name }}
                            </label>
                        </div>

                    </li>
                    {% endfor %}
                    </ul>
                </div>

                <div>
                    <h5>Location:</h5>
                    <ul>
                    {% for location in camp.event_locations %}
                    <li>
                        <input type="checkbox"
                               name="location-{{ location.slug }}"
                               id="location-{{ location.slug }}"
                               name="locations"
                               value="{{ location.slug }}"
                               class="form-control location-checkbox" />

                        <div class="btn-group">
                            <label for="location-{{ location.slug }}" class="btn btn-default" style="min-width: 200px; text-align: left;">
                                <i class="fa fa-minus"></i>
                                <i class="fa fa-plus"></i>
                                &nbsp;&nbsp;
                                {{ location.name }}
                            </label>
                        </div>

                    </li>
                    {% endfor %}
                    </ul>
                </div>

                <a href="{% url 'ics_view' camp_slug=camp.slug %}{{ get_string }}" class="btn btn-default form-control filter-control">
                    <i class="fa fa-calendar"></i> ICS
                </a>
            </div>
        </form>
    </div>
    <div class="col-sm-9 col-sm-pull-3">
      {% block schedule_content %}
      {% endblock schedule_content %}
    </div>
</div>

<hr />


{% url 'schedule_index' camp_slug=camp.slug as baseurl %}

<script>
    $('.filter-control').on('change', function() {
        var type = $('#event_type').val();
        var loc = $('#location').val();
        var url = "{{baseurl}}";

        if(type != '' || loc != '') {
          url = url + '?';
          if(type != '') {
              url = url + 'type=' + type;
              if(loc != '') { url = url + '&'; }
          }
          if(loc != '') {
              url = url + 'location=' + loc;
          }
        }

        window.location.href = url;
    });
</script>

{% endblock program_content %}