{% if (resource.methods or (resource.description and resource.parentUrl)) %}
  <div class="panel panel-white resource-modal">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a class="collapsed" data-toggle="collapse" href="#panel_{{ resource.uniqueId }}">
          <span class="parent">{{ resource.parentUrl }}</span>{{ resource.relativeUri }}
        </a>

        <span class="methods">
          {% for method in resource.methods %}
            <a href="#{{ resource.uniqueId }}_{{ method.method }}"><!-- modal shown by hashchange event -->
              <span class="badge badge_{{ method.method }}">{{ method.method }}{% if method.securedBy.length %} <span class="glyphicon glyphicon-lock" title="Authentication required"></span>{% endif %}</span>
            </a>
          {% endfor %}
        </span>
      </h4>
    </div>

    <div id="panel_{{ resource.uniqueId }}" class="panel-collapse collapse">
      <div class="panel-body">
        {% if resource.parentUrl %}
          {% if resource.description %}
            <div class="resource-description">
{% markdown %}
{{ resource.description }}
{% endmarkdown %}
            </div>
          {% endif %}
        {% endif %}

        <div class="list-group">
          {% for method in resource.methods %}
            <div onclick="window.location.href = '#{{ resource.uniqueId }}_{{ method.method }}'" class="list-group-item">
              <span class="badge badge_{{ method.method }}">{{ method.method }}{% if method.securedBy.length %} <span class="glyphicon glyphicon-lock" title="Authentication required"></span>{% endif %}</span>
              <div class="method_description">
{% markdown %}
{{ method.description}}
{% endmarkdown %}
              </div>
              <div class="clearfix"></div>
            </div>
          {% endfor %}
        </div>
      </div>
    </div>

    {% for method in resource.methods %}
      <div class="modal fade" tabindex="0" id="{{ resource.uniqueId }}_{{ method.method }}">
        <div class="modal-dialog modal-lg">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
              <h4 class="modal-title" id="myModalLabel">
                <span class="badge badge_{{ method.method }}">{{ method.method }}{% if method.securedBy.length %} <span class="glyphicon glyphicon-lock" title="Authentication required"></span>{% endif %}</span>
                <span class="parent">{{ resource.parentUrl }}</span>{{ resource.relativeUri }}
              </h4>
            </div>

            <div class="modal-body">
              {% if method.description %}
                <div class="alert alert-info">
{% markdown %}
{{ method.description}}
{% endmarkdown %}
                </div>
              {% endif %}

              {% if method.securedBy.length %}
                {% for securedBy in method.securedBy %}
                  {% if securedBy %}
                    <div class="alert alert-warning">
                      {% set securityScheme = securitySchemes[securedBy.schemeName] %}
                      <span class="glyphicon glyphicon-lock" title="Authentication required"></span>
                      Secured by <b>{{securityScheme.displayName}}</b>
                      {% if securedBy.scopes %}
                        with scopes:
                        <ul>
                          {% for scope in securedBy.scopes %}
                            <li>{{scope}}</li>
                          {% endfor %}
                        </ul>
                      {% endif %}
                      {% if securityScheme.description %}
{% markdown %}
{{ securityScheme.description }}
{% endmarkdown %}
                      {% endif %}
                    </div>
                  {% endif %}
                {% endfor %}
              {% endif %}

              <!-- Nav tabs -->
              <ul class="nav nav-tabs">
                {% if method.allUriParameters.length or method.queryString or method.queryParameters or method.headers or method.body or method.annotations.length %}
                  <li class="active">
                    <a href="#{{ resource.uniqueId }}_{{ method.method }}_request" data-toggle="tab">Request</a>
                  </li>
                {% endif %}

                {% if method.responses %}
                  <li{%
                    if not method.allUriParameters.length and not method.queryParameters
                    and not method.queryString
                    and not method.headers and not method.body and not method.annotations.length
                    %} class="active"{%
                    endif
                    %}>
                    <a href="#{{ resource.uniqueId }}_{{ method.method }}_response" data-toggle="tab">Response</a>
                  </li>
                {% endif %}

                {% if method.securedBy.length %}
                  <li>
                    <a href="#{{ resource.uniqueId }}_{{ method.method }}_securedby" data-toggle="tab">Security</a>
                  </li>
                {% endif %}
              </ul>

              <!-- Tab panes -->
              <div class="tab-content">
                {% if method.allUriParameters.length or method.queryString or method.queryParameters or method.headers or method.body or method.annotations.length %}
                  <div class="tab-pane active" id="{{ resource.uniqueId }}_{{ method.method }}_request">
                    {% if resource.allUriParameters.length %}
                      <h3>URI Parameters</h3>
                      <ul>
                        {% for item in resource.allUriParameters %}
                          {% include "./item.nunjucks" %}
                        {% endfor %}
                      </ul>
                    {% endif %}

                    {% if method.annotations.length %}
                      <h3>Annotations</h3>
                      <ul>
                        {% for item in method.annotations %}
                          {% include "./item.nunjucks" %}
                        {% endfor %}
                      </ul>
                    {% endif %}

                    {% if method.headers.length %}
                      <h3>Headers</h3>
                      <ul>
                        {% for item in method.headers %}
                          {% include "./item.nunjucks" %}
                        {% endfor %}
                      </ul>
                    {% endif %}

                    {% if method.queryString and method.queryString.properties.length %}
                      <h3>Query String</h3>
                      <ul>
                        {% for item in method.queryString.properties %}
                          {% include "./item.nunjucks" %}
                        {% endfor %}
                      </ul>
                    {% endif %}

                    {% if method.queryParameters.length %}
                      <h3>Query Parameters</h3>
                      <ul>
                        {% for item in method.queryParameters %}
                          {% include "./item.nunjucks" %}
                        {% endfor %}
                      </ul>
                    {% endif %}

                    {% if method.body %}
                      <h3>Body</h3>
                      {% for b in method.body %}
                        <p><strong>Media type</strong>: {{ b.key }}</p>

                        {% if b.type %}
                          {% if isStandardType(b.type) %}
                            {% if b.type === 'array' and b.items %}
                              <p><strong>Type</strong>: array of {{ b.items.originalType | d(b.items.type) | d(b.items) }}</p>
                            {% elif b.type === 'union' and b.anyOf.length %}
                              <p><strong>Possible types</strong>:
                                <ul>
                                  {% for super in b.anyOf %}
                                    <li>
                                      <p><strong>{{ super.displayName }}</strong></p>
                                      <div class="items">
                                        <ul>
                                          {% for item in super.properties %}
                                            {% include "./item.nunjucks" %}
                                          {% endfor %}
                                        </ul>
                                      </div>
                                    </li>
                                  {% endfor %}
                                </ul>
                              </p>
                            {% else %}
                              <p><strong>Type</strong>: {{ b.type }}</p>
                            {% endif %}
                          {% else %}
                            <p><strong>Type</strong>:</p>
                            <pre><code>{{ b.type | escape }}</code></pre>
                          {% endif %}
                        {% endif %}

                        {% if b.content %}
                          <p><strong>Content</strong>:</p>
                          <pre><code>{{ b.content | escape }}</code></pre>
                        {% endif %}

                        {% if b.items and b.items.properties %}
                          {% if isStandardType(b.items) %}
                            <p><strong>Items</strong>: {{ b.items }}</p>
                          {% endif %}

                          {% if not isStandardType(b.items) %}
                            <p><strong>Items</strong>: {{ b.items.displayName }}</p>

                            {% if b.items.properties or b.items.examples.length %}
                              <div class="items">
                                {% if b.items.properties %}
                                  <ul>
                                    {% for item in b.items.properties %}
                                      {% include "./item.nunjucks" %}
                                    {% endfor %}
                                  </ul>
                                {% endif %}

                                {# Request - Array item examples #}
                                {% set parent = b.items %}
                                {% include "./examples.nunjucks" %}
                              </div>
                            {% endif %}
                          {% endif %}
                        {% endif %}

                        {% if b.properties.length %}
                          <strong>Properties</strong>
                          <ul>
                            {% for item in b.properties %}
                              {% include "./item.nunjucks" %}
                            {% endfor %}
                          </ul>
                        {% endif %}

                        {# Request - Body examples #}
                        {% set parent = b %}
                        {% include "./examples.nunjucks" %}
                      {% endfor %}
                    {% endif %}
                  </div>
                {% endif %}

                {% if method.responses %}
                  <div class="tab-pane{%
                    if not method.allUriParameters.length and not method.queryParameters.length
                    and not method.queryString
                    and not method.headers.length and not method.body.length and not method.annotations.length
                    %} active{%
                    endif
                    %}" id="{{ resource.uniqueId }}_{{ method.method }}_response">
                    {% for response in method.responses %}
                      <h2>HTTP status code <a href="http://httpstatus.es/{{ response.code }}" target="_blank">{{ response.code }}</a></h2>
{% markdown %}
{{ response.description }}
{% endmarkdown %}

                      {% if response.headers.length %}
                        <h3>Headers</h3>
                        <ul>
                          {% for item in response.headers %}
                            {% include "./item.nunjucks" %}
                          {% endfor %}
                        </ul>
                      {% endif %}

                      {% if response.body.length %}
                        <h3>Body</h3>
                        {% for b in response.body %}
                          <p><strong>Media type</strong>: {{ b.key }}</p>

                          {% if b.type %}
                            {% if isStandardType(b.type) %}
                              {% if b.type === 'array' and b.items %}
                                <p><strong>Type</strong>: array of {{ b.items.originalType | d(b.items.type) | d(b.items) }}</p>
                              {% elif b.type === 'union' and b.anyOf.length %}
                                <p><strong>Possible types</strong>:
                                  <ul>
                                    {% for super in b.anyOf %}
                                      <li>
                                        <p><strong>{{ super.displayName }}</strong></p>
                                        <div class="items">
                                          <ul>
                                            {% for item in super.properties %}
                                              {% include "./item.nunjucks" %}
                                            {% endfor %}
                                          </ul>
                                        </div>
                                      </li>
                                    {% endfor %}
                                  </ul>
                                </p>
                              {% else %}
                                <p><strong>Type</strong>: {{ b.type }}</p>
                              {% endif %}
                            {% else %}
                              <p><strong>Type</strong>:</p>
                              <pre><code>{{ b.type | escape }}</code></pre>
                            {% endif %}
                          {% endif %}

                          {% if b.content %}
                            <p><strong>Content</strong>:</p>
                            <pre><code>{{ b.content | escape }}</code></pre>
                          {% endif %}

                          {% if b.items and b.items.properties %}
                            {% if isStandardType(b.items) %}
                              <p><strong>Items</strong>: {{ b.items }}</p>
                            {% endif %}

                            {% if not isStandardType(b.items) %}
                              <p><strong>Items</strong>: {{ b.items.displayName }}</p>

                              {% if b.items.properties or b.items.examples.length %}
                                <div class="items">
                                  {% if b.items.properties %}
                                    <ul>
                                      {% for item in b.items.properties %}
                                        {% include "./item.nunjucks" %}
                                      {% endfor %}
                                    </ul>
                                  {% endif %}

                                  {# Response - Array item examples #}
                                  {% set parent = b.items.examples %}
                                  {% include "./examples.nunjucks" %}
                                </div>
                              {% endif %}
                            {% endif %}
                          {% endif %}

                          {% if b.properties.length %}
                            <strong>Properties</strong>
                            <ul>
                              {% for item in b.properties %}
                                {% include "./item.nunjucks" %}
                              {% endfor %}
                            </ul>
                          {% endif %}

                          {# Response - Body examples #}
                          {% set parent = b %}
                          {% include "./examples.nunjucks" %}
                        {% endfor %}
                      {% endif %}
                    {% endfor %}
                  </div>
                {% endif %}

                {% if method.securedBy.length %}
                  <div class="tab-pane" id="{{ resource.uniqueId }}_{{ method.method }}_securedby">
                    {% for securedBy in method.securedBy %}
                      {% set securityScheme = securitySchemes[securedBy.schemeName] %}
                      <h1>Secured by {{ securityScheme.displayName }}</h1>

                      {% if securityScheme.describedBy.headers.length %}
                        <h3>Headers</h3>
                        <ul>
                          {% for item in securityScheme.describedBy.headers %}
                            {% include "./item.nunjucks" %}
                          {% endfor %}
                        </ul>
                      {% endif %}

                      {% if securityScheme.describedBy.queryParameters.length %}
                        <h3>Query Parameters</h3>
                        <ul>
                          {% for item in securityScheme.describedBy.queryParameters %}
                            {% include "./item.nunjucks" %}
                          {% endfor %}
                        </ul>
                      {% endif %}

                      {% for response in securityScheme.describedBy.responses %}
                        <h2>HTTP status code <a href="http://httpstatus.es/{{ response.code }}" target="_blank">{{ response.code }}</a></h2>
{% markdown %}
{{ response.description }}
{% endmarkdown %}
                        {% if response.headers.length %}
                          <h3>Headers</h3>
                          <ul>
                            {% for item in response.headers %}
                              {% include "./item.nunjucks" %}
                            {% endfor %}
                          </ul>
                        {% endif %}

                        {% if response.body.length %}
                          <h3>Body</h3>
                          {% for b in response.body %}
                            <p><strong>Media type</strong>: {{ b.key }}</p>

                            {% if b.type %}
                              {% if isStandardType(b.type) %}
                                {% if b.type === 'array' and b.items %}
                                  <p><strong>Type</strong>: array of {{ b.items.originalType | d(b.items.type) | d(b.items) }}</p>
                                {% elif b.type === 'union' and b.anyOf.length %}
                                  <p><strong>Possible types</strong>:
                                    <ul>
                                      {% for super in b.anyOf %}
                                        <li>
                                          <p><strong>{{ super.displayName }}</strong></p>
                                          <div class="items">
                                            <ul>
                                              {% for item in super.properties %}
                                                {% include "./item.nunjucks" %}
                                              {% endfor %}
                                            </ul>
                                          </div>
                                        </li>
                                      {% endfor %}
                                    </ul>
                                  </p>
                                {% else %}
                                  <p><strong>Type</strong>: {{ b.type }}</p>
                                {% endif %}
                              {% else %}
                                <p><strong>Type</strong>:</p>
                                <pre><code>{{ b.type | escape }}</code></pre>
                              {% endif %}
                            {% endif %}

                            {% if b.content %}
                              <p><strong>Content</strong>:</p>
                              <pre><code>{{ b.content | escape }}</code></pre>
                            {% endif %}

                            {% if b.items and b.items.properties %}
                              {% if isStandardType(b.items) %}
                                <p><strong>Items</strong>: {{ b.items }}</p>
                              {% endif %}

                              {% if not isStandardType(b.items) %}
                                <p><strong>Items</strong>: {{ b.items.displayName }}</p>

                                {% if b.items.properties or b.items.examples.length %}
                                  <div class="items">
                                    {% if b.items.properties %}
                                      <ul>
                                        {% for item in b.items.properties %}
                                          {% include "./item.nunjucks" %}
                                        {% endfor %}
                                      </ul>
                                    {% endif %}

                                    {# Response - Array item examples #}
                                    {% set parent = b.items.examples %}
                                    {% include "./examples.nunjucks" %}
                                  </div>
                                {% endif %}
                              {% endif %}
                            {% endif %}

                            {% if b.properties.length %}
                              <strong>Properties</strong>
                              <ul>
                                {% for item in b.properties %}
                                  {% include "./item.nunjucks" %}
                                {% endfor %}
                              </ul>
                            {% endif %}

                            {# Response - Body examples #}
                            {% set parent = b %}
                            {% include "./examples.nunjucks" %}
                          {% endfor %}
                        {% endif %}

                      {% endfor %}

                    {% endfor %}
                  </div>
                {% endif %}
              </div>
            </div>
          </div>
        </div>
      </div>
    {% endfor %}
  </div>
{% endif %}

{% for resource in resource.resources %}
  {% include "./resource.nunjucks" %}
{% endfor %}