{# EXTENDS #}
{% extends "@organisms/tm-bs/modal/modal.twig" %}

{# VARIABLES #}
{% set content_class = 'jcm-items-efx' %}
{% set content_attributes = create_attribute()
  .setAttribute('data-aa-efx-class', 'efx-pulse efx-warning')
  .setAttribute('data-aa-efx-duration', '0.9')
%}
{% set uid = 'jcs-modal' %}
{% set size = 'lg' %}
{% set showbutton = showbutton %}
{% set title_tag = 'h4' %}
{% set title %}
  <i class='fas fa-info'></i> Live travel updates
{% endset %}

{% set header_extra %}
  <div class='latest-update ffl'>

    <span class="update">
      Last update: <span id="jcm-items-update">{{ "now"|date("H:i", "Europe/London") }}</span>
    </span>

    {% set ajax_button_text %}
      <i class='fas fa-sync-alt'></i>
      <span class='sr-only'>Refresh</span>
    {% endset %}

    {{ altcom_ajax_link(
      ajax_button_text,
      "journey_check_modal_items",
      "jcm-items", {}, 1, 1, 0, 3000)
    }}

  </div>
{% endset %}

{# BLOCKS #}
{% block body %}
  {# LIBRARIES - Remember, this is ajax, so all child libs need to be loaded #}
  {{ attach_library('ui_patterns/libraries.bs_collapse') }}
  {{ attach_library('ui_patterns/jc_dropdown.jc_base') }}
  {{ attach_library('ui_patterns/jc_modal.jc_modal_lib') }}

  {# TEMPLATE #}
  <div class="modal-body">
    <div id="live-travel-service-groups">
      <div id="jcm-items">Loading...</div>
    </div>
  </div>
{% endblock %}

{% block footer %}{% endblock %}
