program_page.html

{% extends "styleguide2/base.html" %}

{% load wagtailcore_tags %}

{% block content %}
  {% block navbar %}
    {% include 'styleguide2/includes/organisms/layout/navbar.html' with selected_item=page.get_menu_title %}
  {% endblock %}

  <div class="__js-root">
    <ui-view-provider
      :initial="{view1: true, {% for program_group in page.program %}view{{ forloop.counter }}: {% if forloop.first %}true{% else %}false{% endif %}{% if not forloop.last %},{% endif %}{% endfor %}}"
      :sync-location="true"
      v-slot="{ isCurrentView, toggleView }"
    >
      {% include 'styleguide2/includes/organisms/header/simple_header_with_ui_switch.html' with title=page.title description=page.perex ui_switch_iterable=page.program background_image=page.header_image %}

      <main role="main">
        {% for program in page.program %}
          <template v-if="isCurrentView('view{{ forloop.counter }}')">
            {% with program.block_type as block_type %}
              {% include_block program %}
            {% endwith %}
          </template>
        {% endfor %}
      </main>
    </ui-view-provider>
  </div>

  {% include 'styleguide2/includes/organisms/main_section/newsletter_section.html' %}
{% endblock %}