{% extends 'base.html.twig' %}

{% block nav_title %}<i class="fas fa-users"></i>&nbsp;&nbsp;<span class="text-danger">Platform</span> - NRPS membership details{% endblock %}

{% block body %}
<div class="card bg-light">
    <div class="card-header">
        <ul class="nav nav-tabs nav-fill card-header-tabs" id="pills-tab" role="tablist">
            <li class="nav-item">
                <a class="nav-link active" id="pills-details-tab" data-toggle="pill" href="#pills-details" role="tab" aria-controls="pills-details" aria-selected="true">
                    <i class="fas fa-info-circle"></i>&nbsp;Details
                </a>
            </li>
            <li class="nav-item">
                <a a class="nav-link" id="pills-members-tab" data-toggle="pill" href="#pills-members" role="tab" aria-controls="pills-members" aria-selected="false">
                    <i class="fas fa-users"></i>&nbsp;Members  <span class="badge badge-pill badge-secondary">{{ membership.members|length }}</span>
                </a>
            </li>
        </ul>
    </div>
    <div class="card-body">
        <div class="tab-content" id="pills-tabContent">
            <div class="tab-pane fade show active" id="pills-details" role="tabpanel" aria-labelledby="pills-details-tab">
                <div class="row">
                    <div class="col-md-6">
                        <dl class="list-unstyled">
                            <dt>Identifier</dt>
                            <dd><code>{{ membership.identifier }}</code></dd>
                            <dt>Members</dt>
                            <dd>{{ membership.members.count|default('n/a') }}</dd>
                            <dt>NRPS service url</dt>
                            {% set nrpsUrl = absolute_app_url('platform_service_nrps', {'contextIdentifier': membership.context.identifier, 'membershipIdentifier': membership.identifier}) %}
                            <dd>
                                <a href="{{ nrpsUrl }}" target="_blank">{{ nrpsUrl }}</a>
                            </dd>
                        </dl>
                    </div>
                    <div class="col-md-6">
                        <dl class="list-unstyled">
                            <dt>Context identifier</dt>
                            <dd><code>{{ membership.context.identifier }}</code></dd>
                            <dt>Context label</dt>
                            <dd>{{ membership.context.label|default('n/a') }}</dd>
                            <dt>Context title</dt>
                            <dd>{{ membership.context.title|default('n/a') }}</dd>
                        </dl>
                    </div>
                </div>
            </div>
            <div class="tab-pane fade" id="pills-members" role="tabpanel" aria-labelledby="pills-members-tab">
                {% if membership.members|length != 0 %}
                    <div class="input-group mb-3">
                        <input type="text" id="memberSearch" class="form-control" placeholder="Search">
                        <div class="input-group-append">
                            <button id="memberSearchReset" class="btn-secondary btn"><i class="fas fa-undo-alt"></i>&nbsp;Reset</button>
                        </div>
                    </div>
                    <pre>
                        <code id="memberZone" class="language-json">{{ membership.members|json_encode(constant('JSON_PRETTY_PRINT') + constant('JSON_UNESCAPED_SLASHES')) }}</code>
                    </pre>
                {% else %}
                    <div class="alert alert-dark alert-no-margin-bottom" role="alert">
                        <i class="fas fa-ban"></i>&nbsp;No members found
                    </div>
                {% endif %}
            </div>
        </div>
    </div>
    <div class="card-footer">
        <div class="btn-group float-right" role="group" aria-label="Basic example">
            {% if membership.identifier != 'default' %}
            <a class="btn btn-primary text-white" href="{{ path('platform_nrps_edit_membership', {'membershipIdentifier': membership.identifier}) }}">
                <i class="fas fa-edit"></i>&nbsp;Edit
            </a>
            <a class="btn btn-danger text-white" href="{{ path('platform_nrps_delete_membership', {'membershipIdentifier': membership.identifier}) }}" onclick="return confirm('Are you sure?')">
                <i class="fas fa-trash-alt"></i>&nbsp;Delete
            </a>
            {% endif %}
            <a class="btn btn-secondary text-white" href="{{ path('platform_nrps_list_memberships') }}">
                <i class="fas fa-undo-alt"></i>&nbsp;Back to list
            </a>
        </div>
    </div>
</div>
{% endblock body %}

{% block scripts %}
    <script>
        $("#memberSearch").on("input", function(){
            $("#memberZone").unmark({
                done: function() {
                    $("#memberZone").mark($("#memberSearch").val());
                }
            });
        });

        $("#memberSearchReset").click(function(){
            $("#memberSearch").val("");
            $("#memberZone").unmark();
        });

        hljs.initHighlightingOnLoad();
    </script>
{% endblock %}