{% extends 'base.html.twig' %}
{% block title %}Search Hymns!{% endblock %}
{% block pageId %}search{% endblock %}
{% block body %}
<h2 class="card page-title">Search Hymns</h2>
<div class="card mt-0 search-form">
{{ form_start(form) }}
{{ form_widget(form) }}
<input type="submit"/>
{{ form_end(form) }}
</div>
{% if hymns|length > 0 %}
<h3 class="card results-container">There are {{ hymns|length }} results.</h3>
<div id="accordion" class="accordion">
<div class="card mt-0">
{% set currFL = hymns[0].title|first %}
<div class="hymn-list-header" id="heading{{ currFL }}">
<button class="btn btn-block text-left" type="button" data-toggle="collapse"
data-target="#collapse{{ currFL }}" aria-expanded="true"
aria-controls="collapse{{ currFL }}">
<span class="h4 m-0">{{ currFL }}</span>
</button>
</div>
<div id="collapse{{ currFL }}" class="collapse" aria-labelledby="heading{{ currFL }}" data-parent="#accordion">
{% for hymn in hymns %}
{% set currTitleInitial = hymn.title|first %}
{% if(currFL < currTitleInitial) %}
{% set currFL = currTitleInitial %}
</div>
</div>
<div class="card mt-0">
<div class="hymn-list-header" id="heading{{ currFL }}">
<button class="btn btn-block text-left" type="button" data-toggle="collapse"
data-target="#collapse{{ currFL }}" aria-expanded="true"
aria-controls="collapse{{ currFL }}">
<span class="h4 m-0">{{ currFL }}</span>
</button>
</div>
<div id="collapse{{ currFL }}" class="collapse" aria-labelledby="heading{{ currFL }}"
data-parent="#accordion">
{% endif %}
<a class="hymn-info-link" class="btn-link text-left" title="{{ hymn.type.title }}"
href="{{ path('hymnInfo', {'slug': hymn.slug} ) }}">{{ hymn.title }} <i class="float-right h6">Type: {{ hymn.type.title }}</i></a>
{% endfor %}
</div>
</div>
</div>
{% endif %}
{% endblock %}
{% block javascripts %}
{{ parent() }}
{{ encore_entry_script_tags('hymnlist') }}
{% endblock %}