source_list.html

{% extends "base.html" %}
{% block content %}
<title>Browse Sources | Cantus Manuscript Database</title>
<script src="/static/js/source_list.js"></script>

<div class="mr-3 p-3 col-md-12 mx-auto bg-white rounded">
    <!-- global search bar-->
    <object align="right" class="search-bar">
        {% include "global_search_bar.html" %}
    </object>
    <h3>Browse Sources</h3>
    <small>Displaying {{ page_obj.start_index }}-{{ page_obj.end_index }} of <b>{{ page_obj.paginator.count }}</b> sources</small>

    <form method="get">
        <div class="form-row align-items-end">
            <div class="form-group m-1 col-lg">
                <label for="segmentFilter"><small>Segment</small></label>
                <select id="segmentFilter" name="segment" class="form-control custom-select custom-select-sm">
                    <option value="">- Any -</option>
                    <option value="4063">CANTUS Database</option>
                    <option value="4064">Bower Sequence Database</option>
                </select>
            </div>
            <div class="form-group m-1 col-lg">
                <label for="generalSearch"><small>General search (siglum, city, description ..)</small></label>
                <input type="text" class="form-control form-control-sm" name="general"
                    placeholder="Enter any part of a word" value="{{ request.GET.general }}" id="generalSearch">
            </div>
            <div class="form-group m-1 col-lg">
                <label for="indexingSearch"><small>Indexing Notes</small></label>
                <input type="text" class="form-control form-control-sm" name="indexing"
                    placeholder="Search for indexers, proofreaders, editors." value="{{ request.GET.indexing }}"
                    id="indexingSearch">
            </div>
        </div>
        <div class="form-row form-row align-items-end">
            <div class="form-group m-1 col-lg">
                <label for="provenanceFilter"><small>Provenance (origin/history)</small></label>
                <select id="provenanceFilter" name="provenance" class="form-control custom-select custom-select-sm">
                    <option value="">- Any -</option>
                    {% for provenance in provenances %}
                        <option value="{{ provenance.id }}">{{ provenance.name }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="form-group m-1 col-lg">
                <label for="centuryFilter"><small>Century</small></label>
                <select id="centuryFilter" name="century" class="form-control custom-select custom-select-sm">
                    <option value="">- Any -</option>
                    {% for century in centuries %}
                        <option value="{{ century.id }}">{{ century.name }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="form-group m-1 col-lg">
                <label for="fullSourceFilter"><small>Full source/Fragment</small></label>
                <select id="fullSourceFilter"  name="fullSource" class="form-control custom-select custom-select-sm">
                    <option value="">- Any -</option>
                    <option value="true">Complete source</option>
                    <option value="false">Fragment</option>
                </select>
            </div>
            <div class="form-group m-1 col-lg">
                <button type="submit" class="btn btn-dark btn-sm" id="btn-submit"> Apply </button>
                <a href="/sources/?segment={{ request.GET.segment }}" class="btn btn-dark btn-sm" id="btn-reset"> Reset </a>
            </div> 
        </div>
    </form>
    {% if sources %}
        <table class="table table-sm small table-bordered table-responsive">
            <thead>
                <tr>
                    <th scope="col" class="text-wrap" style="text-align:center">Source</th>
                    <th scope="col" class="text-wrap" style="text-align:center">Siglum</th>
                    <th scope="col" class="text-wrap" style="text-align:center">Summary</th>
                    <th scope="col" class="text-wrap" style="text-align:center">Date/Origin</th>
                    <th scope="col" class="text-wrap" style="text-align:center">Image Link</th>
                    <th scope="col" class="text-wrap" style="text-align:center">Chants<br>/&nbsp;Melodies</th>
                </tr>
            </thead>
            <tbody>
                {% for source in sources %}
                    <tr>                        
                        <td class="text-wrap" style="text-align:center" title="{{ source.title }}">
                            <a href="{% url 'source-detail' source.id %}"><b>{{ source.title|truncatechars_html:50 }}</b></a>
                        </td>
                        <td class="text-wrap" style="text-align:center">
                            <b>{{ source.siglum }}</b>
                        </td>
                        <td class="text-wrap" style="text-align:center" title="{{ source.summary|default:""|truncatechars_html:500 }}">
                            {{ source.summary|default:""|truncatechars_html:120 }}
                        </td>
                        <td class="text-wrap" style="text-align:center">
                            {% if source.century.exists %}
                                <b><a href="{% url 'century-detail' source.century.first.id %}">{{ source.century.first.name }}</a></b><br>
                            {% endif %}
                            {% if source.provenance %}
                                <a href="{% url 'provenance-detail' source.provenance.id %}">{{ source.provenance.name }}</a>
                            {% endif %}
                        </td>
                        <td class="text-wrap" style="text-align:center">
                            {% if source.image_link %}
                                <a href="{{ source.image_link }}" target="_blank">Images</a>
                            {% endif %}
                        </td>
                        <td class="text-wrap" style="text-align:center">
                            <b>{{ source.number_of_chants|default_if_none:"0" }}</b>
                            {% if source.number_of_melodies %}
                                <br>/ {{ source.number_of_melodies }}
                            {% endif %}
                        </td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    {% else %}
        No sources found.
    {% endif %}
    {% include "pagination.html" %}
</div>
{% endblock %}